8839 workflow follow up code step (#8856)

- add readonly mode - fix falsy stepOutput computation
2024-12-05 14:26:28 +01:00
parent 081ecbcfaf
commit 455e548bea
17 changed files with 207 additions and 59 deletions
--- a/packages/twenty-front/src/generated-metadata/graphql.ts
+++ b/packages/twenty-front/src/generated-metadata/graphql.ts
@ -1571,6 +1571,8 @@ export type UpdateServerlessFunctionInput = {
 export type UpdateWorkflowVersionStepInput = {
  /** Step to update in JSON format */
  step: Scalars['JSON']['input'];
+  /** Boolean to check if we need to update stepOutput */
+  shouldUpdateStepOutput?: InputMaybe<Scalars['Boolean']['input']>;
  /** Workflow version ID */
  workflowVersionId: Scalars['String']['input'];
 };
@ -2249,4 +2251,4 @@ export const UpdateOneServerlessFunctionDocument = {"kind":"Document","definitio
 export const FindManyAvailablePackagesDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"FindManyAvailablePackages"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ServerlessFunctionIdInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"getAvailablePackages"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}]}]}}]} as unknown as DocumentNode<FindManyAvailablePackagesQuery, FindManyAvailablePackagesQueryVariables>;
 export const GetManyServerlessFunctionsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GetManyServerlessFunctions"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"findManyServerlessFunctions"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"ServerlessFunctionFields"}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"ServerlessFunctionFields"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ServerlessFunction"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"runtime"}},{"kind":"Field","name":{"kind":"Name","value":"syncStatus"}},{"kind":"Field","name":{"kind":"Name","value":"latestVersion"}},{"kind":"Field","name":{"kind":"Name","value":"latestVersionInputSchema"}},{"kind":"Field","name":{"kind":"Name","value":"publishedVersions"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]} as unknown as DocumentNode<GetManyServerlessFunctionsQuery, GetManyServerlessFunctionsQueryVariables>;
 export const GetOneServerlessFunctionDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GetOneServerlessFunction"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ServerlessFunctionIdInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"findOneServerlessFunction"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"ServerlessFunctionFields"}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"ServerlessFunctionFields"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"ServerlessFunction"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"runtime"}},{"kind":"Field","name":{"kind":"Name","value":"syncStatus"}},{"kind":"Field","name":{"kind":"Name","value":"latestVersion"}},{"kind":"Field","name":{"kind":"Name","value":"latestVersionInputSchema"}},{"kind":"Field","name":{"kind":"Name","value":"publishedVersions"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]} as unknown as DocumentNode<GetOneServerlessFunctionQuery, GetOneServerlessFunctionQueryVariables>;
-export const FindOneServerlessFunctionSourceCodeDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"FindOneServerlessFunctionSourceCode"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"GetServerlessFunctionSourceCodeInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"getServerlessFunctionSourceCode"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}]}]}}]} as unknown as DocumentNode<FindOneServerlessFunctionSourceCodeQuery, FindOneServerlessFunctionSourceCodeQueryVariables>;
+export const FindOneServerlessFunctionSourceCodeDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"FindOneServerlessFunctionSourceCode"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"GetServerlessFunctionSourceCodeInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"getServerlessFunctionSourceCode"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}]}]}}]} as unknown as DocumentNode<FindOneServerlessFunctionSourceCodeQuery, FindOneServerlessFunctionSourceCodeQueryVariables>;
--- a/packages/twenty-front/src/generated/graphql.tsx
+++ b/packages/twenty-front/src/generated/graphql.tsx
@ -1279,6 +1279,8 @@ export type UpdateServerlessFunctionInput = {
 export type UpdateWorkflowVersionStepInput = {
  /** Step to update in JSON format */
  step: Scalars['JSON'];
+  /** Boolean to check if we need to update stepOutput */
+  shouldUpdateStepOutput?: InputMaybe<Scalars['Boolean']>;
  /** Workflow version ID */
  workflowVersionId: Scalars['String'];
 };
@ -4416,4 +4418,4 @@ export function useGetWorkspaceFromInviteHashLazyQuery(baseOptions?: Apollo.Lazy
        }
 export type GetWorkspaceFromInviteHashQueryHookResult = ReturnType<typeof useGetWorkspaceFromInviteHashQuery>;
 export type GetWorkspaceFromInviteHashLazyQueryHookResult = ReturnType<typeof useGetWorkspaceFromInviteHashLazyQuery>;
-export type GetWorkspaceFromInviteHashQueryResult = Apollo.QueryResult<GetWorkspaceFromInviteHashQuery, GetWorkspaceFromInviteHashQueryVariables>;
+export type GetWorkspaceFromInviteHashQueryResult = Apollo.QueryResult<GetWorkspaceFromInviteHashQuery, GetWorkspaceFromInviteHashQueryVariables>;
--- a/packages/twenty-front/src/modules/settings/serverless-functions/hooks/useUpdateOneServerlessFunction.ts
+++ b/packages/twenty-front/src/modules/settings/serverless-functions/hooks/useUpdateOneServerlessFunction.ts
@ -1,6 +1,7 @@
 import { useApolloMetadataClient } from '@/object-metadata/hooks/useApolloMetadataClient';
 import { UPDATE_ONE_SERVERLESS_FUNCTION } from '@/settings/serverless-functions/graphql/mutations/updateOneServerlessFunction';
 import { FIND_MANY_SERVERLESS_FUNCTIONS } from '@/settings/serverless-functions/graphql/queries/findManyServerlessFunctions';
+import { FIND_ONE_SERVERLESS_FUNCTION_SOURCE_CODE } from '@/settings/serverless-functions/graphql/queries/findOneServerlessFunctionSourceCode';
 import { useMutation } from '@apollo/client';
 import { getOperationName } from '@apollo/client/utilities';
 import {
@ -26,7 +27,10 @@ export const useUpdateOneServerlessFunction = () => {
        input,
      },
      awaitRefetchQueries: true,
-      refetchQueries: [getOperationName(FIND_MANY_SERVERLESS_FUNCTIONS) ?? ''],
+      refetchQueries: [
+        getOperationName(FIND_MANY_SERVERLESS_FUNCTIONS) ?? '',
+        getOperationName(FIND_ONE_SERVERLESS_FUNCTION_SOURCE_CODE) ?? '',
+      ],
    });
  };

--- a/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx
+++ b/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx
@ -15,7 +15,6 @@ import {
  IconTrash,
  isDefined,
 } from 'twenty-ui';
-import { capitalize } from '~/utils/string/capitalize';
 import { assertWorkflowWithCurrentVersionIsDefined } from '../utils/assertWorkflowWithCurrentVersionIsDefined';

 export const RecordShowPageWorkflowHeader = ({
@ -73,17 +72,6 @@ export const RecordShowPageWorkflowHeader = ({
            workflowVersionId: workflowWithCurrentVersion.currentVersion.id,
            workflowName: workflowWithCurrentVersion.name,
          });
-
-          enqueueSnackBar('', {
-            variant: SnackBarVariant.Success,
-            title: `${capitalize(workflowWithCurrentVersion.name)} starting...`,
-            icon: (
-              <IconSettingsAutomation
-                size={16}
-                color={theme.snackBar.success.color}
-              />
-            ),
-          });
        }}
      />

--- a/packages/twenty-front/src/modules/workflow/hooks/useUpdateStep.ts
+++ b/packages/twenty-front/src/modules/workflow/hooks/useUpdateStep.ts
@ -14,7 +14,10 @@ export const useUpdateStep = ({
  const { getUpdatableWorkflowVersion } = useGetUpdatableWorkflowVersion();
  const { updateWorkflowVersionStep } = useUpdateWorkflowVersionStep();

-  const updateStep = async <T extends WorkflowStep>(updatedStep: T) => {
+  const updateStep = async <T extends WorkflowStep>(
+    updatedStep: T,
+    shouldUpdateStepOutput = true,
+  ) => {
    if (!isDefined(workflow.currentVersion)) {
      throw new Error('Can not update an undefined workflow version.');
    }
@ -23,6 +26,7 @@ export const useUpdateStep = ({
    await updateWorkflowVersionStep({
      workflowVersionId: workflowVersion.id,
      step: updatedStep,
+      shouldUpdateStepOutput,
    });
  };

--- a/packages/twenty-front/src/modules/workflow/workflow-actions/components/WorkflowEditActionFormServerlessFunction.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-actions/components/WorkflowEditActionFormServerlessFunction.tsx
@ -5,7 +5,7 @@ import { mergeDefaultFunctionInputAndFunctionInput } from '@/workflow/utils/merg
 import { setNestedValue } from '@/workflow/utils/setNestedValue';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import { Fragment, ReactNode, useState } from 'react';
+import { Fragment, ReactNode, useEffect, useState } from 'react';
 import {
  CodeEditor,
  HorizontalSeparator,
@ -63,7 +63,10 @@ type WorkflowEditActionFormServerlessFunctionProps = {
      }
    | {
        readonly?: false;
-        onActionUpdate: (action: WorkflowCodeAction) => void;
+        onActionUpdate: (
+          action: WorkflowCodeAction,
+          shouldUpdateStepOutput?: boolean,
+        ) => void;
      };
 };

@ -88,9 +91,16 @@ export const WorkflowEditActionFormServerlessFunction = ({
    id: serverlessFunctionId,
  });

+  const [functionInput, setFunctionInput] =
+    useState<ServerlessFunctionInputFormData>(
+      action.settings.input.serverlessFunctionInput,
+    );
+
  const { formValues, setFormValues, loading } =
    useServerlessFunctionUpdateFormState(serverlessFunctionId);

+  const headerTitle = action.name || 'Code - Serverless Function';
+
  const save = async () => {
    try {
      await updateOneServerlessFunction({
@ -112,6 +122,9 @@ export const WorkflowEditActionFormServerlessFunction = ({
  const handleSave = usePreventOverlapCallback(save, 1000);

  const onCodeChange = async (value: string) => {
+    if (actionOptions.readonly === true) {
+      return;
+    }
    setFormValues((prevState) => ({
      ...prevState,
      code: { ...prevState.code, [INDEX_FILE_PATH]: value },
@ -121,6 +134,9 @@ export const WorkflowEditActionFormServerlessFunction = ({
  };

  const updateFunctionInputSchema = async () => {
+    if (actionOptions.readonly === true) {
+      return;
+    }
    const sourceCode = formValues.code?.[INDEX_FILE_PATH];
    if (!isDefined(sourceCode)) {
      return;
@ -141,27 +157,25 @@ export const WorkflowEditActionFormServerlessFunction = ({
    100,
  );

-  const [functionInput, setFunctionInput] =
-    useState<ServerlessFunctionInputFormData>(
-      action.settings.input.serverlessFunctionInput,
-    );
-
  const updateFunctionInput = useDebouncedCallback(
-    async (newFunctionInput: object) => {
+    async (newFunctionInput: object, shouldUpdateStepOutput = true) => {
      if (actionOptions.readonly === true) {
        return;
      }

-      actionOptions.onActionUpdate({
-        ...action,
-        settings: {
-          ...action.settings,
-          input: {
-            ...action.settings.input,
-            serverlessFunctionInput: newFunctionInput,
+      actionOptions.onActionUpdate(
+        {
+          ...action,
+          settings: {
+            ...action.settings,
+            input: {
+              ...action.settings.input,
+              serverlessFunctionInput: newFunctionInput,
+            },
          },
        },
-      });
+        shouldUpdateStepOutput,
+      );
    },
    1_000,
  );
@ -171,7 +185,7 @@ export const WorkflowEditActionFormServerlessFunction = ({

    setFunctionInput(updatedFunctionInput);

-    await updateFunctionInput(updatedFunctionInput);
+    await updateFunctionInput(updatedFunctionInput, false);
  };

  const renderFields = (
@ -230,10 +244,6 @@ export const WorkflowEditActionFormServerlessFunction = ({
    });
  };

-  const headerTitle = isDefined(action.name)
-    ? action.name
-    : 'Code - Serverless Function';
-
  const handleEditorDidMount = async (
    editor: editor.IStandaloneCodeEditor,
    monaco: Monaco,
@ -252,10 +262,13 @@ export const WorkflowEditActionFormServerlessFunction = ({
      return;
    }

-    actionOptions?.onActionUpdate({
-      ...action,
-      ...actionUpdate,
-    });
+    actionOptions?.onActionUpdate(
+      {
+        ...action,
+        ...actionUpdate,
+      },
+      false,
+    );
  };

  const checkWorkflowUpdatable = async () => {
@ -265,6 +278,10 @@ export const WorkflowEditActionFormServerlessFunction = ({
    await getUpdatableWorkflowVersion(workflow);
  };

+  useEffect(() => {
+    setFunctionInput(action.settings.input.serverlessFunctionInput);
+  }, [action]);
+
  return (
    !loading && (
      <WorkflowEditGenericFormBase
@ -285,6 +302,10 @@ export const WorkflowEditActionFormServerlessFunction = ({
            await onCodeChange(value);
          }}
          onMount={handleEditorDidMount}
+          options={{
+            readOnly: actionOptions.readonly,
+            domReadOnly: actionOptions.readonly,
+          }}
        />
        {renderFields(functionInput)}
      </WorkflowEditGenericFormBase>