Adding a filter from the column-header-menu should open the filter panel

[imrraaj]

What?

The fix shows the filter component when selected via column headers

Why?

Fixes #64612

How?

The initial state for isShowingFilter is set to true, so when the filter option is selected in column header the filter component renders just like when we select it using dropdown menu icon

gutenberg/packages/dataviews/src/components/dataviews/index.tsx

Lines 96 to 98 in 5e77997

	const [ isShowingFilter, setIsShowingFilter ] = useState< boolean >( () =>
	( filters || [] ).some( ( filter ) => filter.isPrimary )
	);

to

 const [ isShowingFilter, setIsShowingFilter ] = useState< boolean >( true );

Testing Instructions

1. Clone the repo
2. run npm install and npm run storybook:dev
3. go to dataview component and select categories column header
4. select the Add filter option
5. See the render filter component.

Screenshots or screencast

Before

Screen.Recording.2024-08-21.at.7.32.56.PM.mov

After

Screen.Recording.2024-08-21.at.7.30.31.PM.mov

[youknowriad]

Do we think that having two places to add filters is a good idea? Why can't we just remove the filters from the table headers (no other view outside table allows this inline filtering)

[jameskoster]

I think it's quite handy, as are the other actions in that menu (re-ordering, hiding).

Other actions like pinning (#64679) could be contained here in the future. Thinking about custom fields you might also be able to rename, or go and edit other field properties from this menu.

[github-actions]

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 props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @raj.patel@rtcamp.com.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Unlinked contributors: raj.patel@rtcamp.com.

Co-authored-by: jorgefilipecosta <jorgefilipecosta@git.wordpress.org>
Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
Co-authored-by: jameskoster <jameskoster@git.wordpress.org>
Co-authored-by: imrraaj <imrraaj@git.wordpress.org>
Co-authored-by: oandregal <oandregal@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[imrraaj]

Hey @jameskoster, Can you please review the PR?

[jameskoster]

@imrraaj this one needs a code review from someone like @youknowriad or @jorgefilipecosta.

[oandregal]

Interestingly, it works in the storybook (where DataViews is a standalone component), so I wonder if there's some edit-site code that is preventing this from working in the site editor:

Gravacao.do.ecra.2024-09-02.as.12.29.04.mov

[jorgefilipecosta]

This PR causes an unexpected change. On templates when we select a source like an author or a theme with want the filters to be hidden by default:

On this PR the filters become visible.

[jorgefilipecosta]

@jameskoster, would the change I described above be something we are ok with? Or is it something we want to avoid?

[jameskoster]

@jorgefilipecosta Ideally the bundled views all behave the same in this respect.

• In the Pages page filters are hidden entirely when browsing by status.
• In the Patterns page filters are hidden entirely when browsing by category.
• In the Templates page, filters are hidden by default but still accessible when browsing by author.

As we can see Templates are the odd one out. But this is an issue on trunk, so we don't necessarily have to fix it here. What do you think?