Workflow fast follows batch (#9587)

- Add icon chevron on select
- Fix event step label
- Fix generate function output

packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormSelectFieldInput.tsx

@@ -14,10 +14,11 @@ import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectab
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { isStandaloneVariableString } from '@/workflow/utils/isStandaloneVariableString';
+import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { useId, useState } from 'react';
 import { Key } from 'ts-key-enum';
-import { isDefined, VisibilityHidden } from 'twenty-ui';
+import { IconChevronDown, isDefined, VisibilityHidden } from 'twenty-ui';
 
 type FormSelectFieldInputProps = {
   label?: string;
@@ -37,6 +38,7 @@ const StyledDisplayModeReadonlyContainer = styled.div`
   font-family: inherit;
   padding-inline: ${({ theme }) => theme.spacing(2)};
   width: 100%;
+  justify-content: space-between;
 `;
 
 const StyledDisplayModeContainer = styled(StyledDisplayModeReadonlyContainer)`
@@ -46,6 +48,7 @@ const StyledDisplayModeContainer = styled(StyledDisplayModeReadonlyContainer)`
   &[data-open='true'] {
     background-color: ${({ theme }) => theme.background.transparent.lighter};
   }
+  justify-content: space-between;
 `;
 
 const StyledSelectInputContainer = styled.div`
@@ -66,6 +69,7 @@ export const FormSelectFieldInput = ({
   const inputId = useId();
 
   const hotkeyScope = InlineCellHotkeyScope.InlineCell;
+  const theme = useTheme();
 
   const {
     setHotkeyScopeAndMemorizePreviousScope,
@@ -227,6 +231,10 @@ export const FormSelectFieldInput = ({
                     Icon={selectedOption.icon ?? undefined}
                   />
                 )}
+                <IconChevronDown
+                  size={theme.icon.size.md}
+                  color={theme.font.color.tertiary}
+                />
               </StyledDisplayModeReadonlyContainer>
             ) : (
               <StyledDisplayModeContainer
@@ -242,6 +250,10 @@ export const FormSelectFieldInput = ({
                     Icon={selectedOption.icon ?? undefined}
                   />
                 )}
+                <IconChevronDown
+                  size={theme.icon.size.md}
+                  color={theme.font.color.tertiary}
+                />
               </StyledDisplayModeContainer>
             )
           ) : (

packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionFormServerlessFunction.tsx

@@ -8,7 +8,6 @@ import { WorkflowCodeAction } from '@/workflow/types/Workflow';
 import { WorkflowStepHeader } from '@/workflow/workflow-steps/components/WorkflowStepHeader';
 import { setNestedValue } from '@/workflow/workflow-steps/workflow-actions/utils/setNestedValue';
 
-import { Monaco } from '@monaco-editor/react';
 import { CmdEnterActionButton } from '@/action-menu/components/CmdEnterActionButton';
 import { ServerlessFunctionExecutionResult } from '@/serverless-functions/components/ServerlessFunctionExecutionResult';
 import { INDEX_FILE_PATH } from '@/serverless-functions/constants/IndexFilePath';
@@ -24,16 +23,17 @@ import { serverlessFunctionTestDataFamilyState } from '@/workflow/states/serverl
 import { WorkflowStepBody } from '@/workflow/workflow-steps/components/WorkflowStepBody';
 import { WorkflowEditActionFormServerlessFunctionFields } from '@/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionFormServerlessFunctionFields';
 import { WORKFLOW_SERVERLESS_FUNCTION_TAB_LIST_COMPONENT_ID } from '@/workflow/workflow-steps/workflow-actions/constants/WorkflowServerlessFunctionTabListComponentId';
+import { getWrongExportedFunctionMarkers } from '@/workflow/workflow-steps/workflow-actions/utils/getWrongExportedFunctionMarkers';
 import { WorkflowVariablePicker } from '@/workflow/workflow-variables/components/WorkflowVariablePicker';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
+import { Monaco } from '@monaco-editor/react';
 import { editor } from 'monaco-editor';
 import { AutoTypings } from 'monaco-editor-auto-typings';
 import { useEffect, useState } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import { CodeEditor, IconCode, IconPlayerPlay, isDefined } from 'twenty-ui';
 import { useDebouncedCallback } from 'use-debounce';
-import { getWrongExportedFunctionMarkers } from '@/workflow/workflow-steps/workflow-actions/utils/getWrongExportedFunctionMarkers';
 
 const StyledContainer = styled.div`
   display: flex;
@@ -178,7 +178,7 @@ export const WorkflowEditActionFormServerlessFunction = ({
               isLeaf: true,
               icon: 'IconVariable',
               tab: 'test',
-              label: 'Generate Function Input',
+              label: 'Generate Function Output',
             },
             _outputSchemaType: 'LINK',
           },

packages/twenty-server/src/modules/workflow/common/workspace-services/workflow-version-step.workspace-service.ts

@@ -92,7 +92,7 @@ export class WorkflowVersionStepWorkspaceService {
                 isLeaf: true,
                 icon: 'IconVariable',
                 tab: 'test',
-                label: 'Generate Function Input',
+                label: 'Generate Function Output',
               },
               _outputSchemaType: 'LINK',
             },

packages/twenty-server/src/modules/workflow/workflow-builder/utils/generate-fake-object-record-event.ts

@@ -49,7 +49,7 @@ export const generateFakeObjectRecordEvent = (
       properties: {
         isLeaf: false,
         value: { after: { isLeaf: false, value: after, label: 'After' } },
-        label: 'Properties',
+        label: 'Record fields',
       },
     };
   }
@@ -65,7 +65,7 @@ export const generateFakeObjectRecordEvent = (
           before: { isLeaf: false, value: before, label: 'Before' },
           after: { isLeaf: false, value: after, label: 'After' },
         },
-        label: 'Properties',
+        label: 'Record fields',
       },
     };
   }
@@ -78,7 +78,7 @@ export const generateFakeObjectRecordEvent = (
         value: {
           before: { isLeaf: false, value: before, label: 'Before' },
         },
-        label: 'Properties',
+        label: 'Record fields',
       },
     };
   }
@@ -91,7 +91,7 @@ export const generateFakeObjectRecordEvent = (
         value: {
           before: { isLeaf: false, value: before, label: 'Before' },
         },
-        label: 'Properties',
+        label: 'Record fields',
       },
     };
   }