docs(changeset): feat(Former): enhance state management with additional callbacks and state retrieval
This commit is contained in:
@@ -2,13 +2,16 @@ import { newUUID } from '@warkypublic/artemis-kit';
|
||||
import { createSyncStore } from '@warkypublic/zustandsyncstore';
|
||||
import { produce } from 'immer';
|
||||
|
||||
import type { FormerProps, FormerState } from './Former.types';
|
||||
import type { FormerProps, FormerState, FormStateAndProps } from './Former.types';
|
||||
|
||||
const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
FormerState<any> & Partial<FormerProps<any>>,
|
||||
FormerProps<any>
|
||||
>(
|
||||
(set, get) => ({
|
||||
getAllState: () => {
|
||||
return get() as FormStateAndProps<any>;
|
||||
},
|
||||
getState: (key) => {
|
||||
const current = get();
|
||||
return current?.[key];
|
||||
@@ -26,17 +29,19 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
keyValue
|
||||
);
|
||||
if (get().afterGet) {
|
||||
data = await get().afterGet!({ ...data });
|
||||
data = await get().afterGet!({ ...data }, get());
|
||||
}
|
||||
set({ loading: false, values: data });
|
||||
get().onChange?.(data);
|
||||
get().onChange?.(data, get());
|
||||
}
|
||||
if (reset && get().getFormMethods) {
|
||||
const formMethods = get().getFormMethods!();
|
||||
formMethods.reset();
|
||||
}
|
||||
} catch (e) {
|
||||
set({ error: (e as Error)?.message ?? e, loading: false });
|
||||
const errorMessage = (e as Error)?.message ?? e;
|
||||
set({ error: errorMessage, loading: false });
|
||||
get().onError?.(errorMessage, get());
|
||||
}
|
||||
set({ loading: false });
|
||||
},
|
||||
@@ -66,7 +71,7 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
let data = formMethods.getValues();
|
||||
|
||||
if (get().beforeSave) {
|
||||
const newData = await get().beforeSave!(data);
|
||||
const newData = await get().beforeSave!(data, get());
|
||||
data = newData;
|
||||
}
|
||||
|
||||
@@ -76,7 +81,9 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
data = newdata;
|
||||
},
|
||||
(errors) => {
|
||||
set({ error: errors.root?.message || 'Validation errors', loading: false });
|
||||
const errorMessage = errors.root?.message || 'Validation errors';
|
||||
set({ error: errorMessage, loading: false });
|
||||
get().onError?.(errorMessage, get());
|
||||
exit = true;
|
||||
}
|
||||
);
|
||||
@@ -107,21 +114,22 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
data,
|
||||
keyValue
|
||||
);
|
||||
const newData = { ...data, ...savedData }; //Merge what we had. In case the API doesn't return all fields, we don't want to lose them
|
||||
if (get().afterSave) {
|
||||
await get().afterSave!(savedData);
|
||||
await get().afterSave!(newData, get());
|
||||
}
|
||||
set({ loading: false, values: savedData });
|
||||
get().onChange?.(savedData);
|
||||
formMethods.reset(savedData); //reset with saved data to clear dirty state
|
||||
set({ loading: false, values: newData });
|
||||
get().onChange?.(newData, get());
|
||||
formMethods.reset(newData); //reset with saved data to clear dirty state
|
||||
if (!keepOpen) {
|
||||
get().onClose?.(savedData);
|
||||
get().onClose?.(newData);
|
||||
}
|
||||
return savedData;
|
||||
return newData;
|
||||
}
|
||||
|
||||
set({ loading: false, values: data });
|
||||
formMethods.reset(data); //reset with saved data to clear dirty state
|
||||
get().onChange?.(data);
|
||||
get().onChange?.(data, get());
|
||||
if (!keepOpen) {
|
||||
get().onClose?.(data);
|
||||
}
|
||||
@@ -129,7 +137,9 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
return data;
|
||||
}
|
||||
} catch (e) {
|
||||
set({ error: (e as Error)?.message ?? e, loading: false });
|
||||
const errorMessage = (e as Error)?.message ?? e;
|
||||
set({ error: errorMessage, loading: false });
|
||||
get().onError?.(errorMessage, get());
|
||||
}
|
||||
|
||||
return undefined;
|
||||
@@ -181,20 +191,20 @@ const { Provider: FormerProvider, useStore: useFormerStore } = createSyncStore<
|
||||
|
||||
return {
|
||||
id: !id ? newUUID() : id,
|
||||
onClose: () => {
|
||||
onClose: (data?: any) => {
|
||||
const dirty = useStoreApi.getState().dirty;
|
||||
const setState = useStoreApi.getState().setState;
|
||||
if (dirty) {
|
||||
if (confirm('You have unsaved changes. Are you sure you want to close?')) {
|
||||
if (onClose) {
|
||||
onClose();
|
||||
onClose(data);
|
||||
} else {
|
||||
setState('opened', false);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (onClose) {
|
||||
onClose();
|
||||
onClose(data);
|
||||
} else {
|
||||
setState('opened', false);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user