Publish multiple locales

packages/core/admin/admin/src/components/Form.tsx

@@ -228,18 +228,7 @@ const Form = React.forwardRef<HTMLFormElement, FormProps>(
           return { data };
         } catch (err) {
           if (isErrorYupValidationError(err)) {
-            let errors: FormErrors = {};
-
-            if (err.inner) {
-              if (err.inner.length === 0) {
-                return setIn(errors, err.path!, err.message);
-              }
-              for (const error of err.inner) {
-                if (!getIn(errors, error.path!)) {
-                  errors = setIn(errors, error.path!, error.message);
-                }
-              }
-            }
+            const errors = getYupValidationErrors(err);
 
             if (shouldSetErrors) {
               setErrors(errors);
@@ -470,6 +459,31 @@ const isErrorYupValidationError = (err: any): err is Yup.ValidationError =>
   typeof err.name === 'string' &&
   err.name === 'ValidationError';
 
+/* -------------------------------------------------------------------------------------------------
+ * getYupValidationErrors
+ * -----------------------------------------------------------------------------------------------*/
+
+/**
+ * @description handy utility to convert a yup validation error into a form
+ * error object. To be used elsewhere.
+ */
+const getYupValidationErrors = (err: Yup.ValidationError): FormErrors => {
+  let errors: FormErrors = {};
+
+  if (err.inner) {
+    if (err.inner.length === 0) {
+      return setIn(errors, err.path!, err.message);
+    }
+    for (const error of err.inner) {
+      if (!getIn(errors, error.path!)) {
+        errors = setIn(errors, error.path!, error.message);
+      }
+    }
+  }
+
+  return errors;
+};
+
 /* -------------------------------------------------------------------------------------------------
  * reducer
  * -----------------------------------------------------------------------------------------------*/
@@ -777,8 +791,9 @@ const Blocker = ({ onProceed = () => {}, onCancel = () => {} }: BlockerProps) =>
   return null;
 };
 
-export { Form, Blocker, useField, useForm };
+export { Form, Blocker, useField, useForm, getYupValidationErrors };
 export type {
+  FormErrors,
   FormHelpers,
   FormProps,
   FormValues,

packages/core/admin/admin/src/components/Layouts/GridLayout.tsx

@@ -34,4 +34,4 @@ const GridLayout = ({ size, children }: GridLayoutProps) => {
 };
 
 export { GridLayout };
-export type { GridColSize };
+export type { GridLayoutProps, GridColSize };

packages/core/admin/admin/src/components/Layouts/Layout.tsx

@@ -5,7 +5,7 @@ import { styled } from 'styled-components';
 
 import { ActionLayout } from './ActionLayout';
 import { ContentLayout } from './ContentLayout';
-import { GridLayout } from './GridLayout';
+import { GridLayout, GridLayoutProps } from './GridLayout';
 import { HeaderLayout, BaseHeaderLayout } from './HeaderLayout';
 
 interface LayoutProps {
@@ -40,4 +40,4 @@ const Layouts = {
   Content: ContentLayout,
 };
 
-export { Layouts, type LayoutProps };
+export { Layouts, type LayoutProps, type GridLayoutProps };

packages/core/admin/admin/src/translations/en.json

@@ -552,6 +552,7 @@
   "app.utils.unpublish": "Unpublish",
   "app.utils.published": "Published",
   "app.utils.ready-to-publish": "Ready to publish",
+  "app.utils.ready-to-publish-changes": "Ready to publish changes",
   "app.confirm.body": "Are you sure?",
   "clearLabel": "Clear",
   "coming.soon": "This content is currently under construction and will be back in a few weeks!",

packages/core/content-manager/admin/src/exports.ts

@@ -4,6 +4,8 @@
  * but should still export the same things.
  */
 
+export { buildValidParams } from './utils/api';
+
 export { useDocument as unstable_useDocument } from './hooks/useDocument';
 export { useDocumentActions as unstable_useDocumentActions } from './hooks/useDocumentActions';
 export { useDocumentLayout as unstable_useDocumentLayout } from './hooks/useDocumentLayout';

packages/core/content-manager/admin/src/hooks/tests/useDocument.test.tsx

@@ -93,13 +93,7 @@ describe('useDocument', () => {
       })
     ).toMatchInlineSnapshot(`
       {
-        "postal_code": {
-          "defaultMessage": "postal_code must be a \`string\` type, but the final value was: \`12\`.",
-          "id": "postal_code must be a \`string\` type, but the final value was: \`12\`.",
-          "values": {
-            "typeError": undefined,
-          },
-        },
+        "postal_code": "postal_code must be a \`string\` type, but the final value was: \`12\`.",
       }
     `);
   });

packages/core/content-manager/admin/src/hooks/tests/useDocumentActions.test.ts

@@ -11,6 +11,7 @@ describe('useDocumentActions', () => {
 
     expect(result.current).toEqual({
       autoClone: expect.any(Function),
+      publishMany: expect.any(Function),
       clone: expect.any(Function),
       create: expect.any(Function),
       discard: expect.any(Function),

packages/core/content-manager/admin/src/hooks/useDocument.ts

@@ -6,20 +6,26 @@
 
 import * as React from 'react';
 
-import { useNotification, useAPIErrorHandler, useQueryParams } from '@strapi/admin/strapi-admin';
+import {
+  useNotification,
+  useAPIErrorHandler,
+  useQueryParams,
+  FormErrors,
+  getYupValidationErrors,
+} from '@strapi/admin/strapi-admin';
+import { Modules } from '@strapi/types';
 import { useParams } from 'react-router-dom';
 import { ValidationError } from 'yup';
 
 import { SINGLE_TYPES } from '../constants/collections';
 import { useGetDocumentQuery } from '../services/documents';
 import { buildValidParams } from '../utils/api';
-import { createYupSchema, getInnerErrors } from '../utils/validation';
+import { createYupSchema } from '../utils/validation';
 
 import { useContentTypeSchema, ComponentsDictionary } from './useContentTypeSchema';
 
 import type { FindOne } from '../../../shared/contracts/collection-types';
 import type { ContentType } from '../../../shared/contracts/content-types';
-import type { MessageDescriptor, PrimitiveType } from 'react-intl';
 
 interface UseDocumentArgs {
   collectionType: string;
@@ -50,9 +56,7 @@ type UseDocument = (
    * This is the schema of the content type, it is not the same as the layout.
    */
   schema?: Schema;
-  validate: (
-    document: Document
-  ) => null | Record<string, MessageDescriptor & { values?: Record<string, PrimitiveType> }>;
+  validate: (document: Document) => null | FormErrors;
 };
 
 /* -------------------------------------------------------------------------------------------------
@@ -117,7 +121,7 @@ const useDocument: UseDocument = (args, opts) => {
   }, [schema, components]);
 
   const validate = React.useCallback(
-    (document: Document) => {
+    (document: Modules.Documents.AnyDocument): FormErrors | null => {
       if (!validationSchema) {
         throw new Error(
           'There is no validation schema generated, this is likely due to the schema not being loaded yet.'
@@ -126,11 +130,10 @@ const useDocument: UseDocument = (args, opts) => {
 
       try {
         validationSchema.validateSync(document, { abortEarly: false, strict: true });
-
         return null;
       } catch (error) {
         if (error instanceof ValidationError) {
-          return getInnerErrors(error);
+          return getYupValidationErrors(error);
         }
 
         throw error;

packages/core/content-manager/admin/src/hooks/useDocumentActions.ts

@@ -18,6 +18,7 @@ import {
   useDiscardDocumentMutation,
   useLazyGetDocumentQuery,
   usePublishDocumentMutation,
+  usePublishManyDocumentsMutation,
   useUnpublishDocumentMutation,
   useUnpublishManyDocumentsMutation,
   useUpdateDocumentMutation,
@@ -37,6 +38,7 @@ import type {
   Publish,
   Update,
   Unpublish,
+  BulkPublish,
   BulkUnpublish,
 } from '../../../shared/contracts/collection-types';
 
@@ -45,7 +47,8 @@ const DEFAULT_UNEXPECTED_ERROR_MSG = {
   defaultMessage: 'An error occurred, please try again',
 } satisfies MessageDescriptor;
 
-type OperationResponse<TResponse extends { data: any; meta: any; error?: any }> =
+type OperationResponse<TResponse extends { data: any; meta?: any; error?: any }> =
+  | Pick<TResponse, 'data'>
   | Pick<TResponse, 'data' | 'meta'>
   | { error: BaseQueryError | SerializedError };
 
@@ -124,6 +127,11 @@ type UseDocumentActions = () => {
     },
     document: Partial<Document>
   ) => Promise<OperationResponse<Publish.Response>>;
+  publishMany: (args: {
+    model: string;
+    documentIds: string[];
+    params?: object;
+  }) => Promise<BulkOperationResponse<BulkPublish.Response>>;
   update: (
     args: {
       collectionType: string;
@@ -361,6 +369,48 @@ const useDocumentActions: UseDocumentActions = () => {
     [trackUsage, publishDocument, toggleNotification, formatMessage, formatAPIError]
   );
 
+  const [publishManyDocuments] = usePublishManyDocumentsMutation();
+  const publishMany: IUseDocumentActs['publishMany'] = React.useCallback(
+    async ({ model, documentIds, params }) => {
+      try {
+        // TODO Confirm tracking events for bulk publish?
+
+        const res = await publishManyDocuments({
+          model,
+          documentIds,
+          params,
+        });
+        if ('error' in res) {
+          toggleNotification({ type: 'danger', message: formatAPIError(res.error) });
+          return { error: res.error };
+        }
+
+        toggleNotification({
+          type: 'success',
+          message: formatMessage({
+            id: getTranslation('success.record.publish'),
+            defaultMessage: 'Published document',
+          }),
+        });
+
+        return res.data;
+      } catch (err) {
+        toggleNotification({
+          type: 'danger',
+          message: formatMessage(DEFAULT_UNEXPECTED_ERROR_MSG),
+        });
+        throw err;
+      }
+    },
+    [
+      // trackUsage,
+      publishManyDocuments,
+      toggleNotification,
+      formatMessage,
+      formatAPIError,
+    ]
+  );
+
   const [updateDocument] = useUpdateDocumentMutation();
   const update: IUseDocumentActs['update'] = React.useCallback(
     async ({ collectionType, model, documentId, params }, data, trackerProperty) => {
@@ -644,6 +694,7 @@ const useDocumentActions: UseDocumentActions = () => {
     discard,
     getDocument,
     publish,
+    publishMany,
     unpublish,
     unpublishMany,
     update,

packages/core/content-manager/admin/src/pages/EditView/components/DocumentActions.tsx

@@ -88,7 +88,7 @@ interface NotificationOptions {
 interface ModalOptions {
   type: 'modal';
   title: string;
-  content: React.ReactNode;
+  content: React.ComponentType<{ onClose: () => void }> | React.ReactNode;
   footer: React.ComponentType<{ onClose: () => void }> | React.ReactNode;
   onClose?: () => void;
 }
@@ -438,7 +438,7 @@ const DocumentActionModal = ({
   title,
   onClose,
   footer: Footer,
-  content,
+  content: Content,
   onModalClose,
 }: DocumentActionModalProps) => {
   const id = React.useId();
@@ -462,7 +462,9 @@ const DocumentActionModal = ({
           {title}
         </Typography>
       </ModalHeader>
-      <ModalBody>{content}</ModalBody>
+      <ModalBody>
+        {typeof Content === 'function' ? <Content onClose={handleClose} /> : Content}
+      </ModalBody>
       <Box
         paddingTop={4}
         paddingBottom={4}