DataViewsPicker: Add With Modal storybook story #72913
Conversation
andrewserong
added
[Type] Enhancement
|
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. |
andrewserong
requested review from
aaronrobertshaw,
ramonjd,
talldan and
tellthemachines
|
In testing the modal pops up when opening the docs section as well as the modal section: http://localhost:50240/?path=/docs/dataviews-dataviewspicker--docs Edit: the docs page on trunk isn't showing any docs either, just the default view, so maybe it's an issue with how that page is set up: |
|
Flaky tests detected in 1f4f3a4. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/19023496198
|
Good catch! I think because I'd set the state to default to open, so wherever it's rendered that would happen, including the Docs view. It's a little safer to default to it being closed, I reckon, so I've updated the default state of the modal in: 545fd83 |
talldan
left a comment
talldan
left a comment
There was a problem hiding this comment.
LGTM with those latest fixes 🎉
|
LGTM too. I'll merge 👍🏻 |
|
Thanks for reviewing and merging, folks! |
What?
Part of #72336
This PR adds a With Modal storybook story for the DataViewsPicker component. It doesn't address any of the issues in #72336, but should hopefully make those issues easier to work on or debug.
Why?
With the media library modal experiment in place and more folks starting to use the DataViewsPicker for a variety of use cases, it should help development of the picker to add a storybook entry for its use within a modal. As other use cases are explored (e.g. in #71128), I expect there'll be more of a use to quickly check how the component is working within a modal.
How?
Modalcomponent and output the selected items outside of the modal, to demonstrate picking behaviourTesting Instructions
npm run storybook:devand then navigate to http://localhost:50240/?path=/story/dataviews-dataviewspicker--with-modal to try out the modalNote when testing that there might be issues with the DataViewsPicker itself (i.e. the footer isn't sticky). The purpose of this PR isn't to fix those issues (they're raised in #72336), but make them easier to spot and test.
That said, if you find issues with the story itself, please let me know!
Screenshots or screencast
2025-11-03.14.21.14.mp4