@strapi/admin 4.11.0-beta.0 → 4.11.0-exp.9xg4-3qfm-9w8f

package/admin/src/content-manager/components/DynamicTable/ConfirmDialogDeleteAll/index.js

@@ -0,0 +1,73 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useIntl } from 'react-intl';
+import { Dialog, DialogBody, DialogFooter, Flex, Typography, Button } from '@strapi/design-system';
+import { ExclamationMarkCircle, Trash } from '@strapi/icons';
+import InjectionZoneList from '../../InjectionZoneList';
+import { getTrad } from '../../../utils';
+
+const ConfirmDialogDeleteAll = ({ isConfirmButtonLoading, isOpen, onToggleDialog, onConfirm }) => {
+  const { formatMessage } = useIntl();
+
+  return (
+    <Dialog
+      onClose={onToggleDialog}
+      title={formatMessage({
+        id: 'app.components.ConfirmDialog.title',
+        defaultMessage: 'Confirmation',
+      })}
+      labelledBy="confirmation"
+      describedBy="confirm-description"
+      isOpen={isOpen}
+    >
+      <DialogBody icon={<ExclamationMarkCircle />}>
+        <Flex direction="column" alignItems="stretch" gap={2}>
+          <Flex justifyContent="center">
+            <Typography id="confirm-description">
+              {formatMessage({
+                id: getTrad('popUpWarning.bodyMessage.contentType.delete.all'),
+                defaultMessage: 'Are you sure you want to delete these entries?',
+              })}
+            </Typography>
+          </Flex>
+          <Flex>
+            <InjectionZoneList area="contentManager.listView.deleteModalAdditionalInfos" />
+          </Flex>
+        </Flex>
+      </DialogBody>
+      <DialogFooter
+        startAction={
+          <Button onClick={onToggleDialog} variant="tertiary">
+            {formatMessage({
+              id: 'app.components.Button.cancel',
+              defaultMessage: 'Cancel',
+            })}
+          </Button>
+        }
+        endAction={
+          <Button
+            onClick={onConfirm}
+            variant="danger-light"
+            startIcon={<Trash />}
+            id="confirm-delete"
+            loading={isConfirmButtonLoading}
+          >
+            {formatMessage({
+              id: 'app.components.Button.confirm',
+              defaultMessage: 'Confirm',
+            })}
+          </Button>
+        }
+      />
+    </Dialog>
+  );
+};
+
+ConfirmDialogDeleteAll.propTypes = {
+  isConfirmButtonLoading: PropTypes.bool.isRequired,
+  isOpen: PropTypes.bool.isRequired,
+  onConfirm: PropTypes.func.isRequired,
+  onToggleDialog: PropTypes.func.isRequired,
+};
+
+export default ConfirmDialogDeleteAll;

package/admin/src/content-manager/components/DynamicTable/index.js

@@ -9,22 +9,19 @@ import { INJECT_COLUMN_IN_TABLE } from '../../../exposedHooks';
 import { selectDisplayedHeaders } from '../../pages/ListView/selectors';
 import { getTrad } from '../../utils';
 import TableRows from './TableRows';
+import ConfirmDialogDeleteAll from './ConfirmDialogDeleteAll';
 import ConfirmDialogDelete from './ConfirmDialogDelete';
 import { PublicationState } from './CellContent/PublicationState/PublicationState';
-import BulkActionsBar from './BulkActionsBar';
 
 const DynamicTable = ({
   canCreate,
   canDelete,
-  canPublish,
   contentTypeName,
   action,
   isBulkable,
   isLoading,
   onConfirmDelete,
   onConfirmDeleteAll,
-  onConfirmPublishAll,
-  onConfirmUnpublishAll,
   layout,
   rows,
 }) => {
@@ -92,27 +89,17 @@ const DynamicTable = ({
 
   return (
     <Table
-      components={{ ConfirmDialogDelete }}
+      components={{ ConfirmDialogDelete, ConfirmDialogDeleteAll }}
       contentType={contentTypeName}
       action={action}
       isLoading={isLoading}
       headers={tableHeaders}
       onConfirmDelete={onConfirmDelete}
+      onConfirmDeleteAll={onConfirmDeleteAll}
       onOpenDeleteAllModalTrackedEvent="willBulkDeleteEntries"
       rows={rows}
       withBulkActions
-      withMainAction={(canDelete || canPublish) && isBulkable}
-      renderBulkActionsBar={({ selectedEntries, clearSelectedEntries }) => (
-        <BulkActionsBar
-          showPublish={canPublish && hasDraftAndPublish}
-          showDelete={canDelete}
-          onConfirmDeleteAll={onConfirmDeleteAll}
-          onConfirmPublishAll={onConfirmPublishAll}
-          onConfirmUnpublishAll={onConfirmUnpublishAll}
-          selectedEntries={selectedEntries}
-          clearSelectedEntries={clearSelectedEntries}
-        />
-      )}
+      withMainAction={canDelete && isBulkable}
     >
       <TableRows
         canCreate={canCreate}
@@ -134,7 +121,6 @@ DynamicTable.defaultProps = {
 DynamicTable.propTypes = {
   canCreate: PropTypes.bool.isRequired,
   canDelete: PropTypes.bool.isRequired,
-  canPublish: PropTypes.bool.isRequired,
   contentTypeName: PropTypes.string.isRequired,
   action: PropTypes.node,
   isBulkable: PropTypes.bool.isRequired,
@@ -153,8 +139,6 @@ DynamicTable.propTypes = {
   }).isRequired,
   onConfirmDelete: PropTypes.func.isRequired,
   onConfirmDeleteAll: PropTypes.func.isRequired,
-  onConfirmPublishAll: PropTypes.func.isRequired,
-  onConfirmUnpublishAll: PropTypes.func.isRequired,
   rows: PropTypes.array.isRequired,
 };
 

package/admin/src/content-manager/components/EditViewDataManagerProvider/index.js

@@ -21,13 +21,12 @@ import {
   getAPIInnerErrors,
 } from '@strapi/helper-plugin';
 
-import { createYupSchema, getTrad } from '../../utils';
+import { getTrad } from '../../utils';
 
 import selectCrudReducer from '../../sharedReducers/crudReducer/selectors';
 
 import reducer, { initialState } from './reducer';
-import { cleanData } from './utils';
-
+import { cleanData, createYupSchema } from './utils';
 import { clearSetModifiedDataOnly } from '../../sharedReducers/crudReducer/actions';
 import { usePrev } from '../../hooks';
 

package/admin/src/content-manager/components/EditViewDataManagerProvider/utils/index.js

@@ -1,3 +1,4 @@
 export { default as moveFields } from './moveFields';
 export { default as cleanData } from './cleanData';
+export { default as createYupSchema } from './schema';
 export { findAllAndReplace } from './findAllAndReplace';

package/admin/src/content-manager/{utils → components/EditViewDataManagerProvider/utils}/schema.js

@@ -7,7 +7,7 @@ import toNumber from 'lodash/toNumber';
 import * as yup from 'yup';
 import { translatedErrors as errorsTrads } from '@strapi/helper-plugin';
 
-import isFieldTypeNumber from './isFieldTypeNumber';
+import isFieldTypeNumber from '../../../utils/isFieldTypeNumber';
 
 yup.addMethod(yup.mixed, 'defined', function () {
   return this.test('defined', errorsTrads.required, (value) => value !== undefined);

package/admin/src/content-manager/pages/ListView/index.js

@@ -21,7 +21,6 @@ import {
   useTracking,
   Link,
   useAPIErrorHandler,
-  getYupInnerErrors,
 } from '@strapi/helper-plugin';
 
 import {
@@ -36,7 +35,6 @@ import {
 } from '@strapi/design-system';
 
 import { ArrowLeft, Plus, Cog } from '@strapi/icons';
-import { useMutation } from 'react-query';
 
 import DynamicTable from '../../components/DynamicTable';
 import AttributeFilter from '../../components/AttributeFilter';
@@ -44,7 +42,7 @@ import { InjectionZone } from '../../../shared/components';
 
 import permissions from '../../../permissions';
 
-import { createYupSchema, getRequestUrl, getTrad } from '../../utils';
+import { getRequestUrl, getTrad } from '../../utils';
 
 import FieldPicker from './FieldPicker';
 import PaginationFooter from './PaginationFooter';
@@ -66,7 +64,6 @@ function ListView({
   canCreate,
   canDelete,
   canRead,
-  canPublish,
   data,
   getData,
   getDataSucceeded,
@@ -103,50 +100,6 @@ function ListView({
   const fetchClient = useFetchClient();
   const { post, del } = fetchClient;
 
-  const bulkPublishMutation = useMutation(
-    (data) =>
-      post(`/content-manager/collection-types/${contentType.uid}/actions/bulkPublish`, data),
-    {
-      onSuccess() {
-        toggleNotification({
-          type: 'success',
-          message: { id: 'content-manager.success.record.publish', defaultMessage: 'Published' },
-        });
-
-        fetchData(`/content-manager/collection-types/${slug}${params}`);
-      },
-      onError(error) {
-        toggleNotification({
-          type: 'warning',
-          message: formatAPIError(error),
-        });
-      },
-    }
-  );
-  const bulkUnpublishMutation = useMutation(
-    (data) =>
-      post(`/content-manager/collection-types/${contentType.uid}/actions/bulkUnpublish`, data),
-    {
-      onSuccess() {
-        toggleNotification({
-          type: 'success',
-          message: {
-            id: 'content-manager.success.record.unpublish',
-            defaultMessage: 'Unpublished',
-          },
-        });
-
-        fetchData(`/content-manager/collection-types/${slug}${params}`);
-      },
-      onError(error) {
-        toggleNotification({
-          type: 'warning',
-          message: formatAPIError(error),
-        });
-      },
-    }
-  );
-
   // FIXME
   // Using a ref to avoid requests being fired multiple times on slug on change
   // We need it because the hook as mulitple dependencies so it may run before the permissions have checked
@@ -246,70 +199,6 @@ function ListView({
     [slug, params, fetchData, toggleNotification, formatAPIError, del]
   );
 
-  /**
-   * @param {number[]} selectedEntries - Array of ids to publish
-   * @returns {{validIds: number[], errors: Object.<number, string>}} - Returns an object with the valid ids and the errors
-   */
-  const validateEntriesToPublish = async (selectedEntries) => {
-    const validations = { validIds: [], errors: {} };
-    // Create the validation schema based on the contentType
-    const schema = createYupSchema(
-      contentType,
-      { components: layout.components },
-      { isDraft: false }
-    );
-    // Get the selected entries
-    const entries = data.filter((entry) => {
-      return selectedEntries.includes(entry.id);
-    });
-    // Validate each entry and map the unresolved promises
-    const validationPromises = entries.map((entry) =>
-      schema.validate(entry, { abortEarly: false })
-    );
-    // Resolve all the promises in one go
-    const resolvedPromises = await Promise.allSettled(validationPromises);
-    // Set the validations
-    resolvedPromises.forEach((promise) => {
-      if (promise.status === 'rejected') {
-        const entityId = promise.reason.value.id;
-        validations.errors[entityId] = getYupInnerErrors(promise.reason);
-      }
-
-      if (promise.status === 'fulfilled') {
-        validations.validIds.push(promise.value.id);
-      }
-    });
-
-    return validations;
-  };
-
-  const handleConfirmPublishAllData = async (selectedEntries) => {
-    const validations = await validateEntriesToPublish(selectedEntries);
-
-    if (Object.values(validations.errors).length) {
-      toggleNotification({
-        type: 'warning',
-        title: {
-          id: 'content-manager.listView.validation.errors.title',
-          defaultMessage: 'Action required',
-        },
-        message: {
-          id: 'content-manager.listView.validation.errors.message',
-          defaultMessage:
-            'Please make sure all fields are valid before publishing (required field, min/max character limit, etc.)',
-        },
-      });
-
-      throw new Error('Validation error');
-    }
-
-    return bulkPublishMutation.mutateAsync({ ids: selectedEntries });
-  };
-
-  const handleConfirmUnpublishAllData = (selectedEntries) => {
-    return bulkUnpublishMutation.mutateAsync({ ids: selectedEntries });
-  };
-
   useEffect(() => {
     const CancelToken = axios.CancelToken;
     const source = CancelToken.source();
@@ -441,12 +330,9 @@ function ListView({
             <DynamicTable
               canCreate={canCreate}
               canDelete={canDelete}
-              canPublish={canPublish}
               contentTypeName={headerLayoutTitle}
-              onConfirmDelete={handleConfirmDeleteData}
               onConfirmDeleteAll={handleConfirmDeleteAllData}
-              onConfirmPublishAll={handleConfirmPublishAllData}
-              onConfirmUnpublishAll={handleConfirmUnpublishAllData}
+              onConfirmDelete={handleConfirmDeleteData}
               isBulkable={isBulkable}
               isLoading={isLoading}
               // FIXME: remove the layout props drilling
@@ -468,12 +354,10 @@ ListView.propTypes = {
   canCreate: PropTypes.bool.isRequired,
   canDelete: PropTypes.bool.isRequired,
   canRead: PropTypes.bool.isRequired,
-  canPublish: PropTypes.bool.isRequired,
   data: PropTypes.array.isRequired,
   layout: PropTypes.exact({
     components: PropTypes.object.isRequired,
     contentType: PropTypes.shape({
-      uid: PropTypes.string.isRequired,
       attributes: PropTypes.object.isRequired,
       metadatas: PropTypes.object.isRequired,
       info: PropTypes.shape({ displayName: PropTypes.string.isRequired }).isRequired,

package/admin/src/content-manager/utils/index.js

@@ -18,5 +18,3 @@ export { default as mergeMetasWithSchema } from './mergeMetasWithSchema';
 
 export { default as removeKeyInObject } from './removeKeyInObject';
 export { default as removePasswordFieldsFromData } from './removePasswordFieldsFromData';
-
-export { default as createYupSchema } from './schema';

package/admin/src/hooks/useContentTypes/useContentTypes.js

@@ -2,8 +2,6 @@ import { useAPIErrorHandler, useFetchClient, useNotification } from '@strapi/hel
 import { useQueries } from 'react-query';
 
 export function useContentTypes() {
-  console.log('----> read');
-
   const { get } = useFetchClient();
   const { formatAPIError } = useAPIErrorHandler();
   const toggleNotification = useNotification();

package/admin/src/injectionZones.js

@@ -13,12 +13,7 @@ const injectionZones = {
   },
   contentManager: {
     editView: { informations: [], 'right-links': [] },
-    listView: {
-      actions: [],
-      deleteModalAdditionalInfos: [],
-      publishModalAdditionalInfos: [],
-      unpublishModalAdditionalInfos: [],
-    },
+    listView: { actions: [], deleteModalAdditionalInfos: [] },
   },
 };