fix(ui): reset form initial values when workflow is saved

This commit is contained in:
psychedelicious
2025-02-25 08:27:35 +10:00
parent ad4b81ba21
commit 759229e3c8
4 changed files with 72 additions and 28 deletions

View File

@@ -0,0 +1,19 @@
import { useAppStore } from 'app/store/nanostores/store';
import { selectNodesSlice } from 'features/nodes/store/selectors';
import {
getFormFieldInitialValues as _getFormFieldInitialValues,
selectWorkflowForm,
} from 'features/nodes/store/workflowSlice';
import { useCallback } from 'react';
export const useGetFormFieldInitialValues = () => {
const store = useAppStore();
const getFormFieldInitialValues = useCallback(() => {
const form = selectWorkflowForm(store.getState());
const { nodes } = selectNodesSlice(store.getState());
return _getFormFieldInitialValues(form, nodes);
}, [store]);
return getFormFieldInitialValues;
};

View File

@@ -2,8 +2,9 @@ import type { ToastId } from '@invoke-ai/ui-library';
import { useToast } from '@invoke-ai/ui-library';
import { useAppDispatch } from 'app/store/storeHooks';
import { $builtWorkflow } from 'features/nodes/hooks/useWorkflowWatcher';
import { workflowIDChanged, workflowSaved } from 'features/nodes/store/workflowSlice';
import { formFieldInitialValuesChanged, workflowIDChanged, workflowSaved } from 'features/nodes/store/workflowSlice';
import type { WorkflowV3 } from 'features/nodes/types/workflow';
import { useGetFormFieldInitialValues } from 'features/workflowLibrary/hooks/useGetFormInitialValues';
import { workflowUpdated } from 'features/workflowLibrary/store/actions';
import { useCallback, useRef } from 'react';
import { useTranslation } from 'react-i18next';
@@ -24,6 +25,7 @@ export const isWorkflowWithID = (workflow: WorkflowV3): workflow is SetRequired<
export const useSaveLibraryWorkflow: UseSaveLibraryWorkflow = () => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const getFormFieldInitialValues = useGetFormFieldInitialValues();
const [updateWorkflow, updateWorkflowResult] = useUpdateWorkflowMutation();
const [createWorkflow, createWorkflowResult] = useCreateWorkflowMutation();
const toast = useToast();
@@ -48,6 +50,8 @@ export const useSaveLibraryWorkflow: UseSaveLibraryWorkflow = () => {
dispatch(workflowIDChanged(data.workflow.id));
}
dispatch(workflowSaved());
// When a workflow is saved, the form field initial values are updated to the current form field values
dispatch(formFieldInitialValuesChanged({ formFieldInitialValues: getFormFieldInitialValues() }));
toast.update(toastRef.current, {
title: t('workflows.workflowSaved'),
status: 'success',
@@ -69,7 +73,7 @@ export const useSaveLibraryWorkflow: UseSaveLibraryWorkflow = () => {
toast.close(toastRef.current);
}
}
}, [updateWorkflow, dispatch, toast, t, createWorkflow]);
}, [toast, t, dispatch, getFormFieldInitialValues, updateWorkflow, createWorkflow]);
return {
saveWorkflow,
isLoading: updateWorkflowResult.isLoading || createWorkflowResult.isLoading,

View File

@@ -3,12 +3,14 @@ import { useToast } from '@invoke-ai/ui-library';
import { useAppDispatch } from 'app/store/storeHooks';
import { $builtWorkflow } from 'features/nodes/hooks/useWorkflowWatcher';
import {
formFieldInitialValuesChanged,
workflowCategoryChanged,
workflowIDChanged,
workflowNameChanged,
workflowSaved,
} from 'features/nodes/store/workflowSlice';
import type { WorkflowCategory } from 'features/nodes/types/workflow';
import { useGetFormFieldInitialValues } from 'features/workflowLibrary/hooks/useGetFormInitialValues';
import { newWorkflowSaved } from 'features/workflowLibrary/store/actions';
import { useCallback, useRef } from 'react';
import { useTranslation } from 'react-i18next';
@@ -33,6 +35,8 @@ export const useSaveWorkflowAs: UseSaveWorkflowAs = () => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const [createWorkflow, createWorkflowResult] = useCreateWorkflowMutation();
const getFormFieldInitialValues = useGetFormFieldInitialValues();
const toast = useToast();
const toastRef = useRef<ToastId | undefined>();
const saveWorkflowAs = useCallback(
@@ -57,6 +61,8 @@ export const useSaveWorkflowAs: UseSaveWorkflowAs = () => {
dispatch(workflowNameChanged(data.workflow.name));
dispatch(workflowCategoryChanged(data.workflow.meta.category));
dispatch(workflowSaved());
// When a workflow is saved, the form field initial values are updated to the current form field values
dispatch(formFieldInitialValuesChanged({ formFieldInitialValues: getFormFieldInitialValues() }));
dispatch(newWorkflowSaved({ category }));
onSuccess && onSuccess();
@@ -80,7 +86,7 @@ export const useSaveWorkflowAs: UseSaveWorkflowAs = () => {
}
}
},
[toast, createWorkflow, dispatch, t]
[toast, t, createWorkflow, dispatch, getFormFieldInitialValues]
);
return {
saveWorkflowAs,