Add console logs to code step (#10786)

Works for local and lambda drivers

## After

![image](https://github.com/user-attachments/assets/ec082cf6-4159-4a15-99b6-243c73a13773)

![image](https://github.com/user-attachments/assets/f42e3f43-5ea4-4167-b4b5-9a17826fd224)

packages/twenty-front/src/modules/serverless-functions/hooks/useTestServerlessFunction.ts

@@ -45,6 +45,7 @@ export const useTestServerlessFunction = ({
                 4,
               )
             : undefined,
+          logs: result?.data?.executeOneServerlessFunction?.logs || '',
           duration: result?.data?.executeOneServerlessFunction?.duration,
           status: result?.data?.executeOneServerlessFunction?.status,
           error: result?.data?.executeOneServerlessFunction?.error

packages/twenty-front/src/modules/settings/serverless-functions/graphql/mutations/executeOneServerlessFunction.ts

@@ -6,6 +6,7 @@ export const EXECUTE_ONE_SERVERLESS_FUNCTION = gql`
   ) {
     executeOneServerlessFunction(input: $input) {
       data
+      logs
       duration
       status
       error

packages/twenty-front/src/modules/ui/input/components/TextArea.tsx

@@ -14,6 +14,7 @@ export type TextAreaProps = {
   label?: string;
   disabled?: boolean;
   minRows?: number;
+  maxRows?: number;
   onChange?: (value: string) => void;
   placeholder?: string;
   value?: string;
@@ -73,12 +74,13 @@ export const TextArea = ({
   disabled,
   placeholder,
   minRows = 1,
+  maxRows = MAX_ROWS,
   value = '',
   className,
   onChange,
   onBlur,
 }: TextAreaProps) => {
-  const computedMinRows = Math.min(minRows, MAX_ROWS);
+  const computedMinRows = Math.min(minRows, maxRows);
 
   const inputId = useId();
 
@@ -103,7 +105,7 @@ export const TextArea = ({
       <StyledTextArea
         id={inputId}
         placeholder={placeholder}
-        maxRows={MAX_ROWS}
+        maxRows={maxRows}
         minRows={computedMinRows}
         value={value}
         onChange={(event) =>

packages/twenty-front/src/modules/workflow/states/serverlessFunctionTestDataFamilyState.ts

@@ -5,6 +5,7 @@ export type ServerlessFunctionTestData = {
   input: { [field: string]: any };
   output: {
     data?: string;
+    logs: string;
     duration?: number;
     status?: ServerlessFunctionExecutionStatus;
     error?: string;
@@ -15,6 +16,7 @@ export type ServerlessFunctionTestData = {
 
 export const DEFAULT_OUTPUT_VALUE = {
   data: 'Enter an input above then press "Test"',
+  logs: '',
   status: ServerlessFunctionExecutionStatus.IDLE,
 };
 

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

@@ -37,6 +37,7 @@ import { useRecoilState, useRecoilValue } from 'recoil';
 import { isDefined } from 'twenty-shared';
 import { CodeEditor, IconCode, IconPlayerPlay, useIcons } from 'twenty-ui';
 import { useDebouncedCallback } from 'use-debounce';
+import { TextArea } from '@/ui/input/components/TextArea';
 
 const StyledContainer = styled.div`
   display: flex;
@@ -340,6 +341,16 @@ export const WorkflowEditActionFormServerlessFunction = ({
                   isTesting={isTesting}
                 />
               </StyledCodeEditorContainer>
+              <StyledCodeEditorContainer>
+                <InputLabel>Logs</InputLabel>
+                <TextArea
+                  value={
+                    isTesting ? '' : serverlessFunctionTestData.output.logs
+                  }
+                  maxRows={20}
+                  disabled
+                />
+              </StyledCodeEditorContainer>
             </>
           )}
         </WorkflowStepBody>