From 48766b0d749e760bf4136cd70ba9bc7c14acb386 Mon Sep 17 00:00:00 2001 From: scruffian Date: Wed, 21 Feb 2024 15:59:07 +0100 Subject: [PATCH 1/6] Zoomed Out: Don't show blocks when inserting in zoomed out mode --- packages/block-editor/src/components/inserter/menu.js | 10 +++++++--- packages/block-editor/src/components/inserter/tabs.js | 3 ++- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index 6a38e52cbffba1..b2ba15edcdd624 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -66,10 +66,13 @@ function InserterMenu( insertionIndex: __experimentalInsertionIndex, shouldFocusBlock, } ); - const { showPatterns } = useSelect( + const { showBlocks, showPatterns } = useSelect( ( select ) => { - const { hasAllowedPatterns } = unlock( select( blockEditorStore ) ); + const { hasAllowedPatterns, __unstableGetEditorMode } = unlock( + select( blockEditorStore ) + ); return { + showBlocks: __unstableGetEditorMode() !== 'zoom-out', showPatterns: hasAllowedPatterns( destinationRootClientId ), }; }, @@ -248,13 +251,14 @@ function InserterMenu( __experimentalInsertionIndex={ __experimentalInsertionIndex } - showBlockDirectory + showBlockDirectory={ showBlocks } shouldFocusBlock={ shouldFocusBlock } /> ) } { showAsTabs && ( Date: Wed, 21 Feb 2024 16:09:58 +0100 Subject: [PATCH 2/6] Don't show blocks in the inserter when you search --- packages/block-editor/src/components/inserter/menu.js | 3 ++- .../block-editor/src/components/inserter/search-results.js | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index b2ba15edcdd624..fb1f4a2b1d879f 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -251,7 +251,8 @@ function InserterMenu( __experimentalInsertionIndex={ __experimentalInsertionIndex } - showBlockDirectory={ showBlocks } + showBlockDirectory + showBlocks={ showBlocks } shouldFocusBlock={ shouldFocusBlock } /> diff --git a/packages/block-editor/src/components/inserter/search-results.js b/packages/block-editor/src/components/inserter/search-results.js index edd99609ea916c..d213bdd1af227a 100644 --- a/packages/block-editor/src/components/inserter/search-results.js +++ b/packages/block-editor/src/components/inserter/search-results.js @@ -50,6 +50,7 @@ function InserterSearchResults( { shouldFocusBlock = true, prioritizePatterns, selectBlockOnInsert, + showBlocks = true, } ) { const debouncedSpeak = useDebounce( speak, 500 ); @@ -167,7 +168,7 @@ function InserterSearchResults( { const hasItems = filteredBlockTypes.length > 0 || filteredBlockPatterns.length > 0; - const blocksUI = !! filteredBlockTypes.length && ( + const blocksUI = showBlocks && !! filteredBlockTypes.length && ( { __( 'Blocks' ) } } > From 0e5730803921c739859a8a0b3f08f54fb9758abc Mon Sep 17 00:00:00 2001 From: priethor <27339341+priethor@users.noreply.github.com> Date: Wed, 21 Feb 2024 16:51:22 +0100 Subject: [PATCH 3/6] Hide media tab when blocks should also be hidden --- packages/block-editor/src/components/inserter/menu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index fb1f4a2b1d879f..7542c9072dd94b 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -80,7 +80,7 @@ function InserterMenu( ); const mediaCategories = useMediaCategories( destinationRootClientId ); - const showMedia = mediaCategories.length > 0; + const showMedia = mediaCategories.length > 0 && showBlocks; const onInsert = useCallback( ( blocks, meta, shouldForceFocusBlock ) => { From e47211842b25917344d665c87ee1a530d49b2970 Mon Sep 17 00:00:00 2001 From: scruffian Date: Wed, 21 Feb 2024 17:47:39 +0100 Subject: [PATCH 4/6] Refactor showBlocks to isZoomOutMode --- packages/block-editor/src/components/inserter/menu.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index 7542c9072dd94b..cee6137d6c3f49 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -66,13 +66,13 @@ function InserterMenu( insertionIndex: __experimentalInsertionIndex, shouldFocusBlock, } ); - const { showBlocks, showPatterns } = useSelect( + const { isZoomOutMode, showPatterns } = useSelect( ( select ) => { const { hasAllowedPatterns, __unstableGetEditorMode } = unlock( select( blockEditorStore ) ); return { - showBlocks: __unstableGetEditorMode() !== 'zoom-out', + isZoomOutMode: __unstableGetEditorMode() === 'zoom-out', showPatterns: hasAllowedPatterns( destinationRootClientId ), }; }, @@ -80,7 +80,7 @@ function InserterMenu( ); const mediaCategories = useMediaCategories( destinationRootClientId ); - const showMedia = mediaCategories.length > 0 && showBlocks; + const showMedia = mediaCategories.length > 0 && ! isZoomOutMode; const onInsert = useCallback( ( blocks, meta, shouldForceFocusBlock ) => { @@ -252,14 +252,14 @@ function InserterMenu( __experimentalInsertionIndex } showBlockDirectory - showBlocks={ showBlocks } + showBlocks={ ! isZoomOutMode } shouldFocusBlock={ shouldFocusBlock } /> ) } { showAsTabs && ( Date: Wed, 21 Feb 2024 18:01:50 +0100 Subject: [PATCH 5/6] Also don't show the blocks tab when in zoomed out mode --- packages/block-editor/src/components/inserter/menu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index cee6137d6c3f49..43a4db33223ae6 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -266,7 +266,7 @@ function InserterMenu( tabsContents={ inserterTabsContents } /> ) } - { ! delayedFilterValue && ! showAsTabs && ( + { ! delayedFilterValue && ! showAsTabs && ! isZoomOutMode && (
{ blocksTab }
From 25121d0c312a39839df64b5887d106b80bdd584e Mon Sep 17 00:00:00 2001 From: scruffian Date: Sat, 24 Feb 2024 14:51:07 +0100 Subject: [PATCH 6/6] rename const to showBlocks --- packages/block-editor/src/components/inserter/menu.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index 43a4db33223ae6..f0256d0d35d8ff 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -81,6 +81,7 @@ function InserterMenu( const mediaCategories = useMediaCategories( destinationRootClientId ); const showMedia = mediaCategories.length > 0 && ! isZoomOutMode; + const showBlocks = ! isZoomOutMode; const onInsert = useCallback( ( blocks, meta, shouldForceFocusBlock ) => { @@ -252,21 +253,21 @@ function InserterMenu( __experimentalInsertionIndex } showBlockDirectory - showBlocks={ ! isZoomOutMode } + showBlocks={ showBlocks } shouldFocusBlock={ shouldFocusBlock } /> ) } { showAsTabs && ( ) } - { ! delayedFilterValue && ! showAsTabs && ! isZoomOutMode && ( + { ! delayedFilterValue && ! showAsTabs && showBlocks && (
{ blocksTab }