Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Introduce Form Groups #5752

Merged
merged 17 commits into from
Jan 18, 2021
Merged

Introduce Form Groups #5752

merged 17 commits into from
Jan 18, 2021

Conversation

djhi
Copy link
Collaborator

@djhi djhi commented Jan 8, 2021

Introducing form groups will allow us to remove the restrictions on the FormTab content which could accept any components and not just inputs while still tracking whether any of their inputs are invalid.

  • Base implementation
  • Cleanup
  • Tests
  • Documentation

@djhi djhi added the WIP Work In Progress label Jan 8, 2021
@djhi djhi added this to the 3.12 milestone Jan 8, 2021
@djhi djhi added RFR Ready For Review and removed WIP Work In Progress labels Jan 12, 2021
Copy link
Member

@fzaninotto fzaninotto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work! The error detection code in the tab component is much more readable.

I have the general feeling that this could be more unit tested.

docs/CreateEdit.md Outdated Show resolved Hide resolved
examples/simple/src/posts/PostEdit.js Show resolved Hide resolved
packages/ra-core/src/form/FormContextProvider.tsx Outdated Show resolved Hide resolved
packages/ra-core/src/form/FormGroupContext.ts Show resolved Hide resolved
const newState = Array.from(fields).reduce<FormGroupState>(
(acc, field) => {
const fieldState = form.getFieldState(field);
let errors = acc.errors;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let errors = acc.errors || []; and remove line 40 to 42

packages/ra-core/src/form/useInput.ts Outdated Show resolved Hide resolved
@@ -44,7 +53,9 @@ describe('<SaveButton />', () => {
<TestContext>
<ThemeProvider theme={theme}>
<SaveContextProvider value={saveContextValue}>
<SaveButton {...invalidButtonDomProps} />
<FormContextProvider value={formContextValue}>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't understand why this is now required and it worries me (that it's now required). this will be a gotcha for users.

Copy link
Collaborator Author

@djhi djhi Jan 15, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I actually don't get how those tests could have pass before. Indeed, the SaveButton has always been retrieving the setOnSave function from the FormContext and should have failed

errors[field] = fieldState.error;
}

const newState = {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please add a unit test for that logic

export const findTabsWithErrors = (children, errors) => {
// TODO: Provide documentation link
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

todo

Copy link
Member

@fzaninotto fzaninotto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Almost there!

djhi and others added 2 commits January 18, 2021 10:01
@fzaninotto fzaninotto merged commit f93b89d into next Jan 18, 2021
@fzaninotto fzaninotto deleted the input-registration-context branch January 18, 2021 12:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
RFR Ready For Review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants