9024 workflow test serverless function follow up (#9066)

-  Fix Tablist style
- Fix dropdown style (wrong grey background)
- Update dropdown variable when no outputSchema is available 



https://github.com/user-attachments/assets/56698fe8-8dd3-404a-b2b2-f1eca6f5fa28

packages/twenty-front/src/modules/workflow/hooks/__tests__/useTriggerNodeSelection.test.tsx

@@ -13,11 +13,11 @@ const wrapper = ({ children }: { children: React.ReactNode }) => (
 );
 
 describe('useTriggerNodeSelection', () => {
-  const mockUpdateNode = jest.fn();
+  const mockSetNodes = jest.fn();
 
   beforeEach(() => {
     (useReactFlow as jest.Mock).mockReturnValue({
-      updateNode: mockUpdateNode,
+      setNodes: mockSetNodes,
     });
   });
 
@@ -51,7 +51,6 @@ describe('useTriggerNodeSelection', () => {
       result.current.setWorkflowDiagramTriggerNodeSelection(mockNodeId);
     });
 
-    expect(mockUpdateNode).toHaveBeenCalledWith(mockNodeId, { selected: true });
     expect(result.current.workflowDiagramTriggerNodeSelection).toBeUndefined();
   });
 
@@ -61,6 +60,6 @@ describe('useTriggerNodeSelection', () => {
     });
 
     // Ensure updateNode is not called when state is undefined
-    expect(mockUpdateNode).not.toHaveBeenCalled();
+    expect(mockSetNodes).not.toHaveBeenCalled();
   });
 });

packages/twenty-front/src/modules/workflow/hooks/useCreateStep.ts

@@ -1,7 +1,6 @@
 import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
 import { RightDrawerPages } from '@/ui/layout/right-drawer/types/RightDrawerPages';
 import { workflowCreateStepFromParentStepIdState } from '@/workflow/states/workflowCreateStepFromParentStepIdState';
-import { workflowDiagramTriggerNodeSelectionState } from '@/workflow/states/workflowDiagramTriggerNodeSelectionState';
 import { workflowSelectedNodeState } from '@/workflow/states/workflowSelectedNodeState';
 import {
   WorkflowStepType,
@@ -25,10 +24,6 @@ export const useCreateStep = ({
     workflowCreateStepFromParentStepIdState,
   );
 
-  const setWorkflowDiagramTriggerNodeSelection = useSetRecoilState(
-    workflowDiagramTriggerNodeSelectionState,
-  );
-
   const { getUpdatableWorkflowVersion } = useGetUpdatableWorkflowVersion();
 
   const createStep = async (newStepType: WorkflowStepType) => {
@@ -51,15 +46,6 @@ export const useCreateStep = ({
 
     setWorkflowSelectedNode(createdStep.id);
     openRightDrawer(RightDrawerPages.WorkflowStepEdit);
-
-    /**
-     * After the step has been created, select it.
-     * As the `insertNodeAndSave` function mutates the cached workflow before resolving,
-     * we are sure that the new node will have been created at this stage.
-     *
-     * Selecting the node will cause a right drawer to open in order to edit the step.
-     */
-    setWorkflowDiagramTriggerNodeSelection(createdStep.id);
   };
 
   return {

packages/twenty-front/src/modules/workflow/hooks/useTriggerNodeSelection.ts

@@ -21,9 +21,12 @@ export const useTriggerNodeSelection = () => {
       return;
     }
 
-    reactflow.updateNode(workflowDiagramTriggerNodeSelection, {
-      selected: true,
-    });
+    reactflow.setNodes((nodes) =>
+      nodes.map((node) => ({
+        ...node,
+        selected: workflowDiagramTriggerNodeSelection === node.id,
+      })),
+    );
 
     setWorkflowDiagramTriggerNodeSelection(undefined);
   }, [