Merge pull request #17276 from strapi/feature/review-workflow-multiple-initial-colors

Fix: Make stage theme color retrieval more defensive

packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/components/Stages/Stage/Stage.js

@@ -174,7 +174,7 @@ export function Stage({
     dragPreviewRef(getEmptyImage(), { captureDraggingState: false });
   }, [dragPreviewRef, index]);
 
-  const { themeColorName } = colorField.value ? getStageColorByHex(colorField.value) : {};
+  const { themeColorName } = getStageColorByHex(colorField.value) ?? {};
 
   return (
     <Box ref={composedRef}>

packages/core/admin/ee/admin/pages/SettingsPage/pages/ReviewWorkflows/components/Stages/Stage/tests/Stage.test.js

@@ -19,18 +19,22 @@ const STAGES_FIXTURE = {
   index: 0,
 };
 
-const ComponentFixture = (props) => {
+const ComponentFixture = ({
+  // eslint-disable-next-line react/prop-types
+  stages = [
+    {
+      color: STAGE_COLOR_DEFAULT,
+      name: 'something',
+    },
+  ],
+  ...props
+}) => {
   const store = configureStore([], [reducer]);
 
   const formik = useFormik({
     enableReinitialize: true,
     initialValues: {
-      stages: [
-        {
-          color: STAGE_COLOR_DEFAULT,
-          name: 'something',
-        },
-      ],
+      stages,
     },
     validateOnChange: false,
   });
@@ -96,4 +100,19 @@ describe('Admin | Settings | Review Workflow | Stage', () => {
       })
     ).not.toBeInTheDocument();
   });
+
+  it('should not crash on a custom color code', async () => {
+    const { getByRole } = setup({
+      isOpen: true,
+      canDelete: false,
+      stages: [
+        {
+          color: '#FF4945',
+          name: 'something',
+        },
+      ],
+    });
+
+    expect(getByRole('textbox').value).toBe('something');
+  });
 });

packages/core/admin/ee/server/constants/default-stages.json

@@ -9,7 +9,7 @@
   },
   {
     "name": "In progress",
-    "color": "#FF4945"
+    "color": "#EE5E52"
   },
   {
     "name": "Reviewed",