Updated chakra-ui theme to use new @rjsf/utils and @rjsf/validator #2917
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Removed the `index.d.ts` file since all the types are now exported in `@rjsf/utils`
- Updated `package*.json` to make changes consistent with pulling utils and validator-ajv6 libraries
- Removed `core-js-pure`, `json-schema-merge-allof`, `jsonpointer` and `react-is` from `dependencies` in favor of `@rjsf/utils`
- Moved `ajv` and `@types/json-schema` into the `devDependencies`
- Added `@rjsf/validator-ajv6`, `@types/lodash` and `tsdx`
- Also, removed all mentions of `index.d.ts`
- Converted `ErrorList` to typescript, pulling types from `@rjsf/utils`
- Converted `Form` to typescript
- Built `FormProps` and `FormState` props which are exported
- Pulled in all the types from `@rjsf/utils` functions
- Removed the `additionalMetaSchemas` and `customFormats` props in favor of the new, required `validator: ValidatorType` prop
- Updated `getStateFromProps()` to create a `SchemaUtilsType` object and put it into both the state and the registry as `schemaUtils`
- Switched to using the `schemaUtils.getValidator()` to access the `validateFormData()` and `toErrorList()` calls
- Switched to using `schemaUtils` to access `getDefaultFormState()`, `toIdSchema()`, `toPathSchema()` and `retrieveSchema()`
- Updated `ArrayField` to use the `@rjsf/utils` functions
- Also, switched to the `includes` function from `lodash`
- Pull the `schemaUtils` from the `registry` and used it for `getDefaultFormState()`, `isMultiSelect()`, `isFilesArray()`, `retrieveSchema()` and `toIdSchema()`
- Switched from `xxx.hadOwnProperty('y')` to `'y' in xxx` to remove an eslint warning
- Updated `BooleanField`, `NumberField`, `CheckboxWidget`, `DateTimeWidget`, `FileWidget`, `RangeWidget`, `SelectWidget` and `UpDownWidget` to pull utility functions from `@rjsf/utils`
- Updated `MultiSchemaField` to use the `@rjsf/utils` functions
- Pulled the `schemaUtils` from the `registry` and used it for `getDefaultFormState()` and `getMatchingOption()`
- Switched from `xxx.hadOwnProperty('y')` to `'y' in xxx` to remove an eslint warning
- Updated `ObjectField` to use the `@rjsf/utils` functions
- Pulled the `schemaUtils` from the `registry` and used it for `retrieveSchema()`
- Switched from `xxx.hadOwnProperty('y')` to `'y' in xxx` to remove an eslint warning
- Updated `SchemaField` to use the `@rjsf/utils` functions
- Pulled the `schemaUtils` from the `registry` and used it for `getDisplayLabel()`, `isSelect()`, `retrieveSchema()` and `toIdSchema()`
- Switched from `xxx.hadOwnProperty('y')` to `'y' in xxx` to remove an eslint warning
- Updated `StringField` to use the `@rjsf/utils` functions
- Pulled the `schemaUtils` from the `registry` and used it for `isSelect()`
- Updated `AltDateWidget` to use the `@rjsf/utils` functions
- Removed `prevState` from `componentDidUpdate()` because it is not used, removing lint error
- Updated `TextWidget` to add `bool` as a type for the value to avoid a React error that failed tests
- Converted `SubmitButton` to typescript, pulling types from `@rjsf/utils` and exporting it's props type
- Converted `getDefaultRegistry()` to typescript, pulling types from `@rjsf/utils`
- Changed the export to be `default`
- Temporarily needing to cast `fields` and `widgets` to the proper type until they are converted
- Converted `withTheme()` to typescript, pulling types from `@rjsf/utils` and the typescript `Form`
- Converted the `src/index.js` file to Typescript, exporting both the `Form` and its types along with `withTheme()`, `getDefaultRegistry()`
- Updated the `types.js` file to remove `definitions` and add in `schemaUtils` ffor the `registry` type.
- Deleted the `src/utils.js`, `src/validate.js` files since they have been replaced with `@rjsf/utils/` and `@rjsf/validator-ajv6`
- Removed the `utils_test.js` file entirely and only kept the `Form` integration part of the `validate_test.js`
- Updated the tests as follows to make things work with `@rjsf/utils` and `@rjsf/validator-ajv6`
- Updated `test_utils.js` to import the default `validator` from `@rjsf/validator-ajv6` and add it to the props for `createFormComponent()`
- Updated the `Form_test.js` to import the default `validator` and the `customizeValidator()` function and passed `validator` into props for `<Form>...</Form>`
- Updated the checking of `onChangeProp` to add `schemaValidationErrors`, `schemaValidationErrorSchema` and `schemaUtils` to the `calledWith()` check
- Updated the checking of `onError` to add `schemaValidationErrors`, `schemaValidationErrorSchema` to the match
- Deleted any tests that dealt with the now removed deprecated features
- Replaced tests the used the `customFormats` or `additionalMetaSchemas` props with a customized validator with those values set on it
- In one place, removed a piece of a test that was reverting the old props since they don't exist anymore
- Updated the `SchemaField_test.js` file to check the `registry` in the received props to have `schemaUtils` instead of `definitions`
- Fixed the import of `getDefaultRegistry()`
- Also removed the test related to `empty definitions` since that isn't in the registry anymore
- Updated the `StringField_test.js` to import the utility functions from `@rjsf/utils`
- Updated the `uiSchema_test.js` file to deal with the removal of deprecated `ui:widget: {component, options}` feature in `@rjsf/utils`
- Switched from `warn` to `error` for spying
- Removed the deprecated `ui:widget` configurations in the tests, moving the options into the `ui:options` block instead`
- Verified the proper error (instead of warning) is returned
- Switched `SubmitButton` to use `WidgetProps` - Removed `schemaUtils` as a param for `getDefaultRegistry()` - Set generic defaults on `WithThemeProps` - Fixed cast of `SubmitButton` in `Form`
…rocessSelectValue()` method in utils
- Updated `package*.json` to add `@rjsf/utils` and `@rjsf/validator` to dev and peer dependencies - Also, Removed a bunch of packages that were never used since the conversion to `tsdx` - Finally, bumped most of the dev dependencies that made sense to the latest version, except for those that cause breaking tests - Removed the `webpack.config.*.js` files since they are no longer needed since the conversion to `tsdx` - Updated all uses of non-schema utilities methods to `@rjsf/utils` and switched to using `registry.schemaUtils.XXX()` for those schema-based utilities - Updated the import of `getDefaultRegistry()` to be directly from `@rjsf/core` - Modified `SelectWidget` to use the new `processSelectValue()` function from `@rjsf/utils` - Updated the tests to import the `validator` from `@rjsf/validator` to pass to the `Form` - Also updated the snapshots via the `test:update` script to deal with the little differences from the conversion
- Updated `package*.json` to add `@rjsf/utils` to dev and peer dependencies and `@rjsf/validator-ajv6` to dev dependencies - Also, Removed a bunch of packages that were never used since the conversion to `tsdx` - Finally, bumped most of the dev dependencies that made sense to the latest version, except for those that cause breaking tests - Updated all uses of non-schema utilities methods to `@rjsf/utils` and switched to using `registry.schemaUtils.XXX()` for those schema-based utilities - Updated the import of `getDefaultRegistry()` to be directly from `@rjsf/core` - Updated components that used the `uiSchema['ui:xxx']` notation to get the `uiOptions` using `getUiOptions(uiSchema)` then doing `uiOptions.xxx` instead - Updated the use of `React.FC` with `React.ComponentType` in `AddButton` and `SubmitButton` - Updated `ArrayFieldTitleProps` and `ArrayFieldDescriptionProps` to make `title`, `required` and `description` optional in the `ArrayFieldTemplate.tsx` file - Also fixed the indentation of components - Updated `WrapIfAdditionalProps` to pick props from `FieldTemplateProps` joining it with `children` to fix type issues - Updated `Form` to use `React.ComponentType` - Modified `SelectWidget` to use the new `processSelectValue()` function from `@rjsf/utils` - Updated the tests to change to using `RJSFSchema` rather than `JSON7Schema` and import the `validator` from `@rjsf/validator` to pass to the `Form` - Also updated the snapshots via the `test:update` script to deal with the little differences from the conversion
- Updated `package*.json` to add `@rjsf/utils` to dev and peer dependencies and `@rjsf/validator-ajv6` to dev dependencies - Also, Removed a bunch of packages that were never used since the conversion to `tsdx` - Finally, bumped most of the dev dependencies that made sense to the latest version, except for those that cause breaking tests - Updated all uses of non-schema utilities methods to `@rjsf/utils` and switched to using `registry.schemaUtils.XXX()` for those schema-based utilities - Updated the import of `getDefaultRegistry()` to be directly from `@rjsf/core` - Updated components that used the `uiSchema['ui:xxx']` notation to get the `uiOptions` using `getUiOptions(uiSchema)` then doing `uiOptions.xxx` instead - Updated the use of `React.FC` with `React.ComponentType` in `AddButton` and `SubmitButton` - Updated `AltDateWidget` to extend the `AltDateStateType` object from the `DateObject` - Updated `ArrayFieldTitleProps` and `ArrayFieldDescriptionProps` to make `title`, `required` and `description` optional in the `ArrayFieldTemplate.tsx` file - Also fixed the indentation of components - Updated `WrapIfAdditionalProps` to pick props from `FieldTemplateProps` joining it with `children` to fix type issues - Updated `Form` to use `React.ComponentType` - Modified `SelectWidget` to use the new `processSelectValue()` function from `@rjsf/utils` - Updated `utils.js` to remove the custom `ThemeProps` in favor of the new `WithThemeProps` from `@rjsf/core` - Updated the tests to change to using `RJSFSchema` rather than `JSON7Schema` and import the `validator` from `@rjsf/validator` to pass to the `Form` - Also updated the snapshots via the `test:update` script to deal with the little differences from the conversion
8 tasks
|
Closing because these changes were merged as part of #2920 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Reasons for making this change
Partially fixes #2693 by updating the
chakra-uitheme to use the new@rjsf/utilsand@rjsf/validator-ajv6(for tests)package*.jsonto add@rjsf/utilsto dev and peer dependencies and@rjsf/validator-ajv6to dev dependenciestsdx@rjsf/utilsand switched to usingregistry.schemaUtils.XXX()for those schema-based utilitiesgetDefaultRegistry()to be directly from@rjsf/coreuiSchema['ui:xxx']notation to get theuiOptionsusinggetUiOptions(uiSchema)then doinguiOptions.xxxinsteadReact.FCwithReact.ComponentTypeinAddButtonandSubmitButtonArrayFieldTitlePropsandArrayFieldDescriptionPropsto maketitle,requiredanddescriptionoptional in theArrayFieldTemplate.tsxfileWrapIfAdditionalPropsto pick props fromFieldTemplatePropsjoining it withchildrento fix type issuesFormto useReact.ComponentTypeSelectWidgetto use the newprocessSelectValue()function from@rjsf/utilsutils.jsto remove the customThemePropsin favor of the newWithThemePropsfrom@rjsf/coreRJSFSchemarather thanJSON7Schemaand import thevalidatorfrom@rjsf/validatorto pass to theFormtest:updatescript to deal with the little differences from the conversionNOTE: This PR is stacked on top of the branch for #2916 so you only need to review the
chakra-uidirectory... This PR will not pass tests because not all of the themes have yet to be convertedChecklist
npm run test:updateto update snapshots, if needed.