diff --git a/apps/dashboard/src/components/create-workflow-button.tsx b/apps/dashboard/src/components/create-workflow-button.tsx
index 757ce353f37..1adebbae0d4 100644
--- a/apps/dashboard/src/components/create-workflow-button.tsx
+++ b/apps/dashboard/src/components/create-workflow-button.tsx
@@ -153,7 +153,15 @@ export const CreateWorkflowButton = (props: CreateWorkflowButtonProps) => {
Add tags
- tag.name)} {...field} value={field.value ?? []} />
+ tag.name)}
+ {...field}
+ value={field.value ?? []}
+ onChange={(tags) => {
+ field.onChange(tags);
+ form.setValue('tags', tags, { shouldValidate: true });
+ }}
+ />
diff --git a/apps/dashboard/src/components/workflow-editor/configure-workflow-form.tsx b/apps/dashboard/src/components/workflow-editor/configure-workflow-form.tsx
index ffde3661e53..b5d59881eda 100644
--- a/apps/dashboard/src/components/workflow-editor/configure-workflow-form.tsx
+++ b/apps/dashboard/src/components/workflow-editor/configure-workflow-form.tsx
@@ -136,6 +136,7 @@ export const ConfigureWorkflowForm = (props: ConfigureWorkflowFormProps) => {
form,
isReadOnly,
save: update,
+ shouldClientValidate: true,
});
const onPauseWorkflow = (active: boolean) => {
diff --git a/apps/dashboard/src/hooks/use-form-autosave.ts b/apps/dashboard/src/hooks/use-form-autosave.ts
index d261b5159b1..957e485cb76 100644
--- a/apps/dashboard/src/hooks/use-form-autosave.ts
+++ b/apps/dashboard/src/hooks/use-form-autosave.ts
@@ -1,8 +1,8 @@
// useFormAutosave.ts
-import { useCallback, useEffect } from 'react';
-import { UseFormReturn, FieldValues } from 'react-hook-form';
import { useDataRef } from '@/hooks/use-data-ref';
import { useDebounce } from '@/hooks/use-debounce';
+import { useCallback, useEffect } from 'react';
+import { FieldValues, UseFormReturn } from 'react-hook-form';
const TEN_SECONDS = 10 * 1000;
@@ -10,11 +10,13 @@ export function useFormAutosave, T extends Fie
previousData,
form: propsForm,
isReadOnly,
+ shouldClientValidate = false,
save,
}: {
previousData: U;
form: UseFormReturn;
isReadOnly?: boolean;
+ shouldClientValidate?: boolean;
save: (data: U) => void;
}) {
const formRef = useDataRef(propsForm);
@@ -33,7 +35,10 @@ export function useFormAutosave, T extends Fie
return;
}
// manually trigger the validation of the form
- await form.trigger();
+ const isValid = await form.trigger();
+ if (!isValid && shouldClientValidate) {
+ return;
+ }
const values = { ...previousData, ...data };
// reset the dirty fields right away because on slow networks the patch request might take a while
@@ -42,7 +47,7 @@ export function useFormAutosave, T extends Fie
form.reset(values, { keepErrors: true });
save(values);
},
- [formRef, previousData, isReadOnly, save]
+ [formRef, previousData, isReadOnly, save, shouldClientValidate]
);
const debouncedOnSave = useDebounce(onSave, TEN_SECONDS);