@strapi/content-manager 5.11.1 → 5.12.0-beta.0

package/dist/admin/chunks/{index-CcJLBLNf.mjs → index-CIOT3ggy.mjs}

@@ -1,6 +1,6 @@
 import { Cross, WarningCircle, More, ListPlus, Pencil, Trash, Check, CheckCircle, ArrowsCounterClockwise, CrossCircle, ChevronRight, Duplicate, ClockCounterClockwise, Feather } from '@strapi/icons';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import { useStrapiApp, createContext, useQueryParams, useAuth, useRBAC, Page, adminApi, translatedErrors, useNotification, useAPIErrorHandler, getYupValidationErrors, useForm, useTracking, useGuidedTour, BackButton, DescriptionComponentRenderer, useTable, Table } from '@strapi/admin/strapi-admin';
+import { useStrapiApp, adminApi, translatedErrors, useNotification, useAPIErrorHandler, useQueryParams, getYupValidationErrors, useForm, createContext, useAuth, useRBAC, Page, useTracking, useGuidedTour, BackButton, DescriptionComponentRenderer, useTable, Table } from '@strapi/admin/strapi-admin';
 import * as React from 'react';
 import { lazy } from 'react';
 import { Menu, Flex, Typography, Radio, Button, VisuallyHidden, Dialog, Modal, Status, Box, SingleSelect, SingleSelectOption, IconButton, RawTable, Loader, Tbody, Tr, Td, Tooltip, LinkButton } from '@strapi/design-system';
@@ -99,102 +99,6 @@ const DOCUMENT_META_FIELDS = [
 const SINGLE_TYPES = 'single-types';
 const COLLECTION_TYPES = 'collection-types';
 
-const [DocumentRBACProvider, useDocumentRBAC] = createContext('DocumentRBAC', {
-    canCreate: false,
-    canCreateFields: [],
-    canDelete: false,
-    canPublish: false,
-    canRead: false,
-    canReadFields: [],
-    canUpdate: false,
-    canUpdateFields: [],
-    canUserAction: ()=>false,
-    isLoading: false
-});
-/**
- * @internal This component is not meant to be used outside of the Content Manager plugin.
- * It depends on knowing the slug/model of the content-type using the params of the URL.
- * If you do use the hook outside of the context, we default to `false` for all actions.
- *
- * It then creates an list of `can{Action}` that are passed to the context for consumption
- * within the app to enforce RBAC.
- */ const DocumentRBAC = ({ children, permissions })=>{
-    const { slug } = useParams();
-    if (!slug) {
-        throw new Error('Cannot find the slug param in the URL');
-    }
-    const [{ rawQuery }] = useQueryParams();
-    const userPermissions = useAuth('DocumentRBAC', (state)=>state.permissions);
-    const contentTypePermissions = React.useMemo(()=>{
-        const contentTypePermissions = userPermissions.filter((permission)=>permission.subject === slug);
-        return contentTypePermissions.reduce((acc, permission)=>{
-            const [action] = permission.action.split('.').slice(-1);
-            return {
-                ...acc,
-                [action]: [
-                    permission
-                ]
-            };
-        }, {});
-    }, [
-        slug,
-        userPermissions
-    ]);
-    const { isLoading, allowedActions } = useRBAC(contentTypePermissions, permissions ?? undefined, // TODO: useRBAC context should be typed and built differently
-    // We are passing raw query as context to the hook so that it can
-    // rely on the locale provided from DocumentRBAC for its permission calculations.
-    rawQuery);
-    const canCreateFields = !isLoading && allowedActions.canCreate ? extractAndDedupeFields(contentTypePermissions.create) : [];
-    const canReadFields = !isLoading && allowedActions.canRead ? extractAndDedupeFields(contentTypePermissions.read) : [];
-    const canUpdateFields = !isLoading && allowedActions.canUpdate ? extractAndDedupeFields(contentTypePermissions.update) : [];
-    /**
-   * @description Checks if the user can perform an action on a field based on the field names
-   * provided as the second argument.
-   */ const canUserAction = React.useCallback((fieldName, fieldsUserCanAction, fieldType)=>{
-        const name = removeNumericalStrings(fieldName.split('.'));
-        const componentFieldNames = fieldsUserCanAction// filter out fields that aren't components (components are dot separated)
-        .filter((field)=>field.split('.').length > 1);
-        if (fieldType === 'component') {
-            // check if the field name is within any of those arrays
-            return componentFieldNames.some((field)=>{
-                return field.includes(name.join('.'));
-            });
-        }
-        /**
-       * The field is within a component.
-       */ if (name.length > 1) {
-            return componentFieldNames.includes(name.join('.'));
-        }
-        /**
-       * just a regular field
-       */ return fieldsUserCanAction.includes(fieldName);
-    }, []);
-    if (isLoading) {
-        return /*#__PURE__*/ jsx(Page.Loading, {});
-    }
-    return /*#__PURE__*/ jsx(DocumentRBACProvider, {
-        isLoading: isLoading,
-        canCreateFields: canCreateFields,
-        canReadFields: canReadFields,
-        canUpdateFields: canUpdateFields,
-        canUserAction: canUserAction,
-        ...allowedActions,
-        children: children
-    });
-};
-/**
- * @internal it's really small, but it's used three times in a row and DRY for something this straight forward.
- */ const extractAndDedupeFields = (permissions = [])=>permissions.flatMap((permission)=>permission.properties?.fields).filter((field, index, arr)=>arr.indexOf(field) === index && typeof field === 'string');
-/**
- * @internal removes numerical strings from arrays.
- * @example
- * ```ts
- * const name = 'a.0.b';
- * const res = removeNumericalStrings(name.split('.'));
- * console.log(res); // ['a', 'b']
- * ```
- */ const removeNumericalStrings = (arr)=>arr.filter((item)=>isNaN(Number(item)));
-
 const BLOCK_LIST_ATTRIBUTE_KEYS = [
     '__component',
     '__temp_key__'
@@ -1678,6 +1582,144 @@ const checkIfAttributeIsDisplayable = (attribute)=>{
     };
 };
 
+const [DocumentProvider, useDocumentContext] = createContext('DocumentContext');
+/**
+ * TODO: Document in contributor docs, Add unit test
+ *
+ * This context provider and its associated hook are used to access a document at its root level
+ * and expose a function to change the current document being viewed to one of the root level docuemnt's relations.
+ *
+ * The useDocumentContext hook exposes:
+ * - meta: information about the currentDocument,
+ * - document: the actual document,
+ * - changeDocument: a function to change the current document to one of its relations.
+ * - rootDocumentMeta: information about the root level document (current page)
+ */ const DocumentContextProvider = ({ children, initialDocument, onPreview })=>{
+    /**
+   * Initialize with the "root" document and expose a setter method to change to
+   * one of the root level document's relations.
+   */ const [currentDocumentMeta, changeDocument] = React.useState(initialDocument);
+    const params = React.useMemo(()=>buildValidParams(currentDocumentMeta.params ?? {}), [
+        currentDocumentMeta.params
+    ]);
+    const document = useDocument({
+        ...currentDocumentMeta,
+        params
+    });
+    const [documentHistory, setDocumentHistory] = React.useState([]);
+    return /*#__PURE__*/ jsx(DocumentProvider, {
+        changeDocument: changeDocument,
+        document: document,
+        rootDocumentMeta: {
+            documentId: initialDocument.documentId,
+            model: initialDocument.model,
+            collectionType: initialDocument.collectionType
+        },
+        meta: currentDocumentMeta,
+        documentHistory: documentHistory,
+        setDocumentHistory: setDocumentHistory,
+        onPreview: onPreview,
+        children: children
+    });
+};
+
+const [DocumentRBACProvider, useDocumentRBAC] = createContext('DocumentRBAC', {
+    canCreate: false,
+    canCreateFields: [],
+    canDelete: false,
+    canPublish: false,
+    canRead: false,
+    canReadFields: [],
+    canUpdate: false,
+    canUpdateFields: [],
+    canUserAction: ()=>false,
+    isLoading: false
+});
+/**
+ * @internal This component is not meant to be used outside of the Content Manager plugin.
+ * It depends on knowing the slug/model of the content-type using the params of the URL or the model if it is passed as arg.
+ * If you do use the hook outside of the context, we default to `false` for all actions.
+ *
+ * It then creates an list of `can{Action}` that are passed to the context for consumption
+ * within the app to enforce RBAC.
+ */ const DocumentRBAC = ({ children, permissions, model })=>{
+    const { slug } = useParams();
+    if (!slug && !model) {
+        throw new Error('Cannot find the slug param in the URL or the model prop is not provided.');
+    }
+    const contentTypeUid = model ?? slug;
+    const [{ rawQuery }] = useQueryParams();
+    const userPermissions = useAuth('DocumentRBAC', (state)=>state.permissions);
+    const contentTypePermissions = React.useMemo(()=>{
+        const contentTypePermissions = userPermissions.filter((permission)=>permission.subject === contentTypeUid);
+        return contentTypePermissions.reduce((acc, permission)=>{
+            const [action] = permission.action.split('.').slice(-1);
+            return {
+                ...acc,
+                [action]: [
+                    permission
+                ]
+            };
+        }, {});
+    }, [
+        contentTypeUid,
+        userPermissions
+    ]);
+    const { isLoading, allowedActions } = useRBAC(contentTypePermissions, permissions ?? undefined, // TODO: useRBAC context should be typed and built differently
+    // We are passing raw query as context to the hook so that it can
+    // rely on the locale provided from DocumentRBAC for its permission calculations.
+    rawQuery);
+    const canCreateFields = !isLoading && allowedActions.canCreate ? extractAndDedupeFields(contentTypePermissions.create) : [];
+    const canReadFields = !isLoading && allowedActions.canRead ? extractAndDedupeFields(contentTypePermissions.read) : [];
+    const canUpdateFields = !isLoading && allowedActions.canUpdate ? extractAndDedupeFields(contentTypePermissions.update) : [];
+    /**
+   * @description Checks if the user can perform an action on a field based on the field names
+   * provided as the second argument.
+   */ const canUserAction = React.useCallback((fieldName, fieldsUserCanAction, fieldType)=>{
+        const name = removeNumericalStrings(fieldName.split('.'));
+        const componentFieldNames = fieldsUserCanAction// filter out fields that aren't components (components are dot separated)
+        .filter((field)=>field.split('.').length > 1);
+        if (fieldType === 'component') {
+            // check if the field name is within any of those arrays
+            return componentFieldNames.some((field)=>{
+                return field.includes(name.join('.'));
+            });
+        }
+        /**
+       * The field is within a component.
+       */ if (name.length > 1) {
+            return componentFieldNames.includes(name.join('.'));
+        }
+        /**
+       * just a regular field
+       */ return fieldsUserCanAction.includes(fieldName);
+    }, []);
+    if (isLoading) {
+        return /*#__PURE__*/ jsx(Page.Loading, {});
+    }
+    return /*#__PURE__*/ jsx(DocumentRBACProvider, {
+        isLoading: isLoading,
+        canCreateFields: canCreateFields,
+        canReadFields: canReadFields,
+        canUpdateFields: canUpdateFields,
+        canUserAction: canUserAction,
+        ...allowedActions,
+        children: children
+    });
+};
+/**
+ * @internal it's really small, but it's used three times in a row and DRY for something this straight forward.
+ */ const extractAndDedupeFields = (permissions = [])=>permissions.flatMap((permission)=>permission.properties?.fields).filter((field, index, arr)=>arr.indexOf(field) === index && typeof field === 'string');
+/**
+ * @internal removes numerical strings from arrays.
+ * @example
+ * ```ts
+ * const name = 'a.0.b';
+ * const res = removeNumericalStrings(name.split('.'));
+ * console.log(res); // ['a', 'b']
+ * ```
+ */ const removeNumericalStrings = (arr)=>arr.filter((item)=>isNaN(Number(item)));
+
 const prefixPluginTranslations = (trad, pluginId)=>{
     return Object.keys(trad).reduce((acc, current)=>{
         acc[`${pluginId}.${current}`] = trad[current];
@@ -2243,7 +2285,7 @@ const DEFAULT_UNEXPECTED_ERROR_MSG = {
     };
 };
 
-const ProtectedHistoryPage = /*#__PURE__*/ React.lazy(()=>import('./History-DClLuGIg.mjs').then((mod)=>({
+const ProtectedHistoryPage = /*#__PURE__*/ React.lazy(()=>import('./History-DsRVSUF7.mjs').then((mod)=>({
             default: mod.ProtectedHistoryPage
         })));
 /**
@@ -2259,7 +2301,7 @@ const ProtectedHistoryPage = /*#__PURE__*/ React.lazy(()=>import('./History-DClL
     }
 ];
 
-const ProtectedPreviewPage = /*#__PURE__*/ React.lazy(()=>import('./Preview-05BZGpV2.mjs').then((mod)=>({
+const ProtectedPreviewPage = /*#__PURE__*/ React.lazy(()=>import('./Preview-aVLT3LM_.mjs').then((mod)=>({
             default: mod.ProtectedPreviewPage
         })));
 const routes$1 = [
@@ -2273,25 +2315,25 @@ const routes$1 = [
     }
 ];
 
-const ProtectedEditViewPage = /*#__PURE__*/ lazy(()=>import('./EditViewPage-BAI2r49P.mjs').then((mod)=>({
+const ProtectedEditViewPage = /*#__PURE__*/ lazy(()=>import('./EditViewPage-BtunY0ZP.mjs').then((mod)=>({
             default: mod.ProtectedEditViewPage
         })));
-const ProtectedListViewPage = /*#__PURE__*/ lazy(()=>import('./ListViewPage-Q0auz5lE.mjs').then((mod)=>({
+const ProtectedListViewPage = /*#__PURE__*/ lazy(()=>import('./ListViewPage-DcUhPA9a.mjs').then((mod)=>({
             default: mod.ProtectedListViewPage
         })));
-const ProtectedListConfiguration = /*#__PURE__*/ lazy(()=>import('./ListConfigurationPage-Do3UDres.mjs').then((mod)=>({
+const ProtectedListConfiguration = /*#__PURE__*/ lazy(()=>import('./ListConfigurationPage-DW-wAwmW.mjs').then((mod)=>({
             default: mod.ProtectedListConfiguration
         })));
-const ProtectedEditConfigurationPage = /*#__PURE__*/ lazy(()=>import('./EditConfigurationPage-KDwSFRyn.mjs').then((mod)=>({
+const ProtectedEditConfigurationPage = /*#__PURE__*/ lazy(()=>import('./EditConfigurationPage-D1iHIzSR.mjs').then((mod)=>({
             default: mod.ProtectedEditConfigurationPage
         })));
-const ProtectedComponentConfigurationPage = /*#__PURE__*/ lazy(()=>import('./ComponentConfigurationPage-DKtL-tec.mjs').then((mod)=>({
+const ProtectedComponentConfigurationPage = /*#__PURE__*/ lazy(()=>import('./ComponentConfigurationPage-w_ss7xEy.mjs').then((mod)=>({
             default: mod.ProtectedComponentConfigurationPage
         })));
-const NoPermissions = /*#__PURE__*/ lazy(()=>import('./NoPermissionsPage-BAW7WY-M.mjs').then((mod)=>({
+const NoPermissions = /*#__PURE__*/ lazy(()=>import('./NoPermissionsPage-RWPwNESA.mjs').then((mod)=>({
             default: mod.NoPermissions
         })));
-const NoContentType = /*#__PURE__*/ lazy(()=>import('./NoContentTypePage-B_oOeOQb.mjs').then((mod)=>({
+const NoContentType = /*#__PURE__*/ lazy(()=>import('./NoContentTypePage-DbRXR2cr.mjs').then((mod)=>({
             default: mod.NoContentType
         })));
 const CollectionTypePages = ()=>{
@@ -2679,7 +2721,7 @@ const transformData = (data)=>{
 /* -------------------------------------------------------------------------------------------------
  * DocumentActionComponents
  * -----------------------------------------------------------------------------------------------*/ const PublishAction$1 = ({ activeTab, documentId, model, collectionType, meta, document, onPreview })=>{
-    const { schema } = useDoc();
+    const schema = useDocumentContext('PublishAction', (state)=>state.document.schema);
     const navigate = useNavigate();
     const { toggleNotification } = useNotification();
     const { _unstableFormatValidationErrors: formatValidationErrors } = useAPIErrorHandler();
@@ -2702,6 +2744,8 @@ const transformData = (data)=>{
     const validate = useForm('PublishAction', (state)=>state.validate);
     const setErrors = useForm('PublishAction', (state)=>state.setErrors);
     const formValues = useForm('PublishAction', ({ values })=>values);
+    const rootDocumentMeta = useDocumentContext('PublishAction', (state)=>state.rootDocumentMeta);
+    const currentDocumentMeta = useDocumentContext('PublishAction', (state)=>state.meta);
     React.useEffect(()=>{
         if (isErrorDraftRelations) {
             toggleNotification({
@@ -2804,11 +2848,12 @@ const transformData = (data)=>{
                 });
                 return;
             }
+            const isPublishingRelation = rootDocumentMeta.documentId !== currentDocumentMeta.documentId;
             const res = await publish({
                 collectionType,
                 model,
                 documentId,
-                params
+                params: isPublishingRelation ? currentDocumentMeta.params : params
             }, transformData(formValues));
             if ('data' in res && collectionType !== SINGLE_TYPES) {
                 /**
@@ -2838,7 +2883,8 @@ const transformData = (data)=>{
         loading: isLoading,
         position: [
             'panel',
-            'preview'
+            'preview',
+            'relation-modal'
         ],
         /**
      * Disabled when:
@@ -2879,7 +2925,8 @@ const transformData = (data)=>{
 PublishAction$1.type = 'publish';
 PublishAction$1.position = [
     'panel',
-    'preview'
+    'preview',
+    'relation-modal'
 ];
 const UpdateAction = ({ activeTab, documentId, model, collectionType, onPreview })=>{
     const navigate = useNavigate();
@@ -2900,6 +2947,8 @@ const UpdateAction = ({ activeTab, documentId, model, collectionType, onPreview
     const validate = useForm('UpdateAction', (state)=>state.validate);
     const setErrors = useForm('UpdateAction', (state)=>state.setErrors);
     const resetForm = useForm('PublishAction', ({ resetForm })=>resetForm);
+    const rootDocumentMeta = useDocumentContext('UpdateAction', (state)=>state.rootDocumentMeta);
+    const currentDocumentMeta = useDocumentContext('UpdateAction', (state)=>state.meta);
     const handleUpdate = React.useCallback(async ()=>{
         setSubmitting(true);
         try {
@@ -2936,11 +2985,12 @@ const UpdateAction = ({ activeTab, documentId, model, collectionType, onPreview
                     setErrors(formatValidationErrors(res.error));
                 }
             } else if (documentId || collectionType === SINGLE_TYPES) {
+                const isEditingRelation = rootDocumentMeta.documentId !== currentDocumentMeta.documentId;
                 const res = await update({
                     collectionType,
                     model,
                     documentId,
-                    params
+                    params: isEditingRelation ? currentDocumentMeta.params : params
                 }, transformData(document));
                 if ('error' in res && isBaseQueryError(res.error) && res.error.name === 'ValidationError') {
                     setErrors(formatValidationErrors(res.error));
@@ -3022,14 +3072,16 @@ const UpdateAction = ({ activeTab, documentId, model, collectionType, onPreview
         onClick: handleUpdate,
         position: [
             'panel',
-            'preview'
+            'preview',
+            'relation-modal'
         ]
     };
 };
 UpdateAction.type = 'update';
 UpdateAction.position = [
     'panel',
-    'preview'
+    'preview',
+    'relation-modal'
 ];
 const UNPUBLISH_DRAFT_OPTIONS = {
     KEEP: 'keep',
@@ -3322,12 +3374,11 @@ const capitalise = (str)=>str.charAt(0).toUpperCase() + str.slice(1);
         size: size,
         variant: statusVariant,
         role: "status",
-        "aria-labelledby": "document-status",
+        "aria-label": status,
         children: /*#__PURE__*/ jsx(Typography, {
             tag: "span",
             variant: "omega",
             fontWeight: "bold",
-            id: "document-status",
             children: formatMessage({
                 id: `content-manager.containers.List.${status}`,
                 defaultMessage: capitalise(status)
@@ -5306,7 +5357,7 @@ function __variableDynamicImportRuntime1__(path) {
     case './translations/ca.json': return import('./ca-DviY7mRj.mjs');
     case './translations/cs.json': return import('./cs-C7OSYFQ7.mjs');
     case './translations/de.json': return import('./de-5QRlDHyR.mjs');
-    case './translations/en.json': return import('./en-CImiNxXE.mjs');
+    case './translations/en.json': return import('./en-C2zEwS3-.mjs');
     case './translations/es.json': return import('./es-DkoWSExG.mjs');
     case './translations/eu.json': return import('./eu-BG1xX7HK.mjs');
     case './translations/fr.json': return import('./fr-CFdRaRVj.mjs');
@@ -5360,7 +5411,7 @@ var index = {
         app.router.addRoute({
             path: 'content-manager/*',
             lazy: async ()=>{
-                const { Layout } = await import('./layout-4nCaNnTs.mjs');
+                const { Layout } = await import('./layout-DjT9cccU.mjs');
                 return {
                     Component: Layout
                 };
@@ -5395,5 +5446,5 @@ var index = {
     }
 };
 
-export { useUpdateContentTypeConfigurationMutation as A, BulkActionsRenderer as B, COLLECTION_TYPES as C, DocumentStatus as D, ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD as E, extractContentTypeComponents as F, DEFAULT_SETTINGS as G, HOOKS as H, InjectionZone as I, convertEditLayoutToFieldLayouts as J, removeFieldsThatDontExistOnSchema as K, prepareTempKeys as L, useDocument as M, DocumentActionButton as N, useGetPreviewUrlQuery as O, Panels as P, index as Q, RelativeTime as R, SINGLE_TYPES as S, TableActions as T, useContentManagerContext as U, useDocumentActions as V, useGetInitialDataQuery as a, useGetAllContentTypeSettingsQuery as b, useDoc as c, buildValidParams as d, contentManagerApi as e, useDocumentRBAC as f, getTranslation as g, useDocumentLayout as h, createYupSchema as i, Header as j, PERMISSIONS as k, DocumentRBAC as l, useDocLayout as m, createDefaultForm as n, CLONE_PATH as o, useGetContentTypeConfigurationQuery as p, CREATOR_FIELDS as q, getMainField as r, setInitialData as s, transformDocument as t, useContentTypeSchema as u, getDisplayName as v, checkIfAttributeIsDisplayable as w, useGetAllDocumentsQuery as x, convertListLayoutToFieldLayouts as y, capitalise as z };
-//# sourceMappingURL=index-CcJLBLNf.mjs.map
+export { useGetAllDocumentsQuery as A, BulkActionsRenderer as B, COLLECTION_TYPES as C, DocumentStatus as D, convertListLayoutToFieldLayouts as E, capitalise as F, useDocLayout as G, HOOKS as H, InjectionZone as I, useUpdateContentTypeConfigurationMutation as J, ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD as K, extractContentTypeComponents as L, DEFAULT_SETTINGS as M, convertEditLayoutToFieldLayouts as N, removeFieldsThatDontExistOnSchema as O, PERMISSIONS as P, prepareTempKeys as Q, RelativeTime as R, SINGLE_TYPES as S, TableActions as T, useDocument as U, useGetPreviewUrlQuery as V, index as W, useContentManagerContext as X, useDocumentActions as Y, useGetInitialDataQuery as a, useGetAllContentTypeSettingsQuery as b, useDocumentContext as c, useDocumentLayout as d, createDefaultForm as e, useLazyGetDocumentQuery as f, getTranslation as g, createYupSchema as h, DocumentRBAC as i, DocumentActionButton as j, buildValidParams as k, contentManagerApi as l, useDoc as m, CLONE_PATH as n, useDocumentRBAC as o, DocumentContextProvider as p, Header as q, Panels as r, setInitialData as s, transformDocument as t, useContentTypeSchema as u, useGetContentTypeConfigurationQuery as v, CREATOR_FIELDS as w, getMainField as x, getDisplayName as y, checkIfAttributeIsDisplayable as z };
+//# sourceMappingURL=index-CIOT3ggy.mjs.map