-
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
DataViews: pass search
filter as global, unattached from fields
#55475
Conversation
Size Change: +43 B (0%) Total Size: 1.66 MB
ℹ️ View Unchanged
|
Flaky tests detected in 99ed653. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/6571642636
|
079900c
to
99ed653
Compare
@@ -200,6 +197,8 @@ export default function PagePages() { | |||
[ postStatuses, authors ] | |||
); | |||
|
|||
const filters = useMemo( () => [ { id: 'search', type: 'search' } ] ); |
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'm not sure we're expecting more global filters like that, do we? The only piece of info needed with the current architecture is the key to be used in the query, and I believe we can safely start with a TextFilter
outside of Filters
component(render in dataviews.js).
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'd prefer not to make it a special case, to be honest. This way, DataViews
is already future-proof for any other page/endpoint/etc.
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.
Though it is a special case, no? It's a global filter. How it could affect any other page etc..?
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.
My point is that I prefer to conceptualize it as a filter and do this:
<DataViews
filters={ filters }
/>
rather than making it a special case and do this:
<DataViews
search={search}
/>
The reason is this: what if a different page/endpoint has a global filter that is an enumeration
or any other type of filter?
The first approach is future-proof: it requires no changes in the future, it already supports any type of filter (search
, enumeration
, and whatever we add in the future). The second approach would require us to make changes in DataViews
API (new properties, etc.) even when it already supports those other filter types.
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.
No strong opinions here, but I still don't get it. We still add the filters
prop to the API and we're trying to support a use case that we don't have right now. The concept of having a text global filter in a list or in a collection in general is the most common one, by far I think. Maybe some others can chime in, but it's not something that important for now IMO. In my mind the prop would be something like globalFilter="$key"
.
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.
Maybe some others can chime in, but it's not something that important for now IMO. In my mind the prop would be something like globalFilter="$key".
What you are suggesting would be (note we still have to pass the label as well):
<DataViews
globalFilter={ {id: "key", label: "Label" } }
/>
And what this PR proposes is:
<DataViews
filters=[
{ id: "key", label: "Label", type: "type" }
]
/>
It's not that different :)
The only differences I see are:
Alternative | Existing | |
---|---|---|
Property name | globalFilter |
filters |
Property type | object | array of objects |
Shape of objects | Only id and label |
The same as field filters. |
I feel strongly about the shape of filters being identical between field filters and global filters: I don't think we should do anything differently.
If it helps unlock this review and merge the PR, I am open to use globalFilter
as name and use an object instead of an array. We could change that later if needed be.
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.
After thinking more about it, while I still believe the global filter is a special case and will be almost a text filter every time, passing filters array allows a consumer to have more custom filters(if they need to) that are outside the specifics of a field. Let's land this.
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.
Not related to this PR, but I notice |
Ah, good catch. I've noticed something else. Let me push a few changes. |
Fixed the label at 781446e The other thing I was looking at was a false alarm – everything is fine. |
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.
Thank you @oandregal!
@@ -228,6 +229,7 @@ export default function PagePages() { | |||
<DataViews | |||
paginationInfo={ paginationInfo } | |||
fields={ fields } | |||
filters={ filters } |
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 don't understand this prop? What is it for?
@@ -200,6 +197,10 @@ export default function PagePages() { | |||
[ postStatuses, authors ] | |||
); | |||
|
|||
const filters = useMemo( () => [ |
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.
To be honest, I'm not sure I'd consider "search" a filter at all. It may be its own thing.
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.
Part of #55083
Follow-up to #55270 (comment) and #55440 (comment)
What?
Extracts the
search
filter from the fields definition and pass it directly to the DataViews component.Why?
The
search
filter is a cross-field filter and doesn't benefit from any field information. It's clearer if we make that obvious by passing it directly to theDataViews
component. See the following conversations #55270 (comment) and #55440 (comment) as well.How?
Pass filters as a new property of the DataViews component. These filters and the ones bound to the fields are treated the same.
Testing Instructions
search
filter and verify that it works properly.