-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
DataForm: migrate order action modal and introduce form validation #63895
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
@@ -39,21 +38,31 @@ import { getItemTitle } from '../../dataviews/actions/utils'; | |||
const { PATTERN_TYPES, CreatePatternModalContents, useDuplicatePatternProps } = | |||
unlock( patternsPrivateApis ); | |||
|
|||
// TODO: this should be shared with other components (page-pages). | |||
// TODO: this should be shared with other components (see post-fields in edit-site). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
#63849 is an attempt to address this but it's still unclear how to do it.
import { normalizeFields } from './normalize-fields'; | ||
import type { Field, Form } from './types'; | ||
|
||
export function isItemValid< Item >( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This method just ports the existing logic into the new place, there's no behavioral changes.
In follow-up PRs we should discuss all the validation details iteratively: how a form declares the required fields (or is it the field itself?), etc. Those conversations shouldn't block this PR from landing.
Size Change: +86 B (0%) Total Size: 1.76 MB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I like two things here:
- Validation is opt-in.
- We're starting small.
Some things that could be a bit better or follow-ups:
- Formalize field types definitions.
- Potentially start having a storybook story per field type
- We need to thing about how to test these things properly.
- I think we should focus more on the "quick edit" forms rather than these small existing forms. (Bring value to the user)
- Error handling is not clear either at this point.
I believe we can ship this though as a first step but as follow-ups for now, I'd give more priority to quick edit and trying to replicate the "document inspector" in the quick edit panels.
const value = field.getValue( { item } ); | ||
|
||
// TODO: this implicitely means the value is required. | ||
if ( field.type === 'integer' && value === '' ) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think we need to formalize the field "types" better. I see us having a folder of field types and each field type would export a component to render the value, a component to render the control and a validation function. (Rather that having this logic within the global validation function)
bc4b99d
to
f9cdc89
Compare
This is fair, I'll give quick edit a push. Though having more than one use case is proving useful and has already raised many unanswered API questions: how to share field definition between edit-site and edit-post? is "required field" a form API or a field API?, etc. |
I've asked for design input at #63624 (comment) |
@youknowriad do you want this PR to do something else or do we ship and iterate? |
I'm ok shipping this 👍 I'll give it a final review. |
@@ -44,7 +44,7 @@ export type Operator = | |||
|
|||
export type ItemRecord = Record< string, unknown >; | |||
|
|||
export type FieldType = 'text'; | |||
export type FieldType = 'text' | 'integer'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I wonder if these should be 'text' | 'integer' or 'string' or 'number' to stay as close as possible to JSON schemas.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I went for integer because that's the type for menu_order
according to the REST API https://developer.wordpress.org/rest-api/reference/pages/ (in terms of validation it's also more fine-grained and different than number).
#63983 builds on this PR (type integer) to add support for "author" in the quick edit form. |
Part of #59745
What?
This PR migrates the "Change order" action modal to use DataForm. It also prepares the scaffold for form validation.
How?
DataForm
5dd8e8e.isItemValid( item, fields )
to centralize validation 16f9f08.Testing Instructions