Merge branch 'develop' into authoring-full-width-improvement

e2e/client/playwright/authoring.spec.ts

@@ -82,3 +82,52 @@ test('save button from unsaved changes modal', async ({page}) => {
     await expect(page.locator(s('authoring'))).not.toBeVisible();
     await expect(page.locator(s('monitoring-view', 'article-item=new article'))).toBeVisible();
 });
+
+test('setting embargo', async ({page}) => {
+    const monitoring = new Monitoring(page);
+
+    await restoreDatabaseSnapshot();
+    await page.goto('/#/workspace/monitoring');
+
+    await monitoring.selectDeskOrWorkspace('Sports');
+
+    await expect(page.locator(
+        s('monitoring-group=Sports / Working Stage', 'article-item=test sports story'),
+    )).toBeVisible();
+
+    await expect(page.locator(
+        s('monitoring-group=Sports / Working Stage', 'article-item=test sports story'),
+    )).not.toContainText('embargo');
+
+    await page.locator(
+        s('monitoring-group=Sports / Working Stage', 'article-item=test sports story'),
+    ).dblclick();
+
+    await page.locator(s('authoring', 'open-send-publish-pane')).click();
+
+    const embargoDate = '09/09/' + ((new Date()).getFullYear() + 1);
+    const embargoTime = '04:00';
+
+    await page.locator(
+        s('authoring', 'interactive-actions-panel', 'embargo', 'date-input'),
+    ).pressSequentially(embargoDate);
+
+    await page.locator(
+        s('authoring', 'interactive-actions-panel', 'embargo', 'time-input'),
+    ).pressSequentially(embargoTime);
+
+    await page.locator(s('authoring', 'interactive-actions-panel')).getByRole('button', {name: 'Close'}).click();
+
+    await page.locator(s('authoring-topbar', 'save')).click();
+
+    // make sure label appears inside article item in the monitoring list
+    await expect(page.locator(
+        s('monitoring-group=Sports / Working Stage', 'article-item=test sports story'),
+    )).toContainText('Embargo');
+
+    // make sure label appears inside metadata widget
+    await page.locator(s('authoring-widget=Info')).click();
+    await expect(page.locator(
+        s('authoring-widget-panel=Info'),
+    )).toContainText('embargo');
+});

e2e/client/specs/content_spec.ts

@@ -218,26 +218,6 @@ describe('content', () => {
         element(by.id('closeAuthoringBtn')).click();
     });
 
-    it('can display embargo in metadata when set', () => {
-        workspace.editItem('item3', 'SPORTS');
-
-        el(['open-send-publish-pane']).click();
-
-        setEmbargo();
-
-        authoring.closeSendAndPublish();
-
-        authoring.save();
-        element(by.id('closeAuthoringBtn')).click();
-
-        content.previewItem('item3');
-        element(by.css('[ng-click="vm.current_tab = \'metadata\'"]')).click();
-
-        expect(element(by.css('[datetime="item.embargo"]')).isDisplayed()).toBe(true);
-
-        content.closePreview();
-    });
-
     it('can set embargo and send', () => {
         // Initial steps before proceeding, to get initial state of send buttons.
         workspace.editItem('item3', 'SPORTS');

e2e/client/specs/search_spec.ts

@@ -266,22 +266,6 @@ describe('search', () => {
         authoring.close();
     });
 
-    it('can display embargo item when set', () => {
-        expect(globalSearch.getItems().count()).toBe(16);
-        globalSearch.actionOnItem('Edit', 'item1');
-        authoring.sendToButton.click();
-        authoring.setEmbargo();
-        authoring.closeSendAndPublish();
-        authoring.save();
-        authoring.close();
-
-        const embargoElement = globalSearch.getItem(0).element(by.className('state_embargo'));
-
-        browser.wait(ECE.visibilityOf(embargoElement));
-
-        expect(embargoElement.getText()).toEqual('EMBARGO');
-    });
-
     it('can search scheduled', () => {
         globalSearch.waitForItemCount(16);
         globalSearch.actionOnItem('Edit', 'item9');

scripts/api/article.ts

@@ -66,20 +66,30 @@ export const isIngested = (item: IArticle) =>
     item.state === ITEM_STATE.INGESTED;
 
 function canPublish(item: IArticle): boolean {
-    const deskId = item?.task?.desk;
-
-    if (deskId == null) {
+    if (
+        sdApi.user.hasPrivilege('publish') !== true
+        || item.flags?.marked_for_not_publication === true
+        || item.state === 'draft'
+    ) {
         return false;
     }
 
-    const desk = sdApi.desks.getAllDesks().get(deskId);
+    const $location = ng.get('$location');
 
-    if (desk.desk_type === 'authoring' && appConfig?.features?.noPublishOnAuthoringDesk === true) {
+    if ($location.path() === '/workspace/personal' && appConfig?.features?.publishFromPersonal !== true) {
         return false;
-    }
+    } else {
+        const deskId = item?.task?.desk;
 
-    if (sdApi.user.hasPrivilege('publish') !== true) {
-        return false;
+        if (deskId == null) {
+            return false;
+        }
+
+        const desk = sdApi.desks.getAllDesks().get(deskId);
+
+        if (desk.desk_type === 'authoring' && appConfig?.features?.noPublishOnAuthoringDesk === true) {
+            return false;
+        }
     }
 
     return true;

scripts/apps/authoring-react/authoring-section/authoring-section.tsx

@@ -37,6 +37,11 @@ function groupItemsToRows<T>(items: Array<T>, getWidth: (item: T) => number) {
             rowWidth = rowWidth + itemWidth;
         } else {
             itemGroups.push([]);
+            if (itemWidth === 100) {
+                rowWidth = 100;
+            } else {
+                rowWidth = 0;
+            }
         }
 
         const lastGroup = itemGroups[itemGroups.length - 1];
@@ -85,13 +90,13 @@ export class AuthoringSection<T> extends React.PureComponent<IPropsAuthoringSect
                     backgroundColor: themeApplies ? this.props.uiTheme.backgroundColor : undefined,
                     display: 'flex',
                     flexDirection: 'column',
-                    gap: '10px',
+                    gap: '12px',
                     padding: this.props.padding,
                 }}
             >
                 {
                     grouped.map((group, index) => (
-                        <div key={index} style={{display: 'flex', gap: '10px'}}>
+                        <div key={index} style={{display: 'flex', gap: '12px'}}>
                             {
                                 group.map((field) => {
                                     const canBeToggled = toggledFields[field.id] != null;

scripts/apps/authoring-react/authoring-section/get-field-container.tsx

@@ -30,22 +30,12 @@ export function getFieldContainer(
 
             return (
                 <div className={sectionClassNames?.header}>
-                    <div
-                        style={{
-                            display: 'flex',
-                            justifyContent: 'start',
-                            alignItems: 'center',
-                        }}
-                    >
+                    <Spacer v gap="0">
                         <span
                             className={classNames(
                                 'form-label',
                                 {'form-label--invalid': validationError != null},
                             )}
-                            style={{
-                                width: '90px',
-                                justifyContent: 'end',
-                            }}
                         >
                             <Spacer h gap="8" noGrow noWrap>
                                 <span style={{textAlign: 'end'}}>
@@ -79,7 +69,7 @@ export function getFieldContainer(
                                 )
                             }
                         </div>
-                    </div>
+                    </Spacer>
                 </div>
             );
         }

scripts/apps/authoring/authoring/directives/AuthoringDirective.ts

@@ -672,6 +672,11 @@ export function AuthoringDirective(
             $scope.close = function() {
                 _closing = true;
 
+                // Request to generate html before we pass scope variables
+                for (const fn of ($scope.requestEditor3DirectivesToGenerateHtml ?? [])) {
+                    fn();
+                }
+
                 // returned promise used by superdesk-fi
                 return authoringApiCommon.closeAuthoringStep2($scope, $rootScope);
             };

scripts/apps/authoring/authoring/directives/AuthoringTopbarDirective.ts

@@ -7,6 +7,7 @@ import {appConfig} from 'appConfig';
 import {ITEM_STATE} from 'apps/archive/constants';
 import {IArticleActionInteractive} from 'core/interactive-article-actions-panel/interfaces';
 import {IFullWidthPageCapabilityConfiguration} from 'superdesk-api';
+import {sdApi} from 'api';
 
 /**
  * @ngdoc directive
@@ -64,10 +65,14 @@ export function AuthoringTopbarDirective(
             function getAvailableTabs(): Array<IArticleActionInteractive> {
                 if (scope.isCorrection(scope.item)) {
                     return ['send_to', 'correct'];
-                } else if (scope.item.flags?.marked_for_not_publication === true) {
-                    return ['send_to'];
                 } else {
-                    return ['send_to', 'publish'];
+                    const result: Array<IArticleActionInteractive> = ['send_to'];
+
+                    if (sdApi.article.canPublish(scope.item)) {
+                        result.push('publish');
+                    }
+
+                    return result;
                 }
             }
 

scripts/apps/search/controllers/get-multi-actions.tsx

@@ -224,20 +224,7 @@ export function getMultiActions(
     }
 
     function canPublishItem() {
-        return getSelectedItems().every((item) => {
-            const desk = desks.getCurrentDesk();
-
-            if (privileges.userHasPrivileges({publish: 1})
-                && !(desk.desk_type === 'authoring' && appConfig?.features?.noPublishOnAuthoringDesk)) {
-                if (item.state !== 'draft' && $location.path() !== '/workspace/personal') {
-                    return true;
-                } else if (item.state !== 'draft' && $location.path() === '/workspace/personal') {
-                    return appConfig?.features?.publishFromPersonal;
-                }
-            }
-
-            return false;
-        });
+        return getSelectedItems().every((item) => sdApi.article.canPublish(item));
     }
 
     /**

scripts/core/interactive-article-actions-panel/index-ui.tsx

@@ -74,22 +74,11 @@ export class InteractiveArticleActionsPanel
         const markupV2 = authoringReactViewEnabled && this.props.markupV2 === true;
         const handleUnsavedChanges = this.props.handleUnsavedChanges ?? handleUnsavedChangesDefault;
 
-        const filteredTabs = tabs.filter((tab) => {
-            if (tab === 'publish') {
-                const item = items[0]; // only one item is supported in publishing tab
-                const notForPublication = item?.flags?.marked_for_not_publication ?? false;
-
-                return notForPublication !== true;
-            } else {
-                return true;
-            }
-        });
-
         const panelHeader = (
             <PanelHeader markupV2={markupV2}>
                 <div className="space-between" style={{width: '100%', paddingInlineEnd: 10}}>
                     <TabList
-                        tabs={filteredTabs.map((id) => ({id, label: getTabLabel(id)}))}
+                        tabs={tabs.map((id) => ({id, label: getTabLabel(id)}))}
                         selectedTabId={activeTab}
                         onChange={(tab: IArticleActionInteractive) => {
                             this.setState({

scripts/extensions/broadcasting/src/rundown-items/content-profile.tsx

@@ -95,7 +95,7 @@ const itemTypesConfig: IDropdownConfigVocabulary = {
     source: 'vocabulary',
     vocabularyId: RUNDOWN_ITEM_TYPES_VOCABULARY_ID,
     multiple: false,
-    width: 100,
+    width: 33,
 };
 
 const itemTypeField: IAuthoringFieldV2 = {
@@ -109,7 +109,7 @@ const cameraConfig: IDropdownConfigVocabulary = {
     source: 'vocabulary',
     vocabularyId: CAMERA,
     multiple: true,
-    width: 100,
+    width: 33,
 };
 
 const cameraField: IAuthoringFieldV2 = {
@@ -124,7 +124,7 @@ const durationField: IAuthoringFieldV2 = {
     name: gettext('Duration'),
     fieldType: 'duration',
     fieldConfig: {
-        width: 100,
+        width: 50,
     },
 };
 
@@ -133,7 +133,7 @@ const plannedDurationField: IAuthoringFieldV2 = {
     name: gettext('Planned duration'),
     fieldType: 'duration',
     fieldConfig: {
-        width: 100,
+        width: 50,
     },
 };
 
@@ -150,7 +150,7 @@ const statusConfig: IDropdownConfigVocabulary = {
     source: 'vocabulary',
     vocabularyId: STATUS_VOCABULARY_ID,
     multiple: false,
-    width: 100,
+    width: 33,
 };
 
 const statusField: IAuthoringFieldV2 = {