Localization of actions (#9934)

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx

@@ -6,6 +6,8 @@ import { useDeleteOneWorkflowVersion } from '@/workflow/hooks/useDeleteOneWorkfl
 import { useRunWorkflowVersion } from '@/workflow/hooks/useRunWorkflowVersion';
 import { useWorkflowWithCurrentVersion } from '@/workflow/hooks/useWorkflowWithCurrentVersion';
 import { useTheme } from '@emotion/react';
+import { useLingui } from '@lingui/react/macro';
+
 import {
   Button,
   IconPlayerPlay,
@@ -22,6 +24,7 @@ export const RecordShowPageWorkflowHeader = ({
 }: {
   workflowId: string;
 }) => {
+  const { t } = useLingui();
   const workflowWithCurrentVersion = useWorkflowWithCurrentVersion(workflowId);
 
   const isWaitingForWorkflowWithCurrentVersion =
@@ -44,7 +47,7 @@ export const RecordShowPageWorkflowHeader = ({
   return (
     <>
       <Button
-        title="Test"
+        title={t`Test`}
         variant="secondary"
         Icon={IconPlayerPlay}
         disabled={isWaitingForWorkflowWithCurrentVersion}
@@ -52,10 +55,9 @@ export const RecordShowPageWorkflowHeader = ({
           assertWorkflowWithCurrentVersionIsDefined(workflowWithCurrentVersion);
 
           if (!canWorkflowBeTested) {
-            enqueueSnackBar('Workflow cannot be tested', {
+            enqueueSnackBar(t`Workflow cannot be tested`, {
               variant: SnackBarVariant.Error,
-              detailedMessage:
-                'Trigger type should be Manual - when no record(s) are selected',
+              detailedMessage: t`Trigger type should be Manual - when no record(s) are selected`,
               icon: (
                 <IconSettingsAutomation
                   size={16}
@@ -75,7 +77,7 @@ export const RecordShowPageWorkflowHeader = ({
       {workflowWithCurrentVersion?.currentVersion?.status === 'DRAFT' &&
       workflowWithCurrentVersion.versions?.length > 1 ? (
         <Button
-          title="Discard Draft"
+          title={t`Discard Draft`}
           variant="secondary"
           Icon={IconTrash}
           disabled={isWaitingForWorkflowWithCurrentVersion}
@@ -94,7 +96,7 @@ export const RecordShowPageWorkflowHeader = ({
       {workflowWithCurrentVersion?.currentVersion?.status === 'DRAFT' ||
       workflowWithCurrentVersion?.currentVersion?.status === 'DEACTIVATED' ? (
         <Button
-          title="Activate"
+          title={t`Activate`}
           variant="secondary"
           Icon={IconPower}
           disabled={isWaitingForWorkflowWithCurrentVersion}
@@ -111,7 +113,7 @@ export const RecordShowPageWorkflowHeader = ({
         />
       ) : workflowWithCurrentVersion?.currentVersion?.status === 'ACTIVE' ? (
         <Button
-          title="Deactivate"
+          title={t`Deactivate`}
           variant="secondary"
           Icon={IconPlayerStop}
           disabled={isWaitingForWorkflowWithCurrentVersion}

packages/twenty-front/src/modules/workflow/components/__stories__/RecordShowPageWorkflowHeader.stories.tsx

@@ -4,6 +4,7 @@ import { ComponentDecorator } from 'twenty-ui';
 
 import { RecordShowPageWorkflowHeader } from '@/workflow/components/RecordShowPageWorkflowHeader';
 import { expect, within } from '@storybook/test';
+import { I18nFrontDecorator } from '~/testing/decorators/I18nFrontDecorator';
 import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadataItemsDecorator';
 import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
 import { graphqlMocks } from '~/testing/graphqlMocks';
@@ -12,6 +13,7 @@ const meta: Meta<typeof RecordShowPageWorkflowHeader> = {
   title: 'Modules/Workflow/RecordShowPageWorkflowHeader',
   component: RecordShowPageWorkflowHeader,
   decorators: [
+    I18nFrontDecorator,
     ComponentDecorator,
     ObjectMetadataItemsDecorator,
     SnackBarDecorator,

packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasEditableEffect.tsx

@@ -13,12 +13,14 @@ import {
   WorkflowDiagramStepNodeData,
 } from '@/workflow/workflow-diagram/types/WorkflowDiagram';
 import { getWorkflowNodeIconKey } from '@/workflow/workflow-diagram/utils/getWorkflowNodeIconKey';
+import { useLingui } from '@lingui/react/macro';
 import { OnSelectionChangeParams, useOnSelectionChange } from '@xyflow/react';
 import { useCallback } from 'react';
 import { useSetRecoilState } from 'recoil';
 import { IconBolt, isDefined, useIcons } from 'twenty-ui';
 
 export const WorkflowDiagramCanvasEditableEffect = () => {
+  const { t } = useLingui();
   const { getIcon } = useIcons();
   const { startNodeCreation } = useStartNodeCreation();
 
@@ -43,7 +45,7 @@ export const WorkflowDiagramCanvasEditableEffect = () => {
       const isEmptyTriggerNode = selectedNode.type === EMPTY_TRIGGER_STEP_ID;
       if (isEmptyTriggerNode) {
         openRightDrawer(RightDrawerPages.WorkflowStepSelectTriggerType, {
-          title: 'Trigger Type',
+          title: t`Trigger Type`,
           Icon: IconBolt,
         });
 
@@ -53,7 +55,7 @@ export const WorkflowDiagramCanvasEditableEffect = () => {
       const isCreateStepNode = selectedNode.type === CREATE_STEP_STEP_ID;
       if (isCreateStepNode) {
         if (selectedNode.data.nodeType !== 'create-step') {
-          throw new Error('Expected selected node to be a create step node.');
+          throw new Error(t`Expected selected node to be a create step node.`);
         }
 
         startNodeCreation(selectedNode.data.parentNodeId);
@@ -78,6 +80,7 @@ export const WorkflowDiagramCanvasEditableEffect = () => {
       closeCommandMenu,
       startNodeCreation,
       getIcon,
+      t,
     ],
   );