Change workflow node type (#14570)

- Update step endpoint now supports the case where node type is updated
- Added a new page for edition that re-uses the existing select action
component

Additional work:
- moved submitForm function to workflow runner service



https://github.com/user-attachments/assets/1fcb0adc-fe17-41f9-b2ea-4f84318db860

packages/twenty-front/src/modules/command-menu/hooks/useWorkflowCommandMenu.ts

@@ -3,6 +3,7 @@ import { commandMenuWorkflowIdComponentState } from '@/command-menu/pages/workfl
 import { commandMenuWorkflowRunIdComponentState } from '@/command-menu/pages/workflow/states/commandMenuWorkflowRunIdComponentState';
 import { commandMenuWorkflowVersionIdComponentState } from '@/command-menu/pages/workflow/states/commandMenuWorkflowVersionIdComponentState';
 import { CommandMenuPages } from '@/command-menu/types/CommandMenuPages';
+import { type WorkflowRunStepStatus } from '@/workflow/types/Workflow';
 import { useSetInitialWorkflowRunRightDrawerTab } from '@/workflow/workflow-diagram/hooks/useSetInitialWorkflowRunRightDrawerTab';
 import { t } from '@lingui/core/macro';
 import { useRecoilCallback } from 'recoil';
@@ -12,7 +13,6 @@ import {
   IconSettingsAutomation,
 } from 'twenty-ui/display';
 import { v4 } from 'uuid';
-import { type WorkflowRunStepStatus } from '@/workflow/types/Workflow';
 
 export const useWorkflowCommandMenu = () => {
   const { navigateCommandMenu } = useNavigateCommandMenu();
@@ -42,7 +42,7 @@ export const useWorkflowCommandMenu = () => {
     [navigateCommandMenu],
   );
 
-  const openStepSelectInCommandMenu = useRecoilCallback(
+  const openWorkflowCreateStepInCommandMenu = useRecoilCallback(
     ({ set }) => {
       return (workflowId: string) => {
         const pageId = v4();
@@ -55,7 +55,7 @@ export const useWorkflowCommandMenu = () => {
         );
 
         navigateCommandMenu({
-          page: CommandMenuPages.WorkflowStepSelectAction,
+          page: CommandMenuPages.WorkflowStepCreate,
           pageTitle: t`Select Action`,
           pageIcon: IconSettingsAutomation,
           pageId,
@@ -88,6 +88,29 @@ export const useWorkflowCommandMenu = () => {
     [navigateCommandMenu],
   );
 
+  const openWorkflowEditStepTypeInCommandMenu = useRecoilCallback(
+    ({ set }) => {
+      return (workflowId: string) => {
+        const pageId = v4();
+
+        set(
+          commandMenuWorkflowIdComponentState.atomFamily({
+            instanceId: pageId,
+          }),
+          workflowId,
+        );
+
+        navigateCommandMenu({
+          page: CommandMenuPages.WorkflowStepEditType,
+          pageTitle: t`Select action`,
+          pageIcon: IconSettingsAutomation,
+          pageId,
+        });
+      };
+    },
+    [navigateCommandMenu],
+  );
+
   const openWorkflowViewStepInCommandMenu = useRecoilCallback(
     ({ set }) => {
       return ({
@@ -177,8 +200,9 @@ export const useWorkflowCommandMenu = () => {
 
   return {
     openWorkflowTriggerTypeInCommandMenu,
-    openStepSelectInCommandMenu,
+    openWorkflowCreateStepInCommandMenu,
     openWorkflowEditStepInCommandMenu,
+    openWorkflowEditStepTypeInCommandMenu,
     openWorkflowViewStepInCommandMenu,
     openWorkflowRunViewStepInCommandMenu,
   };