321 command menu context chips compact version (#10072)

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

- Create component
- Create stories
- Fix bug due to `WorkflowDiagramCanvasEditableEffect`

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

@@ -1,4 +1,5 @@
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
+import { commandMenuNavigationStackState } from '@/command-menu/states/commandMenuNavigationStackState';
 import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
 import { RightDrawerHotkeyScope } from '@/ui/layout/right-drawer/types/RightDrawerHotkeyScope';
 import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages';
@@ -32,11 +33,17 @@ export const WorkflowDiagramCanvasEditableEffect = () => {
 
   const setWorkflowSelectedNode = useSetRecoilState(workflowSelectedNodeState);
 
+  const setCommandMenuNavigationStack = useSetRecoilState(
+    commandMenuNavigationStackState,
+  );
+
   const handleSelectionChange = useCallback(
     ({ nodes }: OnSelectionChangeParams) => {
       const selectedNode = nodes[0] as WorkflowDiagramNode;
       const isClosingStep = isDefined(selectedNode) === false;
 
+      setCommandMenuNavigationStack([]);
+
       if (isClosingStep) {
         closeRightDrawer();
         closeCommandMenu();
@@ -69,14 +76,15 @@ export const WorkflowDiagramCanvasEditableEffect = () => {
       });
     },
     [
+      setCommandMenuNavigationStack,
       setWorkflowSelectedNode,
       setHotkeyScope,
       openRightDrawer,
+      getIcon,
       closeRightDrawer,
       closeCommandMenu,
-      startNodeCreation,
-      getIcon,
       t,
+      startNodeCreation,
     ],
   );
 

packages/twenty-front/src/modules/workflow/workflow-diagram/hooks/useStartNodeCreation.ts

@@ -28,7 +28,7 @@ export const useStartNodeCreation = () => {
         Icon: IconSettingsAutomation,
       });
     },
-    [openRightDrawer, setWorkflowCreateStepFromParentStepId, setHotkeyScope],
+    [setWorkflowCreateStepFromParentStepId, setHotkeyScope, openRightDrawer],
   );
 
   return {