@strapi/content-manager 5.48.1 → 5.49.0

package/dist/admin/pages/EditView/components/DocumentActions.mjs

@@ -21,6 +21,7 @@ import { useGetDraftRelationCountQuery as useLazyGetDraftRelationCountQuery, use
 import { buildValidParams, isBaseQueryError } from '../../../utils/api.mjs';
 import { getTranslation } from '../../../utils/translations.mjs';
 import { handleInvisibleAttributes } from '../utils/data.mjs';
+import { getEditViewShortcut } from '../utils/keyboardShortcuts.mjs';
 import { useRelationModal } from './FormInputs/Relations/RelationModal.mjs';
 
 const connectRelationToParent = (parentDataToUpdate, fieldToConnect, data, fieldToConnectUID)=>{
@@ -71,18 +72,23 @@ const DocumentActions = ({ actions })=>{
         return null;
     }
     const addHintTooltip = (action, children)=>{
-        return !action.disabled ? /*#__PURE__*/ jsx(Tooltip, {
-            label: formatMessage({
-                id: 'content-manager.containers.EditView.saveHint',
-                defaultMessage: 'Ctrl / Cmd + Enter to {action}'
-            }, {
-                action: action.label
-            }),
+        if (action.disabled) {
+            return children;
+        }
+        const hint = action.type === 'publish' ? formatMessage({
+            id: 'content-manager.containers.EditView.publishHint',
+            defaultMessage: 'Ctrl / Cmd + Shift + Enter to publish'
+        }) : formatMessage({
+            id: 'content-manager.containers.EditView.saveHint',
+            defaultMessage: 'Ctrl / Cmd + Enter to save'
+        });
+        return /*#__PURE__*/ jsx(Tooltip, {
+            label: hint,
             children: /*#__PURE__*/ jsx(Flex, {
                 width: "100%",
                 children: children
             })
-        }) : children;
+        });
     };
     const primaryActionContent = /*#__PURE__*/ jsxs(Fragment, {
         children: [
@@ -129,15 +135,15 @@ const DocumentActions = ({ actions })=>{
                 alignItems: "stretch",
                 direction: "column",
                 children: secondaryAction.type === 'publish' ? /*#__PURE__*/ jsx(tours.contentManager.Publish, {
-                    children: /*#__PURE__*/ jsx(DocumentActionButton, {
+                    children: addHintTooltip(secondaryAction, /*#__PURE__*/ jsx(DocumentActionButton, {
                         ...secondaryAction,
                         variant: secondaryAction.variant || 'secondary'
-                    })
-                }) : /*#__PURE__*/ jsx(DocumentActionButton, {
+                    }))
+                }) : addHintTooltip(secondaryAction, /*#__PURE__*/ jsx(DocumentActionButton, {
                     ...secondaryAction,
                     variant: secondaryAction.variant || 'secondary',
                     buttonType: "submit"
-                })
+                }))
             }) : null
         ]
     });
@@ -659,17 +665,28 @@ const transformData = (data)=>{
     // see RFC "Count draft relations" in Notion
     const enableDraftRelationsCount = false;
     const hasDraftRelations = enableDraftRelationsCount;
-    // Auto-publish on CMD+Enter on macOS, and CTRL+Enter on Windows/Linux
+    /**
+   * Disabled when:
+   *  - currently if you're cloning a document we don't support publish & clone at the same time.
+   *  - the form is submitting
+   *  - the active tab is the published tab
+   *  - the document is already published & not modified
+   *  - the document is being created & not modified
+   *  - the user doesn't have the permission to publish
+   */ const isDisabled = isCloning || isSubmitting || isLoadingDraftRelations || activeTab === 'published' || !modified && isDocumentPublished || !modified && !document?.documentId || !canPublish;
+    // Publish on CMD+Shift+Enter (macOS) / CTRL+Shift+Enter (Windows/Linux).
+    // Saving a draft (CMD/CTRL+Enter) is handled by the UpdateAction.
     React.useEffect(()=>{
         if (!schema?.options?.draftAndPublish) {
             return;
         }
         const handleKeyDown = (e)=>{
-            if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
-                e.preventDefault();
-                {
-                    performPublish();
-                }
+            if (getEditViewShortcut(e) !== 'publish') {
+                return;
+            }
+            e.preventDefault();
+            if (!isDisabled && !hasDraftRelations) {
+                performPublish();
             }
         };
         window.addEventListener('keydown', handleKeyDown);
@@ -678,6 +695,7 @@ const transformData = (data)=>{
         };
     }, [
         hasDraftRelations,
+        isDisabled,
         performPublish,
         schema?.options?.draftAndPublish
     ]);
@@ -692,15 +710,7 @@ const transformData = (data)=>{
             'preview',
             'relation-modal'
         ],
-        /**
-     * Disabled when:
-     *  - currently if you're cloning a document we don't support publish & clone at the same time.
-     *  - the form is submitting
-     *  - the active tab is the published tab
-     *  - the document is already published & not modified
-     *  - the document is being created & not modified
-     *  - the user doesn't have the permission to publish
-     */ disabled: isCloning || isSubmitting || isLoadingDraftRelations || activeTab === 'published' || !modified && isDocumentPublished || !modified && !document?.documentId || !canPublish,
+        disabled: isDisabled,
         label: formatMessage({
             id: 'app.utils.publish',
             defaultMessage: 'Publish'
@@ -779,6 +789,12 @@ const UpdateAction = ({ activeTab, documentId, model, collectionType })=>{
     const { schema } = useDoc();
     const suitableSchema = fromRelationModal ? relationalModalSchema : schema;
     const hasDraftAndPublished = suitableSchema?.options?.draftAndPublish ?? false;
+    /**
+   * Disabled when:
+   * - the form is submitting
+   * - the document is not modified & we're not cloning (you can save a clone entity straight away)
+   * - the active tab is the published tab
+   */ const isDisabled = isSubmitting || !modified && !isCloning || activeTab === 'published';
     const handleUpdate = async ()=>{
         setSubmitting(true);
         try {
@@ -928,14 +944,32 @@ const UpdateAction = ({ activeTab, documentId, model, collectionType })=>{
             }
         }
     };
+    // Save a draft on CMD+Enter (macOS) / CTRL+Enter (Windows/Linux), with CMD/CTRL+S as an alias.
+    // Publishing (CMD/CTRL+Shift+Enter) is handled by the PublishAction.
+    // `handleUpdate` is recreated on every render, so we read the latest version (and the latest
+    // disabled state) through refs and register the listener only once.
+    const handleUpdateRef = React.useRef(handleUpdate);
+    handleUpdateRef.current = handleUpdate;
+    const isDisabledRef = React.useRef(isDisabled);
+    isDisabledRef.current = isDisabled;
+    React.useEffect(()=>{
+        const handleKeyDown = (e)=>{
+            if (getEditViewShortcut(e) !== 'save') {
+                return;
+            }
+            e.preventDefault();
+            if (!isDisabledRef.current) {
+                handleUpdateRef.current();
+            }
+        };
+        window.addEventListener('keydown', handleKeyDown);
+        return ()=>{
+            window.removeEventListener('keydown', handleKeyDown);
+        };
+    }, []);
     return {
         loading: isLoading,
-        /**
-     * Disabled when:
-     * - the form is submitting
-     * - the document is not modified & we're not cloning (you can save a clone entity straight away)
-     * - the active tab is the published tab
-     */ disabled: isSubmitting || !modified && !isCloning || activeTab === 'published',
+        disabled: isDisabled,
         label: formatMessage({
             id: 'global.save',
             defaultMessage: 'Save'