Skip to content

Commit 274a0a5

Browse files
use fast-deep-equal
1 parent 9018ef1 commit 274a0a5

File tree

11 files changed

+91
-106
lines changed

11 files changed

+91
-106
lines changed

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,5 +79,6 @@
7979
"packages/validator-ajv6",
8080
"packages/validator-ajv8",
8181
"packages/snapshot-tests"
82-
]
82+
],
83+
"packageManager": "[email protected]+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
8384
}

packages/core/src/components/Form.tsx

Lines changed: 36 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import { Component, ElementType, FormEvent, ReactNode, Ref, RefObject, createRef } from 'react';
1+
import { Component, createRef, ElementType, FormEvent, ReactNode, Ref, RefObject } from 'react';
22
import {
33
createSchemaUtils,
44
CustomValidator,
55
deepEquals,
66
ErrorSchema,
77
ErrorTransformer,
8+
Experimental_DefaultFormStateBehavior,
89
FormContextType,
910
GenericObjectType,
1011
getTemplate,
@@ -14,31 +15,31 @@ import {
1415
mergeObjects,
1516
NAME_KEY,
1617
PathSchema,
17-
StrictRJSFSchema,
1818
Registry,
1919
RegistryFieldsType,
2020
RegistryWidgetsType,
21+
RJSF_ADDITIONAL_PROPERTIES_FLAG,
2122
RJSFSchema,
2223
RJSFValidationError,
23-
RJSF_ADDITIONAL_PROPERTIES_FLAG,
2424
SchemaUtilsType,
2525
shouldRender,
26+
StrictRJSFSchema,
2627
SUBMIT_BTN_OPTIONS_KEY,
2728
TemplatesType,
2829
toErrorList,
29-
UiSchema,
3030
UI_GLOBAL_OPTIONS_KEY,
3131
UI_OPTIONS_KEY,
32+
UiSchema,
3233
ValidationData,
3334
validationDataMerge,
3435
ValidatorType,
35-
Experimental_DefaultFormStateBehavior,
3636
} from '@rjsf/utils';
3737
import _forEach from 'lodash/forEach';
3838
import _get from 'lodash/get';
3939
import _isEmpty from 'lodash/isEmpty';
4040
import _pick from 'lodash/pick';
4141
import _toPath from 'lodash/toPath';
42+
import fastDeepEqual from 'fast-deep-equal';
4243

4344
import getDefaultRegistry from '../getDefaultRegistry';
4445

@@ -282,7 +283,7 @@ export default class Form<
282283
}
283284

284285
this.state = this.getStateFromProps(props, props.formData);
285-
if (this.props.onChange && !deepEquals(this.state.formData, this.props.formData)) {
286+
if (this.props.onChange && !fastDeepEqual(this.state.formData, this.props.formData)) {
286287
this.props.onChange(this.state);
287288
}
288289
this.formElement = createRef();
@@ -309,10 +310,14 @@ export default class Form<
309310
getSnapshotBeforeUpdate(
310311
prevProps: FormProps<T, S, F>,
311312
prevState: FormState<T, S, F>
312-
): { nextState: FormState<T, S, F>; shouldUpdate: true } | { shouldUpdate: false } {
313+
):
314+
| { nextState: FormState<T, S, F>; shouldUpdate: true }
315+
| {
316+
shouldUpdate: false;
317+
} {
313318
if (!deepEquals(this.props, prevProps)) {
314-
const isSchemaChanged = !deepEquals(prevProps.schema, this.props.schema);
315-
const isFormDataChanged = !deepEquals(prevProps.formData, this.props.formData);
319+
const isSchemaChanged = !fastDeepEqual(prevProps.schema, this.props.schema);
320+
const isFormDataChanged = !fastDeepEqual(prevProps.formData, this.props.formData);
316321
const nextState = this.getStateFromProps(
317322
this.props,
318323
this.props.formData,
@@ -346,14 +351,18 @@ export default class Form<
346351
componentDidUpdate(
347352
_: FormProps<T, S, F>,
348353
prevState: FormState<T, S, F>,
349-
snapshot: { nextState: FormState<T, S, F>; shouldUpdate: true } | { shouldUpdate: false }
354+
snapshot:
355+
| { nextState: FormState<T, S, F>; shouldUpdate: true }
356+
| {
357+
shouldUpdate: false;
358+
}
350359
) {
351360
if (snapshot.shouldUpdate) {
352361
const { nextState } = snapshot;
353362

354363
if (
355-
!deepEquals(nextState.formData, this.props.formData) &&
356-
!deepEquals(nextState.formData, prevState.formData) &&
364+
!fastDeepEqual(nextState.formData, this.props.formData) &&
365+
!fastDeepEqual(nextState.formData, prevState.formData) &&
357366
this.props.onChange
358367
) {
359368
this.props.onChange(nextState);
@@ -692,7 +701,6 @@ export default class Form<
692701
* Callback function to handle reset form data.
693702
* - Reset all fields with default values.
694703
* - Reset validations and errors
695-
*
696704
*/
697705
reset = () => {
698706
const { onChange } = this.props;
@@ -772,7 +780,14 @@ export default class Form<
772780
},
773781
() => {
774782
if (onSubmit) {
775-
onSubmit({ ...this.state, formData: newFormData, status: 'submitted' }, event);
783+
onSubmit(
784+
{
785+
...this.state,
786+
formData: newFormData,
787+
status: 'submitted',
788+
},
789+
event
790+
);
776791
}
777792
}
778793
);
@@ -956,9 +971,14 @@ export default class Form<
956971

957972
let { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions = {} } = getUiOptions<T, S, F>(uiSchema);
958973
if (disabled) {
959-
submitOptions = { ...submitOptions, props: { ...submitOptions.props, disabled: true } };
974+
submitOptions = {
975+
...submitOptions,
976+
props: { ...submitOptions.props, disabled: true },
977+
};
960978
}
961-
const submitUiSchema = { [UI_OPTIONS_KEY]: { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions } };
979+
const submitUiSchema = {
980+
[UI_OPTIONS_KEY]: { [SUBMIT_BTN_OPTIONS_KEY]: submitOptions },
981+
};
962982

963983
return (
964984
<FormTag

packages/core/src/components/fields/MultiSchemaField.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import isEmpty from 'lodash/isEmpty';
44
import omit from 'lodash/omit';
55
import {
66
ANY_OF_KEY,
7-
deepEquals,
87
ERRORS_KEY,
98
FieldProps,
109
FormContextType,
@@ -18,6 +17,7 @@ import {
1817
TranslatableString,
1918
UiSchema,
2019
} from '@rjsf/utils';
20+
import fastDeepEqual from 'fast-deep-equal';
2121

2222
/** Type used for the state of the `AnyOfField` component */
2323
type AnyOfFieldState<S extends StrictRJSFSchema = RJSFSchema> = {
@@ -67,15 +67,15 @@ class AnyOfField<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends For
6767
const { formData, options, idSchema } = this.props;
6868
const { selectedOption } = this.state;
6969
let newState = this.state;
70-
if (!deepEquals(prevProps.options, options)) {
70+
if (!fastDeepEqual(prevProps.options, options)) {
7171
const {
7272
registry: { schemaUtils },
7373
} = this.props;
7474
// re-cache the retrieved options in state in case they have $refs to save doing it later
7575
const retrievedOptions = options.map((opt: S) => schemaUtils.retrieveSchema(opt, formData));
7676
newState = { selectedOption, retrievedOptions };
7777
}
78-
if (!deepEquals(formData, prevProps.formData) && idSchema.$id === prevProps.idSchema.$id) {
78+
if (!fastDeepEqual(formData, prevProps.formData) && idSchema.$id === prevProps.idSchema.$id) {
7979
const { retrievedOptions } = newState;
8080
const matchingOption = this.getMatchingOption(selectedOption, formData, retrievedOptions);
8181

packages/utils/src/enumOptionsDeselectValue.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import isEqual from 'lodash/isEqual';
1+
import fastDeepEqual from 'fast-deep-equal';
22

33
import { EnumOptionsType, RJSFSchema, StrictRJSFSchema } from './types';
44
import enumOptionsValueForIndex from './enumOptionsValueForIndex';
@@ -22,7 +22,7 @@ export default function enumOptionsDeselectValue<S extends StrictRJSFSchema = RJ
2222
): EnumOptionsType<S>['value'] | EnumOptionsType<S>['value'][] | undefined {
2323
const value = enumOptionsValueForIndex<S>(valueIndex, allEnumOptions);
2424
if (Array.isArray(selected)) {
25-
return selected.filter((v) => !isEqual(v, value));
25+
return selected.filter((v) => !fastDeepEqual(v, value));
2626
}
27-
return isEqual(value, selected) ? undefined : selected;
27+
return fastDeepEqual(value, selected) ? undefined : selected;
2828
}

packages/utils/src/enumOptionsIsSelected.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import isEqual from 'lodash/isEqual';
1+
import fastDeepEqual from 'fast-deep-equal';
22

33
import { EnumOptionsType, RJSFSchema, StrictRJSFSchema } from './types';
44

@@ -13,7 +13,7 @@ export default function enumOptionsIsSelected<S extends StrictRJSFSchema = RJSFS
1313
selected: EnumOptionsType<S>['value'] | EnumOptionsType<S>['value'][]
1414
) {
1515
if (Array.isArray(selected)) {
16-
return selected.some((sel) => isEqual(sel, value));
16+
return selected.some((sel) => fastDeepEqual(sel, value));
1717
}
18-
return isEqual(selected, value);
18+
return fastDeepEqual(selected, value);
1919
}

packages/utils/src/parser/ParserValidator.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import get from 'lodash/get';
2-
import isEqual from 'lodash/isEqual';
2+
import fastDeepEqual from 'fast-deep-equal';
33

44
import { ID_KEY } from '../constants';
55
import hashForSchema from '../hashForSchema';
@@ -67,7 +67,7 @@ export default class ParserValidator<T = any, S extends StrictRJSFSchema = RJSFS
6767
const existing = this.schemaMap[key];
6868
if (!existing) {
6969
this.schemaMap[key] = identifiedSchema;
70-
} else if (!isEqual(existing, identifiedSchema)) {
70+
} else if (!fastDeepEqual(existing, identifiedSchema)) {
7171
console.error('existing schema:', JSON.stringify(existing, null, 2));
7272
console.error('new schema:', JSON.stringify(identifiedSchema, null, 2));
7373
throw new Error(
@@ -91,7 +91,7 @@ export default class ParserValidator<T = any, S extends StrictRJSFSchema = RJSFS
9191
* @throws - Error when the given `rootSchema` differs from the root schema provided during construction
9292
*/
9393
isValid(schema: S, _formData: T, rootSchema: S): boolean {
94-
if (!isEqual(rootSchema, this.rootSchema)) {
94+
if (!fastDeepEqual(rootSchema, this.rootSchema)) {
9595
throw new Error('Unexpectedly calling isValid() with a rootSchema that differs from the construction rootSchema');
9696
}
9797
this.addSchema(schema, hashForSchema<S>(schema));

packages/utils/src/parser/schemaParser.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import forEach from 'lodash/forEach';
2-
import isEqual from 'lodash/isEqual';
2+
import fastDeepEqual from 'fast-deep-equal';
33

44
import { FormContextType, RJSFSchema, StrictRJSFSchema } from '../types';
5-
import { PROPERTIES_KEY, ITEMS_KEY } from '../constants';
5+
import { ITEMS_KEY, PROPERTIES_KEY } from '../constants';
66
import ParserValidator, { SchemaMap } from './ParserValidator';
7-
import { retrieveSchemaInternal, resolveAnyOrOneOfSchemas } from '../schema/retrieveSchema';
7+
import { resolveAnyOrOneOfSchemas, retrieveSchemaInternal } from '../schema/retrieveSchema';
88

99
/** Recursive function used to parse the given `schema` belonging to the `rootSchema`. The `validator` is used to
1010
* capture the sub-schemas that the `isValid()` function is called with. For each schema returned by the
@@ -24,7 +24,7 @@ function parseSchema<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends
2424
) {
2525
const schemas = retrieveSchemaInternal<T, S, F>(validator, schema, rootSchema, undefined, true);
2626
schemas.forEach((schema) => {
27-
const sameSchemaIndex = recurseList.findIndex((item) => isEqual(item, schema));
27+
const sameSchemaIndex = recurseList.findIndex((item) => fastDeepEqual(item, schema));
2828
if (sameSchemaIndex === -1) {
2929
recurseList.push(schema);
3030
const allOptions = resolveAnyOrOneOfSchemas<T, S, F>(validator, schema, rootSchema, true);

packages/utils/src/schema/retrieveSchema.ts

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import get from 'lodash/get';
2-
import isEqual from 'lodash/isEqual';
2+
import fastDeepEqual from 'fast-deep-equal';
33
import set from 'lodash/set';
44
import times from 'lodash/times';
55
import transform from 'lodash/transform';
@@ -15,10 +15,10 @@ import {
1515
ANY_OF_KEY,
1616
DEPENDENCIES_KEY,
1717
IF_KEY,
18+
ITEMS_KEY,
1819
ONE_OF_KEY,
19-
REF_KEY,
2020
PROPERTIES_KEY,
21-
ITEMS_KEY,
21+
REF_KEY,
2222
} from '../constants';
2323
import findSchemaDefinition, { splitKeyElementFromObject } from '../findSchemaDefinition';
2424
import getDiscriminatorFieldFromSchema from '../getDiscriminatorFieldFromSchema';
@@ -196,7 +196,10 @@ export function resolveSchema<T = any, S extends StrictRJSFSchema = RJSFSchema,
196196
)
197197
);
198198
const allPermutations = getAllPermutationsOfXxxOf<S>(allOfSchemaElements);
199-
return allPermutations.map((permutation) => ({ ...schema, allOf: permutation }));
199+
return allPermutations.map((permutation) => ({
200+
...schema,
201+
allOf: permutation,
202+
}));
200203
}
201204
// No $ref or dependencies or allOf attribute was found, returning the original schema.
202205
return [schema];
@@ -293,7 +296,7 @@ export function resolveAllReferences<S extends StrictRJSFSchema = RJSFSchema>(
293296
};
294297
}
295298

296-
return isEqual(schema, resolvedSchema) ? schema : resolvedSchema;
299+
return fastDeepEqual(schema, resolvedSchema) ? schema : resolvedSchema;
297300
}
298301

299302
/** Creates new 'properties' items for each key in the `formData`

packages/utils/src/schema/toIdSchema.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import get from 'lodash/get';
2-
import isEqual from 'lodash/isEqual';
2+
import fastDeepEqual from 'fast-deep-equal';
33

44
import { ALL_OF_KEY, DEPENDENCIES_KEY, ID_KEY, ITEMS_KEY, PROPERTIES_KEY, REF_KEY } from '../constants';
55
import isObject from '../isObject';
@@ -46,7 +46,7 @@ function toIdSchemaInternal<T = any, S extends StrictRJSFSchema = RJSFSchema, F
4646
const { validator, schema, rootSchema, _recurseList, formData, idPrefix, idSeparator, id, idSchema } = stack.pop()!;
4747
if (REF_KEY in schema || DEPENDENCIES_KEY in schema || ALL_OF_KEY in schema) {
4848
const _schema = retrieveSchema<T, S, F>(validator, schema, rootSchema, formData);
49-
const sameSchemaIndex = _recurseList.findIndex((item) => isEqual(item, _schema));
49+
const sameSchemaIndex = _recurseList.findIndex((item) => fastDeepEqual(item, _schema));
5050
if (sameSchemaIndex === -1) {
5151
stack.push({
5252
validator,
@@ -112,7 +112,7 @@ function toIdSchemaInternal<T = any, S extends StrictRJSFSchema = RJSFSchema, F
112112
// formData,
113113
// );
114114
// const sameSchemaIndex = _recurseList.findIndex((item) =>
115-
// isEqual(item, _schema)
115+
// fastDeepEqual(item, _schema)
116116
// );
117117
// if (sameSchemaIndex === -1) {
118118
// return toIdSchemaInternal<T, S, F>(

0 commit comments

Comments
 (0)