Fix qa reported bugs

client/actions/autosave.ts

@@ -1,5 +1,5 @@
 import {AUTOSAVE, ITEM_TYPE} from '../constants';
-import {get, cloneDeep} from 'lodash';
+import {get, cloneDeep, partition} from 'lodash';
 import moment from 'moment';
 
 import * as selectors from '../selectors';
@@ -111,6 +111,16 @@ const save = (original, updates) => (
             updateFields.lock_time = moment();
         }
 
+        if (updateFields.related_events && itemType === 'planning') {
+            const [
+                newEvents,
+                existingEvents,
+            ] = partition(cloneDeep(updateFields.related_events), (x) => isTemporaryId(x._id));
+
+            updateFields.related_events = existingEvents;
+            updateFields._unsaved_related_events = newEvents;
+        }
+
         return api(`${itemType}_autosave`).save(
             original || {},
             updateFields

client/actions/planning/api.ts

@@ -375,7 +375,7 @@ const save = (original, planUpdates) => (
             const originalItem = cloneDeep(originalPlan);
 
             // remove all properties starting with _ or lock_,
-            let updates = pickBy(
+            const updates: Partial<IPlanningItem> = pickBy(
                 cloneDeep(planUpdates),
                 (v, k) => ((k === TO_BE_CONFIRMED_FIELD || !k.startsWith('_')) && !k.startsWith('lock_'))
             );

client/api/editor/item_events.ts

@@ -144,7 +144,7 @@ export function getEventsInstance(type: EDITOR_TYPE): IEditorAPI['item']['events
         });
     }
 
-    function removePlanningItem(item: DeepPartial<IPlanningItem>) {
+    function unlinkPlanning(item: DeepPartial<IPlanningItem>) {
         const editor = planningApi.editor(type);
         const event = editor.form.getDiff<IEventItem>();
         const plans = (event.associated_plannings || []).filter(
@@ -227,7 +227,7 @@ export function getEventsInstance(type: EDITOR_TYPE): IEditorAPI['item']['events
         getGroupsForItem,
         getRelatedPlanningDomRef,
         addPlanningItem,
-        removePlanningItem,
+        unlinkPlanning,
         updatePlanningItem,
         onEventDatesChanged,
     };

client/api/editor/item_planning.ts

@@ -21,6 +21,7 @@ import {
 
 import {CoveragesBookmark, AddCoverageBookmark} from '../../components/Editor/bookmarks';
 import {AssociatedEventItem} from '../../components/fields/editor/AssociatedEventItem';
+import {isTemporaryId} from '../../utils';
 
 export function getCoverageFields(): ISearchProfile {
     const fields = getGroupFieldsSorted(planningApi.contentProfiles.get('coverage'))
@@ -81,6 +82,49 @@ export function getPlanningInstance(type: EDITOR_TYPE): IEditorAPI['item']['plan
         return editor.dom.fields[field];
     }
 
+    function updateEventItem(
+        original: DeepPartial<IEventItem>,
+        updates: DeepPartial<IEventItem>,
+        scrollOnChange: boolean
+    ) {
+        const editor = planningApi.editor(type);
+        const planning = editor.form.getDiff<IPlanningItem>();
+        const events = cloneDeep(planning.related_events || []);
+        const index = events.findIndex(
+            (event) => event._id === original._id
+        );
+
+        if (index < 0) {
+            return;
+        }
+
+        events[index] = {
+            ...original,
+            ...updates,
+        };
+
+        const updateMainField = () => {
+            editor.form.changeField('related_events', events)
+                .then(() => {
+                    if (scrollOnChange) {
+                        getRelatedEventsDomRef(original._id).current?.scrollIntoView();
+                    }
+                });
+        };
+
+        // On saving of a temporary event from the embedded form itself,
+        // we must also remove it from _unsaved_related_events
+        // otherwise trying to save the same item twice would happen
+        if (isTemporaryId(original._id) && !isTemporaryId(updates._id)) {
+            editor.form.changeField(
+                '_unsaved_related_events',
+                planning._unsaved_related_events.filter((x) => x._id != original._id)
+            ).then(updateMainField);
+        } else {
+            updateMainField();
+        }
+    }
+
     function getRelatedEventsDomRef(eventId: IEventItem['_id']): RefObject<AssociatedEventItem> {
         const editor = planningApi.editor(type);
         const field = `planning-item--${eventId}`;
@@ -92,13 +136,19 @@ export function getPlanningInstance(type: EDITOR_TYPE): IEditorAPI['item']['plan
         return editor.dom.fields[field];
     }
 
-    function removeEventItem(item: DeepPartial<IEventItem>): void {
+    function unlinkEvent(item: DeepPartial<IEventItem>): void {
         const editor = planningApi.editor(type);
         const planning = editor.form.getDiff<IPlanningItem>();
         const events = (planning.related_events || []).filter(
             (event) => event._id !== item._id
         );
 
+        const unsavedEvents = (planning._unsaved_related_events || []).filter(
+            (event) => event._id !== item._id
+        );
+
+        editor.form.changeField('_unsaved_related_events', unsavedEvents);
+
         editor.form.changeField('related_events', events)
             .then(() => {
                 const lastEvent = events[events.length - 1];
@@ -142,8 +192,9 @@ export function getPlanningInstance(type: EDITOR_TYPE): IEditorAPI['item']['plan
         getGroupsForItem,
         getCoverageFields,
         getRelatedEventsDomRef,
-        removeEventItem,
+        unlinkEvent,
         getCoverageFieldDomRef,
         addCoverages,
+        updateEventItem,
     };
 }

client/api/events.ts

@@ -136,7 +136,7 @@ function create(updates: Partial<IEventItem>): Promise<Array<IEventItem>> {
     return superdeskApi.dataApi.create<IEventItem | IRestApiResponse<IEventItem>>('events', {
         ...updates,
         associated_plannings: undefined,
-        embedded_planning: updates.associated_plannings.map((planning) => ({
+        embedded_planning: (updates.associated_plannings ?? []).map((planning) => ({
             update_method: planning.update_method ?? planningDefaultCreateMethod,
             coverages: planning.coverages.map((coverage) => ({
                 coverage_id: coverage.coverage_id,

client/components/AttachmentsInputStandalone.tsx

@@ -33,11 +33,11 @@ export class AttachmentsInputStandalone extends React.PureComponent<IProps, ISta
             <Spacer v gap="16" noWrap>
                 <WithLiveResources
                     resources={[
-                        {resource: 'planning_files', ids: this.props.value},
+                        {resource: 'planning_files', ids: this.props.value ?? []},
                     ]}
                 >
                     {(res) => {
-                        const files: Array<IFile> = res[0]._items;
+                        const files: Array<IFile> = res?.[0]?._items ?? [];
 
                         return (
                             <Spacer v gap="4">

client/components/Events/EventEditor/index.tsx

@@ -186,7 +186,7 @@ class EventEditorComponent extends React.PureComponent<IProps> {
                             editor.item.events.getRelatedPlanningDomRef(value._id)
                         ),
                         addPlanningItem: editor.item.events.addPlanningItem,
-                        removePlanningItem: editor.item.events.removePlanningItem,
+                        unlinkPlanning: editor.item.events.unlinkPlanning,
                         updatePlanningItem: editor.item.events.updatePlanningItem,
                     },
                 }}

client/components/Events/EventMetadata/RelatedEventListItem.tsx

@@ -2,7 +2,6 @@ import * as React from 'react';
 import {connect} from 'react-redux';
 
 import {IEventItem, ILockedItems} from '../../../interfaces';
-import {superdeskApi} from '../../../superdeskApi';
 import {ICON_COLORS} from '../../../constants';
 
 import {eventUtils, lockUtils} from '../../../utils';

client/components/Events/RecurringRulesInput/DaysOfWeekInput.tsx

@@ -110,7 +110,7 @@ export class DaysOfWeekInput extends React.Component<IProps, IState> {
                 />
                 <Row
                     flex={true}
-                    noPadding={invalid}
+                    noPadding={true}
                 >
                     {Object.keys(this.state).map((day: keyof IState) => (
                         <LineInput