diff --git a/scripts/apps/authoring-react/field-adapters/authors.tsx b/scripts/apps/authoring-react/field-adapters/authors.tsx index dc8b3eab50..018807e2bd 100644 --- a/scripts/apps/authoring-react/field-adapters/authors.tsx +++ b/scripts/apps/authoring-react/field-adapters/authors.tsx @@ -67,7 +67,6 @@ export const authors: IFieldAdapter = { lookup: {}, }); }, - canSelectBranchWithChildren: () => false, getLabel: (item: IUserOption | IAuthorRole) => item.name, valueTemplate: valueTemplate, optionTemplate: optionTemplate, diff --git a/scripts/apps/authoring-react/field-adapters/subject.tsx b/scripts/apps/authoring-react/field-adapters/subject.tsx index f2cb942ba9..6d001e053e 100644 --- a/scripts/apps/authoring-react/field-adapters/subject.tsx +++ b/scripts/apps/authoring-react/field-adapters/subject.tsx @@ -1,36 +1,23 @@ -import {mapValues, memoize} from 'lodash'; -import {IArticle, IAuthoringFieldV2, IFieldAdapter, IDropdownTreeConfig, ITreeWithLookup} from 'superdesk-api'; +import { + IArticle, + IAuthoringFieldV2, + IFieldAdapter, + ISubjectCode, + IDropdownConfigManualSource, +} from 'superdesk-api'; import {gettext} from 'core/utils'; -import {arrayToTree, sortTree} from 'core/helpers/tree'; import {store} from 'core/data'; -type ISubjectCode = {qcode: string; name: string; parent?: string}; - export function getSubjectAdapter(): IFieldAdapter { - const getItems: () => ITreeWithLookup = memoize(() => { - const subjectCodes = store.getState().subjectCodes; - - return ({ - nodes: sortTree( - arrayToTree( - Object.values(subjectCodes), - (item) => item.qcode, - (item) => item.parent ?? null, - ).result, - (a, b) => a.name.localeCompare(b.name), - ), - lookup: mapValues(subjectCodes, (value) => ({value})), - }); - }); - return { - getFieldV2: (fieldEditor, fieldSchema) => { - const fieldConfig: IDropdownTreeConfig = { - source: 'dropdown-tree', - getItems, - getLabel: (item: ISubjectCode) => item.name, - getId: (item: ISubjectCode) => item.qcode, - canSelectBranchWithChildren: () => true, + getFieldV2: () => { + const fieldConfig: IDropdownConfigManualSource = { + source: 'manual-entry', + options: Object.values(store.getState().subjectCodes) + .map((x) => ({id: x.qcode, label: x.name, parent: x.parent})), + roundCorners: true, + type: 'text', + canSelectBranchWithChildren: true, multiple: true, }; @@ -43,30 +30,13 @@ export function getSubjectAdapter(): IFieldAdapter { return fieldV2; }, - retrieveStoredValue: (article): Array => { - return (article.subject ?? []) - .filter(({scheme}) => scheme == null) // filter out custom vocabulary data - .map(({qcode, name, parent}) => ({qcode, name, parent})); + retrieveStoredValue: (article): Array => { + return (article.subject ?? []).map((x) => x.qcode); }, - storeValue: (val: Array, article) => { - interface IStorageFormat { - qcode: string; - name: string; - parent?: string; - scheme: string; - } - + storeValue: (val: Array, article) => { return { ...article, - subject: val.map(({qcode, name, parent}) => { - var itemToStore: IStorageFormat = {qcode, name, parent, scheme: null}; - - if (parent != null) { - itemToStore.parent = parent; - } - - return itemToStore; - }), + subject: Object.values(store.getState().subjectCodes).filter((x) => val.includes(x.qcode)), }; }, }; diff --git a/scripts/apps/authoring-react/fields/dropdown/editor-using-manual-source-or-vocabulary.tsx b/scripts/apps/authoring-react/fields/dropdown/editor-using-manual-source-or-vocabulary.tsx index dcc3e1f1d0..040e775412 100644 --- a/scripts/apps/authoring-react/fields/dropdown/editor-using-manual-source-or-vocabulary.tsx +++ b/scripts/apps/authoring-react/fields/dropdown/editor-using-manual-source-or-vocabulary.tsx @@ -80,6 +80,7 @@ export class EditorUsingManualSourceOrVocabulary extends React.PureComponent options} values={selected} + canSelectBranchWithChildren={config.canSelectBranchWithChildren} onChange={(_values) => { const ids = _values.map((val) => val.id); diff --git a/scripts/core/superdesk-api.d.ts b/scripts/core/superdesk-api.d.ts index be14ae9e89..a2691b98be 100644 --- a/scripts/core/superdesk-api.d.ts +++ b/scripts/core/superdesk-api.d.ts @@ -355,6 +355,7 @@ declare module 'superdesk-api' { vocabularyId: IVocabulary['_id']; multiple: boolean; filter?(vocabulary: IVocabularyItem): boolean; + canSelectBranchWithChildren?: boolean; } export interface IDropdownConfigRemoteSource extends ICommonFieldConfig { @@ -366,18 +367,22 @@ declare module 'superdesk-api' { ): void; getLabel(item: unknown): string; getId(item: unknown): string; - canSelectBranchWithChildren?(branch: ITreeNode): boolean; + canSelectBranchWithChildren?: boolean; optionTemplate?: React.ComponentType<{item: unknown}>; valueTemplate?: React.ComponentType<{item: unknown}>; multiple: boolean; } + /** + * Prioritize using IDropdownConfigManualSource/IDropdownConfigVocabulary/IDropdownConfigRemoteSource + * if any of those can satisfy your use-case + */ export interface IDropdownTreeConfig extends ICommonFieldConfig { source: 'dropdown-tree'; getItems(): ITreeWithLookup; getLabel(item: unknown): string; getId(item: unknown): string; - canSelectBranchWithChildren?(branch: ITreeNode): boolean; + canSelectBranchWithChildren?: boolean; optionTemplate?: React.ComponentType<{item: unknown}>; valueTemplate?: React.ComponentType<{item: unknown}>; multiple: boolean; @@ -389,6 +394,7 @@ declare module 'superdesk-api' { options: Array; roundCorners: boolean; multiple: boolean; + canSelectBranchWithChildren?: boolean; } export type IDropdownConfig = diff --git a/scripts/core/ui/components/MultiSelectTreeWithTemplate.tsx b/scripts/core/ui/components/MultiSelectTreeWithTemplate.tsx index 6a29b23b11..19209f8ef3 100644 --- a/scripts/core/ui/components/MultiSelectTreeWithTemplate.tsx +++ b/scripts/core/ui/components/MultiSelectTreeWithTemplate.tsx @@ -10,7 +10,7 @@ interface IPropsBase { valueTemplate?: React.ComponentType<{item: T}>; getId(item: T): string; getLabel(item: T): string; - canSelectBranchWithChildren?(branch: ITreeNode): boolean; + canSelectBranchWithChildren?: boolean; allowMultiple?: boolean; readOnly?: boolean; } @@ -58,7 +58,7 @@ export class MultiSelectTreeWithTemplate extends React.PureComponent } valueTemplate={(item, Wrapper) => } allowMultiple={this.props.allowMultiple} @@ -84,7 +84,7 @@ export class MultiSelectTreeWithTemplate extends React.PureComponent } valueTemplate={(item) => } allowMultiple={this.props.allowMultiple}