Set error on number field and prevent form from being submitted (#11637)

<img width="943" alt="Capture d’écran 2025-04-17 à 18 14 46"
src="https://github.com/user-attachments/assets/1208075e-937f-4224-886c-be578264d448"
/>
This commit is contained in:
Thomas Trompette
2025-04-17 18:39:18 +02:00
committed by GitHub
parent 19da80d2e4
commit 18a89b5152
6 changed files with 47 additions and 8 deletions

View File

@ -16,8 +16,8 @@ import { getActionIcon } from '@/workflow/workflow-steps/workflow-actions/utils/
import { useTheme } from '@emotion/react';
import { useEffect, useState } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { useDebouncedCallback } from 'use-debounce';
import { useIcons } from 'twenty-ui/display';
import { useDebouncedCallback } from 'use-debounce';
export type WorkflowEditActionFormFillerProps = {
action: WorkflowFormAction;
@ -39,6 +39,8 @@ export const WorkflowEditActionFormFiller = ({
const { workflowRunId } = useWorkflowStepContextOrThrow();
const { closeCommandMenu } = useCommandMenu();
const { updateWorkflowRunStep } = useUpdateWorkflowRunStep();
const [error, setError] = useState<string | undefined>(undefined);
const canSubmit = !actionOptions.readonly && !isDefined(error);
if (!isDefined(workflowRunId)) {
throw new Error('Form filler action must be used in a workflow run');
@ -164,6 +166,9 @@ export const WorkflowEditActionFormFiller = ({
field.placeholder ??
getDefaultFormFieldSettings(field.type).placeholder
}
onError={(error) => {
setError(error);
}}
/>
);
})}
@ -174,7 +179,7 @@ export const WorkflowEditActionFormFiller = ({
<CmdEnterActionButton
title="Submit"
onClick={onSubmit}
disabled={actionOptions.readonly}
disabled={!canSubmit}
/>,
]}
/>

View File

@ -2,6 +2,7 @@ import { WorkflowFormAction } from '@/workflow/types/Workflow';
import { Meta, StoryObj } from '@storybook/react';
import { expect, within } from '@storybook/test';
import { FieldMetadataType } from 'twenty-shared/types';
import { ComponentDecorator, RouterDecorator } from 'twenty-ui/testing';
import { I18nFrontDecorator } from '~/testing/decorators/I18nFrontDecorator';
import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadataItemsDecorator';
import { WorkflowStepActionDrawerDecorator } from '~/testing/decorators/WorkflowStepActionDrawerDecorator';
@ -9,7 +10,6 @@ import { WorkflowStepDecorator } from '~/testing/decorators/WorkflowStepDecorato
import { WorkspaceDecorator } from '~/testing/decorators/WorkspaceDecorator';
import { graphqlMocks } from '~/testing/graphqlMocks';
import { WorkflowEditActionFormFiller } from '../WorkflowEditActionFormFiller';
import { ComponentDecorator, RouterDecorator } from 'twenty-ui/testing';
const meta: Meta<typeof WorkflowEditActionFormFiller> = {
title: 'Modules/Workflow/Actions/Form/WorkflowEditActionFormFiller',