Categories field implementation

client/components/planning-editor-standalone/field-definitions/category-field.ts

@@ -0,0 +1,38 @@
+import {IDropdownConfigVocabulary, IAuthoringFieldV2, IVocabularyItem} from 'superdesk-api';
+import {superdeskApi} from '../../../superdeskApi';
+import {IFieldGetter} from '.';
+
+export const getCategoriesField: IFieldGetter = () => ({
+    fieldId: 'anpa_category',
+    getField: ({id, required}) => {
+        const fieldConfig: IDropdownConfigVocabulary = {
+            source: 'vocabulary',
+            vocabularyId: 'categories',
+            multiple: true,
+            required: required,
+        };
+
+        const field: IAuthoringFieldV2 = {
+            id: id,
+            name: superdeskApi.localization.gettext('Categories'),
+            fieldType: 'dropdown',
+            fieldConfig: fieldConfig,
+        };
+
+        return field;
+    },
+    storageAdapter: {
+        storeValue: (item, operationalValue: Array<string>) => {
+            const vocabulary = superdeskApi.entities.vocabulary.getAll().get('categories');
+            const vocabularyItems = new Map<IVocabularyItem['qcode'], IVocabularyItem>(
+                vocabulary.items.map((item) => [item.qcode, item]),
+            );
+
+            return {
+                ...item,
+                anpa_category: operationalValue.map((qcode) => vocabularyItems.get(qcode)),
+            };
+        },
+        retrieveStoredValue: (item, fieldId) => (item[fieldId] ?? []).map(({qcode}) => qcode),
+    },
+});

client/components/planning-editor-standalone/field-definitions/index.ts

@@ -11,6 +11,7 @@ import {getDateTimeField} from './date-time-config';
 import {IFieldDefinitions, IFieldDefinition} from './interfaces';
 import {getTextFieldConfig} from './text-field-config';
 import {getPlaceField} from './place-field';
+import {getCategoriesField} from './category-field';
 import {getAgendasField} from './agendas-field';
 
 export function getFieldDefinitions(): IFieldDefinitions {
@@ -66,6 +67,7 @@ export function getFieldDefinitions(): IFieldDefinitions {
         },
         getPlaceField(),
         getAgendasField(),
+        getCategoriesField(),
         {
             fieldId: 'coverages',
             getField: ({id, required}) => {

client/components/planning-editor-standalone/profile-fields.ts

@@ -1,4 +1,3 @@
-import {flatMap} from 'lodash';
 import {planningApi} from '../../superdeskApi';
 import {getEditorFormGroupsFromProfile} from '../../utils/contentProfiles';
 
@@ -14,13 +13,18 @@ interface ICustomVocabularyField extends IBaseField<'custom_vocabulary'> {
 
 type IFieldConverted = IBaseField<'normal'> | ICustomVocabularyField;
 
+const FIELDS_TO_FILTER = [
+    'associated_event',
+];
+
 /**
  * A function that handles planning profile field types so they can be used in authoring react.
  */
 export const getPlanningProfileFields = (): Array<IFieldConverted> => {
     const planningProfile = planningApi.contentProfiles.get('planning');
     const planningGroups = getEditorFormGroupsFromProfile(planningProfile);
-    const planningFieldIds = Object.values(planningGroups).flatMap((x) => x.fields);
+    const planningFieldIds = Object.values(planningGroups).flatMap((x) => x.fields)
+        .filter((x) => !FIELDS_TO_FILTER.includes(x));
     const convertedFieldIds: Array<IFieldConverted> = [];
 
     for (const fieldId of planningFieldIds) {

client/components/planning-editor-standalone/storage-adapter.ts

@@ -6,7 +6,7 @@ import {
     IStorageAdapter,
 } from 'superdesk-api';
 import {superdeskApi} from '../../superdeskApi';
-import {getFieldDefinitions} from './field-definitions';
+import {getFieldDefinitions} from './field-definitions/index';
 
 export const storageAdapterPlanningItem: IStorageAdapter<IPlanningItem> = {
     storeValue: (value, fieldId, item, config, fieldType) => {