Merge pull request #17277 from strapi/fix/review-workflow-assignee-list-view

packages/core/admin/admin/src/content-manager/pages/ListView/components/TableRows/index.js

@@ -52,14 +52,15 @@ export const TableRows = ({
   const pluginsQueryParams = usePluginsQueryParams();
   const [{ query }] = useQueryParams();
   const { formatAPIError } = useAPIErrorHandler(getTrad);
-  const ReviewWorkflowsStage = useEnterprise(
+  const ReviewWorkflowsColumns = useEnterprise(
     REVIEW_WORKFLOW_COLUMNS_CE,
-    async () =>
+    async () => {
-      (
+      const { ReviewWorkflowsStageEE, ReviewWorkflowsAssigneeEE } = await import(
-        await import(
         '../../../../../../../ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn'
-        )
+      );
-      ).ReviewWorkflowsStageEE,
+
+      return { ReviewWorkflowsStageEE, ReviewWorkflowsAssigneeEE };
+    },
     {
       enabled: hasReviewWorkflows,
     }
@@ -108,7 +109,7 @@ export const TableRows = ({
   };
 
   // block rendering until the review stage component is fully loaded in EE
-  if (!ReviewWorkflowsStage) {
+  if (!ReviewWorkflowsColumns) {
     return null;
   }
 
@@ -178,11 +179,12 @@ export const TableRows = ({
                 );
               }
 
-              if (hasReviewWorkflows && name === 'strapi_reviewWorkflows_stage') {
+              if (hasReviewWorkflows) {
+                if (name === 'strapi_reviewWorkflows_stage') {
                   return (
                     <Td key={key}>
                       {data.strapi_reviewWorkflows_stage ? (
-                      <ReviewWorkflowsStage
+                        <ReviewWorkflowsColumns.ReviewWorkflowsStageEE
                           color={data.strapi_reviewWorkflows_stage.color}
                           name={data.strapi_reviewWorkflows_stage.name}
                         />
@@ -192,6 +194,22 @@ export const TableRows = ({
                     </Td>
                   );
                 }
+                if (name === 'strapi_assignee') {
+                  return (
+                    <Td key={key}>
+                      {data.strapi_assignee ? (
+                        <ReviewWorkflowsColumns.ReviewWorkflowsAssigneeEE
+                          firstname={data.strapi_assignee.firstname}
+                          lastname={data?.strapi_assignee?.lastname}
+                          displayname={data?.strapi_assignee?.username}
+                        />
+                      ) : (
+                        <Typography textColor="neutral800">-</Typography>
+                      )}
+                    </Td>
+                  );
+                }
+              }
 
               return (
                 <Td key={key}>

packages/core/admin/admin/src/content-manager/pages/ListView/index.js

@@ -422,13 +422,15 @@ function ListView({
 
     if (reviewWorkflowColumns) {
       // Make sure the column header label is translated
-      if (typeof reviewWorkflowColumns.metadatas.label !== 'string') {
+      reviewWorkflowColumns.map((column) => {
-        reviewWorkflowColumns.metadatas.label = formatMessage(
+        if (typeof column.metadatas.label !== 'string') {
-          reviewWorkflowColumns.metadatas.label
+          column.metadatas.label = formatMessage(column.metadatas.label);
-        );
         }
 
-      formattedHeaders.push(reviewWorkflowColumns);
+        return column;
+      });
+
+      formattedHeaders.push(...reviewWorkflowColumns);
     }
 
     return formattedHeaders;

packages/core/admin/ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn/ReviewWorkflowsAssigneeEE.js

@@ -0,0 +1,51 @@
+import React from 'react';
+
+import { Typography } from '@strapi/design-system';
+import PropTypes from 'prop-types';
+import { useIntl } from 'react-intl';
+
+import getTrad from '../../../../../../admin/src/content-manager/utils/getTrad';
+
+export function ReviewWorkflowsAssigneeEE({ firstname, lastname, displayname }) {
+  const { formatMessage } = useIntl();
+
+  // TODO align with changes from this PR, using the getDisplayName util
+  // https://github.com/strapi/strapi/pull/17043/
+  if (displayname) {
+    return (
+      <Typography textColor="neutral800">
+        {formatMessage(
+          {
+            id: getTrad(`containers.ListPage.reviewWorkflows.assignee`),
+            defaultMessage: '{displayname}',
+          },
+          { displayname }
+        )}
+      </Typography>
+    );
+  }
+
+  return (
+    <Typography textColor="neutral800">
+      {formatMessage(
+        {
+          id: getTrad(`containers.ListPage.reviewWorkflows.assignee`),
+          defaultMessage: '{firstname} {lastname}',
+        },
+        { firstname, lastname }
+      )}
+    </Typography>
+  );
+}
+
+ReviewWorkflowsAssigneeEE.defaultProps = {
+  firstname: '',
+  lastname: '',
+  displayname: '',
+};
+
+ReviewWorkflowsAssigneeEE.propTypes = {
+  firstname: PropTypes.string,
+  lastname: PropTypes.string,
+  displayname: PropTypes.string,
+};

packages/core/admin/ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn/constants.js

@@ -1,8 +1,13 @@
 import getTrad from '../../../../../../admin/src/content-manager/utils/getTrad';
+import {
+  ASSIGNEE_ATTRIBUTE_NAME,
+  STAGE_ATTRIBUTE_NAME,
+} from '../../EditView/InformationBox/constants';
 
-export const REVIEW_WORKFLOW_COLUMNS_EE = {
+export const REVIEW_WORKFLOW_COLUMNS_EE = [
-  key: '__strapi_reviewWorkflows_stage_temp_key__',
+  {
-  name: 'strapi_reviewWorkflows_stage',
+    key: `__${STAGE_ATTRIBUTE_NAME}_temp_key__`,
+    name: STAGE_ATTRIBUTE_NAME,
     fieldSchema: {
       type: 'relation',
     },
@@ -21,4 +26,20 @@ export const REVIEW_WORKFLOW_COLUMNS_EE = {
         },
       },
     },
-};
+  },
+  {
+    key: `__${ASSIGNEE_ATTRIBUTE_NAME}_temp_key__`,
+    name: ASSIGNEE_ATTRIBUTE_NAME,
+    fieldSchema: {
+      type: 'relation',
+    },
+    metadatas: {
+      label: {
+        id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.assignee`),
+        defaultMessage: 'Assignee',
+      },
+      searchable: false,
+      sortable: false,
+    },
+  },
+];

packages/core/admin/ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn/getTableColumns.js

@@ -1,95 +0,0 @@
-import React from 'react';
-
-import { Typography } from '@strapi/design-system';
-import { useIntl } from 'react-intl';
-
-import getTrad from '../../../../../../admin/src/content-manager/utils/getTrad';
-import { STAGE_COLOR_DEFAULT } from '../../../../pages/SettingsPage/pages/ReviewWorkflows/constants';
-
-import { ReviewWorkflowsStageEE } from '.';
-
-export default (layout) => {
-  const { formatMessage } = useIntl();
-
-  // TODO: As soon as the feature was enabled in EE mode, the BE currently does not have a way to send
-  // `false` once a user is in CE mode again. We shouldn't have to perform the window.strapi.isEE check here
-  // and it is meant to be in interim solution until we find a better one.
-  const hasReviewWorkflows =
-    (window.strapi.features.isEnabled(window.strapi.features.REVIEW_WORKFLOWS) &&
-      layout.contentType.options?.reviewWorkflows) ??
-    false;
-
-  if (!hasReviewWorkflows) {
-    return [];
-  }
-
-  return [
-    {
-      key: '__strapi_reviewWorkflows_stage_temp_key__',
-      name: 'strapi_reviewWorkflows_stage',
-      fieldSchema: {
-        type: 'relation',
-      },
-      metadatas: {
-        label: formatMessage({
-          id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.stage`),
-          defaultMessage: 'Review stage',
-        }),
-        searchable: false,
-        sortable: true,
-        mainField: {
-          name: 'name',
-          schema: {
-            type: 'string',
-          },
-        },
-      },
-      cellFormatter({ strapi_reviewWorkflows_stage }) {
-        // if entities are created e.g. through lifecycle methods
-        // they may not have a stage assigned
-        if (!strapi_reviewWorkflows_stage) {
-          return <Typography textColor="neutral800">-</Typography>;
-        }
-
-        const { color, name } = strapi_reviewWorkflows_stage;
-
-        return <ReviewWorkflowsStageEE color={color ?? STAGE_COLOR_DEFAULT} name={name} />;
-      },
-    },
-
-    {
-      key: '__strapi_reviewWorkflows_assignee_temp_key__',
-      name: 'strapi_reviewWorkflows_assignee',
-      fieldSchema: {
-        type: 'relation',
-      },
-      metadatas: {
-        label: formatMessage({
-          id: getTrad(`containers.ListPage.table-headers.reviewWorkflows.assignee`),
-          defaultMessage: 'Assignee',
-        }),
-        searchable: false,
-        sortable: false,
-      },
-      cellFormatter({ strapi_assignee }) {
-        if (!strapi_assignee) {
-          return <Typography textColor="neutral800">-</Typography>;
-        }
-
-        const { firstname, lastname } = strapi_assignee;
-
-        return (
-          <Typography textColor="neutral800">
-            {formatMessage(
-              {
-                id: getTrad(`containers.ListPage.reviewWorkflows.assignee`),
-                defaultMessage: '{firstname} {lastname}',
-              },
-              { firstname, lastname }
-            )}
-          </Typography>
-        );
-      },
-    },
-  ];
-};

packages/core/admin/ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn/index.js

@@ -1 +1,2 @@
 export * from './ReviewWorkflowsStageEE';
+export * from './ReviewWorkflowsAssigneeEE';

packages/core/admin/ee/admin/content-manager/pages/ListView/ReviewWorkflowsColumn/tests/ReviewWorkflowsAssignee.test.js

@@ -0,0 +1,31 @@
+import React from 'react';
+
+import { lightTheme, ThemeProvider } from '@strapi/design-system';
+import { render } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+
+import { ReviewWorkflowsAssigneeEE } from '..';
+
+const ComponentFixture = (props) => (
+  <ThemeProvider theme={lightTheme}>
+    <IntlProvider locale="en" messages={{}}>
+      <ReviewWorkflowsAssigneeEE {...props} />
+    </IntlProvider>
+  </ThemeProvider>
+);
+
+const setup = (props) => render(<ComponentFixture {...props} />);
+
+describe('DynamicTable | ReviewWorkflowsAssignee', () => {
+  test('will use displayname over first and last name', () => {
+    const displayname = 'Display Name';
+    const { getByText } = setup({ displayname });
+
+    expect(getByText(displayname)).toBeInTheDocument();
+  });
+  test('render assignee name', () => {
+    const { getByText } = setup({ firstname: 'Kai', lastname: 'Doe' });
+
+    expect(getByText('Kai Doe')).toBeInTheDocument();
+  });
+});

packages/core/admin/ee/server/services/__tests__/assignees.test.js

@@ -67,7 +67,7 @@ describe('Review workflows - Stages service', () => {
         toId
       );
       expect(entityServiceMock.update).toBeCalledWith(uid, id, {
-        data: { strapi_assignee: toId },
+        data: { [ENTITY_ASSIGNEE_ATTRIBUTE]: toId },
         fields: [],
         populate: [ENTITY_ASSIGNEE_ATTRIBUTE],
       });