Skip to content

Commit 701d18f

Browse files
authored
fix: fix mutators logic (#157)
1 parent 908b168 commit 701d18f

File tree

8 files changed

+136
-69
lines changed

8 files changed

+136
-69
lines changed

src/lib/core/components/Form/Controller/Controller.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,14 +34,14 @@ export const Controller = <
3434
parentOnChange,
3535
parentOnUnmount,
3636
}: ControllerProps<DirtyValue, SpecType>) => {
37-
const {config, tools, mutators, __mirror} = useDynamicFormsCtx();
37+
const {config, tools, mutatorsStore, __mirror} = useDynamicFormsCtx();
3838

3939
const firstRenderRef = React.useRef(true);
4040
const [store, setStore] = React.useState<ControllerStore<DirtyValue, Value, SpecType>>(
4141
initializeStore({
4242
name,
4343
spec: _spec,
44-
mutators,
44+
mutatorsStore,
4545
config,
4646
valueFromParent,
4747
tools,
@@ -148,7 +148,7 @@ export const Controller = <
148148
name,
149149
parentOnChange,
150150
parentOnUnmount,
151-
mutators,
151+
mutatorsStore,
152152
config,
153153
tools,
154154
methodOnChange: fieldMethods.onChange,
@@ -160,7 +160,7 @@ export const Controller = <
160160
name,
161161
parentOnChange,
162162
parentOnUnmount,
163-
mutators,
163+
mutatorsStore,
164164
config,
165165
tools.onChange,
166166
tools.onUnmount,

src/lib/core/components/Form/Controller/types.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {FormValue, Spec} from '../../../types';
22
import {
33
DynamicFormConfig,
4-
DynamicFormMutators,
4+
DynamicFormMutatorsStore,
55
DynamicFormsContext,
66
FieldRenderProps,
77
FieldValue,
@@ -14,7 +14,7 @@ import {
1414
export interface GetSpecParams<SpecType extends Spec> {
1515
name: string;
1616
spec: SpecType;
17-
mutators: DynamicFormMutators;
17+
mutatorsStore: DynamicFormMutatorsStore;
1818
}
1919

2020
export interface GetComponentsParams<SpecType extends Spec> {
@@ -49,7 +49,7 @@ export interface GetFieldInitialsParams<
4949
valueFromParent: DirtyValue;
5050
initialValue: DirtyValue;
5151
validate: (value?: Value) => ValidateError;
52-
mutators: DynamicFormMutators;
52+
mutatorsStore: DynamicFormMutatorsStore;
5353
}
5454

5555
export type FieldMethod<
@@ -88,7 +88,7 @@ export interface GetFieldMethodsReturn<
8888
export interface InitializeStoreParams<DirtyValue extends FieldValue, SpecType extends Spec> {
8989
name: string;
9090
spec: SpecType;
91-
mutators: DynamicFormMutators;
91+
mutatorsStore: DynamicFormMutatorsStore;
9292
config: DynamicFormConfig;
9393
valueFromParent: DirtyValue;
9494
tools: DynamicFormsContext['tools'];
@@ -112,7 +112,7 @@ export interface ControllerStore<
112112
initialSpec: SpecType;
113113
config: DynamicFormConfig;
114114
tools: DynamicFormsContext['tools'];
115-
mutators: DynamicFormMutators;
115+
mutatorsStore: DynamicFormMutatorsStore;
116116
render: (props: FieldRenderProps<DirtyValue>) => JSX.Element | null;
117117
validate: (value?: Value) => ValidateError;
118118
parentOnChange:
@@ -157,7 +157,7 @@ export interface UpdateStoreParams<
157157
) => void)
158158
| null;
159159
parentOnUnmount: ((childName: string) => void) | null;
160-
mutators: DynamicFormMutators;
160+
mutatorsStore: DynamicFormMutatorsStore;
161161
valueFromParent: DirtyValue;
162162
config: DynamicFormConfig;
163163
tools: DynamicFormsContext['tools'];

src/lib/core/components/Form/Controller/utils.tsx

Lines changed: 62 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {isArraySpec, isCorrectSpec, isNumberSpec, isObjectSpec} from '../../../h
88
import {FormValue, Spec} from '../../../types';
99
import {EMPTY_MUTATOR, OBJECT_ARRAY_CNT, OBJECT_ARRAY_FLAG} from '../constants';
1010
import {
11+
BaseValidateError,
1112
FieldArrayValue,
1213
FieldObjectValue,
1314
FieldRenderProps,
@@ -30,13 +31,20 @@ import {
3031
UpdateStoreParams,
3132
} from './types';
3233

33-
const isErrorMutatorCorrect = (errorMutator: ValidateError) =>
34-
errorMutator !== EMPTY_MUTATOR && (_.isString(errorMutator) || _.isBoolean(errorMutator));
34+
const isErrorMutatorCorrect = (errorMutator: {value: ValidateError} | typeof EMPTY_MUTATOR) =>
35+
errorMutator !== EMPTY_MUTATOR &&
36+
(_.isString(errorMutator.value) ||
37+
_.isBoolean(errorMutator.value) ||
38+
_.isUndefined(errorMutator.value));
3539

36-
const isValueMutatorCorrect = (valueMutator: FormValue, spec: Spec) =>
40+
const isValueMutatorCorrect = (
41+
valueMutator: {value: FormValue} | typeof EMPTY_MUTATOR,
42+
spec: Spec,
43+
) =>
3744
valueMutator !== EMPTY_MUTATOR &&
38-
(typeof valueMutator === spec.type ||
39-
(_.isArray(valueMutator) && spec.type === SpecTypes.Array));
45+
(typeof valueMutator.value === spec.type ||
46+
(_.isArray(valueMutator.value) && spec.type === SpecTypes.Array) ||
47+
valueMutator.value === undefined);
4048

4149
export const updateParentStore = <
4250
DirtyValue extends FieldValue,
@@ -68,12 +76,12 @@ export const callUnmout = <
6876
export const getSpec = <SpecType extends Spec>({
6977
name,
7078
spec,
71-
mutators,
79+
mutatorsStore,
7280
}: GetSpecParams<SpecType>): SpecType => {
73-
const mutator = _.get(mutators.spec, name, EMPTY_MUTATOR);
81+
const mutator = _.get(mutatorsStore.spec, name, EMPTY_MUTATOR);
7482

7583
if (mutator !== EMPTY_MUTATOR) {
76-
const mutatedSpec = _.merge(_.cloneDeep(spec), mutator);
84+
const mutatedSpec = _.merge(_.cloneDeep(spec), mutator.value);
7785

7886
if (isCorrectSpec(mutatedSpec)) {
7987
return mutatedSpec;
@@ -196,15 +204,15 @@ export const getFieldInitials = <
196204
valueFromParent,
197205
initialValue,
198206
validate,
199-
mutators,
207+
mutatorsStore,
200208
}: GetFieldInitialsParams<DirtyValue, Value, SpecType>) => {
201-
const valueMutator = transformArrIn(_.get(mutators.values, name, EMPTY_MUTATOR)) as
202-
| DirtyValue
209+
const valueMutator = transformArrIn(_.get(mutatorsStore.values, name, EMPTY_MUTATOR)) as
210+
| {value: DirtyValue}
203211
| typeof EMPTY_MUTATOR;
204212
let value = _.cloneDeep(valueFromParent);
205213

206214
if (isValueMutatorCorrect(valueMutator, spec)) {
207-
value = valueMutator as DirtyValue;
215+
value = (valueMutator as {value: DirtyValue}).value;
208216
}
209217

210218
if (_.isNil(value)) {
@@ -222,13 +230,18 @@ export const getFieldInitials = <
222230
}
223231
}
224232

225-
let errorMutator: ValidateError = _.get(mutators.errors, name, EMPTY_MUTATOR);
233+
let errorMutator: {value: BaseValidateError} | typeof EMPTY_MUTATOR = _.get(
234+
mutatorsStore.errors,
235+
name,
236+
EMPTY_MUTATOR,
237+
);
226238

227239
if (!isErrorMutatorCorrect(errorMutator)) {
228-
errorMutator = undefined;
240+
errorMutator = {value: undefined};
229241
}
230242

231-
const error = validate?.(transformArrOut(value)) || errorMutator;
243+
const error =
244+
validate?.(transformArrOut(value)) || (errorMutator as {value: BaseValidateError})?.value;
232245
const dirty = !_.isEqual(value, initialValue);
233246

234247
return {
@@ -425,14 +438,14 @@ export const initializeStore = <
425438
>({
426439
name,
427440
spec: _spec,
428-
mutators,
441+
mutatorsStore,
429442
config,
430443
valueFromParent,
431444
tools,
432445
parentOnChange,
433446
parentOnUnmount,
434447
}: InitializeStoreParams<DirtyValue, SpecType>): ControllerStore<DirtyValue, Value, SpecType> => {
435-
const spec = getSpec({name, spec: _spec, mutators});
448+
const spec = getSpec({name, spec: _spec, mutatorsStore});
436449
const components = getComponents<DirtyValue, Value, SpecType>({spec, config});
437450
const render = getRender({name, spec, ...components});
438451
const validate = getValidate({spec, config});
@@ -441,7 +454,7 @@ export const initializeStore = <
441454
spec,
442455
valueFromParent,
443456
validate,
444-
mutators,
457+
mutatorsStore,
445458
initialValue: _.get(tools.initialValue, name),
446459
});
447460

@@ -451,7 +464,7 @@ export const initializeStore = <
451464
initialSpec: _spec,
452465
config,
453466
tools,
454-
mutators,
467+
mutatorsStore,
455468
render,
456469
validate,
457470
parentOnChange,
@@ -477,26 +490,26 @@ export const updateStore = <
477490
name,
478491
parentOnChange,
479492
parentOnUnmount,
480-
mutators,
493+
mutatorsStore,
481494
valueFromParent,
482495
config,
483496
tools,
484497
methodOnChange,
485498
}: UpdateStoreParams<DirtyValue, Value, SpecType>) => {
486-
const storeSpecMutator = _.get(store.mutators.spec, store.name, EMPTY_MUTATOR);
487-
const storeValueMutator = _.get(store.mutators.values, store.name, EMPTY_MUTATOR) as
488-
| DirtyValue
499+
const storeSpecMutator = _.get(store.mutatorsStore.spec, store.name, EMPTY_MUTATOR);
500+
const storeValueMutator = _.get(store.mutatorsStore.values, store.name, EMPTY_MUTATOR) as
501+
| {value: DirtyValue}
489502
| typeof EMPTY_MUTATOR;
490-
const storeErrorMutator = _.get(store.mutators.errors, store.name, EMPTY_MUTATOR);
503+
const storeErrorMutator = _.get(store.mutatorsStore.errors, store.name, EMPTY_MUTATOR);
491504

492-
const specMutator = _.get(mutators.spec, name, EMPTY_MUTATOR);
493-
const valueMutator = _.get(mutators.values, name, EMPTY_MUTATOR) as
494-
| DirtyValue
505+
const specMutator = _.get(mutatorsStore.spec, name, EMPTY_MUTATOR);
506+
const valueMutator = _.get(mutatorsStore.values, name, EMPTY_MUTATOR) as
507+
| {value: DirtyValue}
495508
| typeof EMPTY_MUTATOR;
496-
const errorMutator = _.get(mutators.errors, name, EMPTY_MUTATOR);
509+
const errorMutator = _.get(mutatorsStore.errors, name, EMPTY_MUTATOR);
497510

498511
const valueMutatorUpdated =
499-
isValueMutatorCorrect(valueMutator, getSpec({name, spec: _spec, mutators})) &&
512+
isValueMutatorCorrect(valueMutator, getSpec({name, spec: _spec, mutatorsStore})) &&
500513
valueMutator !== storeValueMutator;
501514
const errorMutatorUpdated =
502515
isErrorMutatorCorrect(errorMutator) && errorMutator !== storeErrorMutator;
@@ -519,7 +532,7 @@ export const updateStore = <
519532
initializeStore({
520533
name,
521534
spec: _spec,
522-
mutators,
535+
mutatorsStore,
523536
config,
524537
valueFromParent,
525538
tools,
@@ -532,7 +545,7 @@ export const updateStore = <
532545
...initializeStore({
533546
name,
534547
spec: _spec,
535-
mutators,
548+
mutatorsStore,
536549
config,
537550
valueFromParent,
538551
tools,
@@ -545,8 +558,10 @@ export const updateStore = <
545558
if (updateState) {
546559
nextStore = methodOnChange(nextStore, {
547560
valOrSetter: (value) =>
548-
valueMutatorUpdated ? (valueMutator as DirtyValue) : value,
549-
...(errorMutatorUpdated ? {errorMutator} : {}),
561+
valueMutatorUpdated ? (valueMutator as {value: DirtyValue}).value : value,
562+
...(errorMutatorUpdated
563+
? {errorMutator: (errorMutator as {value: BaseValidateError}).value}
564+
: {}),
550565
});
551566
}
552567

@@ -562,19 +577,26 @@ export const updateStore = <
562577
if (updateState) {
563578
nextStore = methodOnChange(nextStore, {
564579
valOrSetter: (value) =>
565-
valueMutatorUpdated ? (valueMutator as DirtyValue) : value,
566-
...(errorMutatorUpdated ? {errorMutator} : {}),
580+
valueMutatorUpdated ? (valueMutator as {value: DirtyValue}).value : value,
581+
...(errorMutatorUpdated
582+
? {errorMutator: (errorMutator as {value: BaseValidateError}).value}
583+
: {}),
567584
});
568585
}
569586

570587
setStore(nextStore);
571588
} else if (updateState) {
572589
setStore(
573-
methodOnChange(store, {
574-
valOrSetter: (value) =>
575-
valueMutatorUpdated ? (valueMutator as DirtyValue) : value,
576-
...(errorMutatorUpdated ? {errorMutator} : {}),
577-
}),
590+
methodOnChange(
591+
{...store, mutatorsStore},
592+
{
593+
valOrSetter: (value) =>
594+
valueMutatorUpdated ? (valueMutator as {value: DirtyValue}).value : value,
595+
...(errorMutatorUpdated
596+
? {errorMutator: (errorMutator as {value: BaseValidateError}).value}
597+
: {}),
598+
},
599+
),
578600
);
579601
}
580602
};

src/lib/core/components/Form/DynamicField.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export const DynamicField: React.FC<DynamicFieldProps> = ({
4747
const SearchContext = useCreateSearchContext();
4848
const {tools, store} = useStore(name);
4949
const watcher = useIntegrationFF(store, withoutInsertFFDebounce);
50-
const {mutators, mutateDFState} = useMutators(externalMutators);
50+
const {mutatorsStore, mutateDFState} = useMutators(externalMutators);
5151
const {store: searchStore, setField, removeField, isHiddenField} = useSearchStore();
5252

5353
const context = React.useMemo(
@@ -57,10 +57,10 @@ export const DynamicField: React.FC<DynamicFieldProps> = ({
5757
generateRandomValue,
5858
tools: {...tools, mutateDFState},
5959
store,
60-
mutators,
60+
mutatorsStore,
6161
__mirror,
6262
}),
63-
[tools, config, Monaco, __mirror, generateRandomValue, mutators, mutateDFState, store],
63+
[tools, config, Monaco, __mirror, generateRandomValue, mutatorsStore, mutateDFState, store],
6464
);
6565

6666
const searchContext = React.useMemo(

0 commit comments

Comments
 (0)