Zoom out: Invoke zoom out mode when opening the patterns tab, and move the code to do so to a shared hook #59775
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
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. |
|
Size Change: +3.97 kB (0%) Total Size: 1.72 MB
ℹ️ View Unchanged
|
draganescu
approved these changes
Mar 13, 2024
Co-authored-by: Andrei Draganescu <me@andreidraganescu.info>
richtabor
approved these changes
Mar 18, 2024
Why? The zoomed out editor is already public in global styles, what is wrong with trying it directly as it's here? |
draganescu
previously requested changes
Mar 19, 2024
It's much more front-and-center than the styles view, and it'd give us more time to "compile" the zoom out issues more cohesively. |
|
An alternative would be to engage zoom out when a pattern category is selected. It may feel a bit better having it engage with patterns you can add visible—rather than having to click a category before you add patterns anyhow. And it may also resolve @draganescu's comment. |
draganescu
dismissed
their stale review
moving the hook seems to have solved the probem in my testing
carstingaxion
pushed a commit
to carstingaxion/gutenberg
that referenced
this pull request
Mar 27, 2024
…e the code to do so to a shared hook (WordPress#59775) * Invoke zoomed out when using the patterns tab, and create a hook * Update packages/block-editor/README.md Co-authored-by: Andrei Draganescu <me@andreidraganescu.info> * update docs * enter zoom out on category select --------- Co-authored-by: Andrei Draganescu <me@andreidraganescu.info> Co-authored-by: Andrei Draganescu <andrei.draganescu@automattic.com>
ajlende
reviewed
Apr 3, 2024
| @@ -49,6 +50,10 @@ export function PatternCategoryPreviews( { | |||
| const [ patternSyncFilter, setPatternSyncFilter ] = useState( 'all' ); | |||
| const [ patternSourceFilter, setPatternSourceFilter ] = useState( 'all' ); | |||
|
|
|||
| // Move to zoom out mode when this component is mounted | |||
| // and back to the previous mode when unmounted. | |||
| useZoomOut(); | |||
There was a problem hiding this comment.
I'd much rather this not be a useEffect. If you refactor it to call the action in the same onClick (or whatever trigger is used) for switching to the pattern category previews would be better.
There was a problem hiding this comment.
yes I too dislike this hook 😁
ajlende
reviewed
Apr 9, 2024
Comment on lines
+1031
to
+1034
| ### useZoomOut | ||
|
|
||
| A hook used to set the editor mode to zoomed out mode, invoking the hook sets the mode. | ||
|
|
There was a problem hiding this comment.
This should have been exported as a privateAPI instead of being public.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
This invokes the zoom out mode when opening the patterns tab, and then restores the previous mode when the patterns tab is unmounted. Closes #44585.
Why?
When inserting patterns its useful to see more of your site.
How?
This already happens when opening the "browse styles" section of global styles. I moved this code to a hook that can be shared by both components.
Question
Should we use the same zoom out mode that is used for Global Styles, or a different one so that we can continue to iterate on zoom out mode without impacting production.
Testing Instructions
Screenshots or screencast
Mar-12-2024.10-29-16.mp4