9426 migrate workflow pages to command menu (#9515)

Closes twentyhq/core-team-issues#53 

- Removes command menu top bar text input when the user is not on root
page
- Fixes bug when resetting command menu context
- Added animations on command menu open and close
- Refactored workflow visualizer code to remove unnecessary rerenders
and props drilling


https://github.com/user-attachments/assets/1da3adb8-220b-407b-9279-30354d3100d3

packages/twenty-front/src/modules/workflow/workflow-steps/hooks/__tests__/useDeleteStep.test.ts

@@ -1,6 +1,7 @@
 import { WorkflowWithCurrentVersion } from '@/workflow/types/Workflow';
 import { useDeleteStep } from '@/workflow/workflow-steps/hooks/useDeleteStep';
 import { renderHook } from '@testing-library/react';
+import { RecoilRoot } from 'recoil';
 
 const mockCloseRightDrawer = jest.fn();
 const mockCreateNewWorkflowVersion = jest.fn();
@@ -13,12 +14,6 @@ jest.mock('@/object-record/hooks/useUpdateOneRecord', () => ({
   }),
 }));
 
-jest.mock('recoil', () => ({
-  useRecoilValue: () => 'parent-step-id',
-  useSetRecoilState: () => jest.fn(),
-  atom: (params: any) => params,
-}));
-
 jest.mock('@/ui/layout/right-drawer/hooks/useRightDrawer', () => ({
   useRightDrawer: () => ({
     closeRightDrawer: mockCloseRightDrawer,
@@ -50,10 +45,12 @@ describe('useDeleteStep', () => {
   };
 
   it('should delete step in draft version', async () => {
-    const { result } = renderHook(() =>
-      useDeleteStep({
-        workflow: mockWorkflow as unknown as WorkflowWithCurrentVersion,
-      }),
+    const { result } = renderHook(
+      () =>
+        useDeleteStep({
+          workflow: mockWorkflow as unknown as WorkflowWithCurrentVersion,
+        }),
+      { wrapper: RecoilRoot },
     );
     await result.current.deleteStep('1');
 

packages/twenty-front/src/modules/workflow/workflow-steps/hooks/useDeleteStep.ts

@@ -1,3 +1,4 @@
+import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
 import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
@@ -22,9 +23,11 @@ export const useDeleteStep = ({
 
   const { getUpdatableWorkflowVersion } = useGetUpdatableWorkflowVersion();
   const { closeRightDrawer } = useRightDrawer();
+  const { closeCommandMenu } = useCommandMenu();
 
   const deleteStep = async (stepId: string) => {
     closeRightDrawer();
+    closeCommandMenu();
     const workflowVersion = await getUpdatableWorkflowVersion(workflow);
     if (stepId === TRIGGER_STEP_ID) {
       await updateOneWorkflowVersion({