Visualize workflow run step input (#10677)

- Compute the context the selected step had access to during its
execution and display it with the `<JsonNestedNode />` component
- Ensure several steps with the same name can be displayed in order
- Prevent access to the input tab in a few cases
- Hide the input tab when the trigger node is selected as this node
takes no input
- Hide the input tab when the selected node has not been executed yet or
is currently executed
- Fallback to the Node tab when the Input tab can't be accessed

## Successful workflow execution


https://github.com/user-attachments/assets/4a2bb5f5-450c-46ed-b2d7-a14d3b1e5c1f

## Failed workflow execution


https://github.com/user-attachments/assets/3be2784e-e76c-48ab-aef5-17f63410898e

Closes https://github.com/twentyhq/core-team-issues/issues/433

packages/twenty-front/src/modules/workflow/workflow-trigger/components/RightDrawerWorkflowSelectTriggerTypeContent.tsx

@@ -1,8 +1,13 @@
 import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
 import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
 import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages';
-import { WorkflowWithCurrentVersion } from '@/workflow/types/Workflow';
+import {
+  WorkflowTriggerType,
+  WorkflowWithCurrentVersion,
+} from '@/workflow/types/Workflow';
 import { workflowSelectedNodeState } from '@/workflow/workflow-diagram/states/workflowSelectedNodeState';
+import { RightDrawerStepListContainer } from '@/workflow/workflow-steps/components/RightDrawerWorkflowSelectStepContainer';
+import { RightDrawerWorkflowSelectStepTitle } from '@/workflow/workflow-steps/components/RightDrawerWorkflowSelectStepTitle';
 import { DATABASE_TRIGGER_TYPES } from '@/workflow/workflow-trigger/constants/DatabaseTriggerTypes';
 import { OTHER_TRIGGER_TYPES } from '@/workflow/workflow-trigger/constants/OtherTriggerTypes';
 import { TRIGGER_STEP_ID } from '@/workflow/workflow-trigger/constants/TriggerStepId';
@@ -10,8 +15,6 @@ import { useUpdateWorkflowVersionTrigger } from '@/workflow/workflow-trigger/hoo
 import { getTriggerDefaultDefinition } from '@/workflow/workflow-trigger/utils/getTriggerDefaultDefinition';
 import { useSetRecoilState } from 'recoil';
 import { MenuItemCommand, useIcons } from 'twenty-ui';
-import { RightDrawerStepListContainer } from '@/workflow/workflow-steps/components/RightDrawerWorkflowSelectStepContainer';
-import { RightDrawerWorkflowSelectStepTitle } from '@/workflow/workflow-steps/components/RightDrawerWorkflowSelectStepTitle';
 
 export const RightDrawerWorkflowSelectTriggerTypeContent = ({
   workflow,
@@ -26,6 +29,33 @@ export const RightDrawerWorkflowSelectTriggerTypeContent = ({
   const { openRightDrawer } = useRightDrawer();
   const setWorkflowSelectedNode = useSetRecoilState(workflowSelectedNodeState);
 
+  const handleTriggerTypeClick = ({
+    type,
+    defaultLabel,
+    icon,
+  }: {
+    type: WorkflowTriggerType;
+    defaultLabel: string;
+    icon: string;
+  }) => {
+    return async () => {
+      await updateTrigger(
+        getTriggerDefaultDefinition({
+          defaultLabel,
+          type,
+          activeObjectMetadataItems,
+        }),
+      );
+
+      setWorkflowSelectedNode(TRIGGER_STEP_ID);
+
+      openRightDrawer(RightDrawerPages.WorkflowStepEdit, {
+        title: defaultLabel,
+        Icon: getIcon(icon),
+      });
+    };
+  };
+
   return (
     <RightDrawerStepListContainer>
       <RightDrawerWorkflowSelectStepTitle>
@@ -36,22 +66,7 @@ export const RightDrawerWorkflowSelectTriggerTypeContent = ({
           key={action.defaultLabel}
           LeftIcon={getIcon(action.icon)}
           text={action.defaultLabel}
-          onClick={async () => {
-            await updateTrigger(
-              getTriggerDefaultDefinition({
-                defaultLabel: action.defaultLabel,
-                type: action.type,
-                activeObjectMetadataItems,
-              }),
-            );
-
-            setWorkflowSelectedNode(TRIGGER_STEP_ID);
-
-            openRightDrawer(RightDrawerPages.WorkflowStepEdit, {
-              title: action.defaultLabel,
-              Icon: getIcon(action.icon),
-            });
-          }}
+          onClick={handleTriggerTypeClick(action)}
         />
       ))}
       <RightDrawerWorkflowSelectStepTitle>
@@ -62,22 +77,7 @@ export const RightDrawerWorkflowSelectTriggerTypeContent = ({
           key={action.defaultLabel}
           LeftIcon={getIcon(action.icon)}
           text={action.defaultLabel}
-          onClick={async () => {
-            await updateTrigger(
-              getTriggerDefaultDefinition({
-                defaultLabel: action.defaultLabel,
-                type: action.type,
-                activeObjectMetadataItems,
-              }),
-            );
-
-            setWorkflowSelectedNode(TRIGGER_STEP_ID);
-
-            openRightDrawer(RightDrawerPages.WorkflowStepEdit, {
-              title: action.defaultLabel,
-              Icon: getIcon(action.icon),
-            });
-          }}
+          onClick={handleTriggerTypeClick(action)}
         />
       ))}
     </RightDrawerStepListContainer>