From 446c291198e9d0cd68ef1d3af30c9c186ee647fd Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Mon, 29 Jul 2024 09:21:25 +0100 Subject: [PATCH 1/5] Clear the insertion point when selecting a different block or clearing block selection --- packages/block-editor/src/store/reducer.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index cd4569c45e5801..91d853a50a6a42 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -1624,6 +1624,8 @@ export function insertionPoint( state = null, action ) { } case 'HIDE_INSERTION_POINT': + case 'CLEAR_SELECTED_BLOCK': + case 'SELECT_BLOCK': return null; } From d1488acc64140a0a7487f1d9895908236e5a570e Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Mon, 29 Jul 2024 10:53:01 +0100 Subject: [PATCH 2/5] Use the block insertion point in the inserter, not the the one from the editor package --- packages/block-editor/src/store/reducer.js | 2 +- .../src/components/inserter-sidebar/index.js | 20 ++++++++++--------- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index 91d853a50a6a42..13d5a872281ea7 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -1624,8 +1624,8 @@ export function insertionPoint( state = null, action ) { } case 'HIDE_INSERTION_POINT': - case 'CLEAR_SELECTED_BLOCK': case 'SELECT_BLOCK': + case 'CLEAR_SELECTED_BLOCK': return null; } diff --git a/packages/editor/src/components/inserter-sidebar/index.js b/packages/editor/src/components/inserter-sidebar/index.js index 675ae5e11544bc..a17794697783be 100644 --- a/packages/editor/src/components/inserter-sidebar/index.js +++ b/packages/editor/src/components/inserter-sidebar/index.js @@ -24,13 +24,13 @@ export default function InserterSidebar() { const { blockSectionRootClientId, inserterSidebarToggleRef, - insertionPoint, + blockInsertionPoint, showMostUsedBlocks, sidebarIsOpened, } = useSelect( ( select ) => { const { getInserterSidebarToggleRef, - getInsertionPoint, + getBlockInsertionPoint, isPublishSidebarOpened, } = unlock( select( editorStore ) ); const { getBlockRootClientId, __unstableGetEditorMode, getSettings } = @@ -48,7 +48,7 @@ export default function InserterSidebar() { }; return { inserterSidebarToggleRef: getInserterSidebarToggleRef(), - insertionPoint: getInsertionPoint(), + blockInsertionPoint: getBlockInsertionPoint(), showMostUsedBlocks: get( 'core', 'mostUsedBlocks' ), blockSectionRootClientId: getBlockSectionRootClientId(), sidebarIsOpened: !! ( @@ -85,13 +85,15 @@ export default function InserterSidebar() { showInserterHelpPanel shouldFocusBlock={ isMobileViewport } rootClientId={ - blockSectionRootClientId ?? insertionPoint.rootClientId + blockSectionRootClientId ?? blockInsertionPoint.rootClientId } - __experimentalInsertionIndex={ insertionPoint.insertionIndex } - onSelect={ insertionPoint.onSelect } - __experimentalInitialTab={ insertionPoint.tab } - __experimentalInitialCategory={ insertionPoint.category } - __experimentalFilterValue={ insertionPoint.filterValue } + __experimentalInsertionIndex={ + blockInsertionPoint.insertionIndex + } + onSelect={ blockInsertionPoint.onSelect } + __experimentalInitialTab={ blockInsertionPoint.tab } + __experimentalInitialCategory={ blockInsertionPoint.category } + __experimentalFilterValue={ blockInsertionPoint.filterValue } onPatternCategorySelection={ sidebarIsOpened ? () => disableComplementaryArea( 'core' ) From 46e51ac683ae053391bd37b617c3da9f1143c1b3 Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Mon, 29 Jul 2024 11:39:07 +0100 Subject: [PATCH 3/5] use block insertion point index --- .../src/components/inserter-sidebar/index.js | 21 ++++++++++--------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/packages/editor/src/components/inserter-sidebar/index.js b/packages/editor/src/components/inserter-sidebar/index.js index a17794697783be..f9378f11e0e3fc 100644 --- a/packages/editor/src/components/inserter-sidebar/index.js +++ b/packages/editor/src/components/inserter-sidebar/index.js @@ -22,15 +22,17 @@ const { PrivateInserterLibrary } = unlock( blockEditorPrivateApis ); export default function InserterSidebar() { const { + blockInsertionPoint, blockSectionRootClientId, inserterSidebarToggleRef, - blockInsertionPoint, + insertionPoint, showMostUsedBlocks, sidebarIsOpened, } = useSelect( ( select ) => { const { - getInserterSidebarToggleRef, getBlockInsertionPoint, + getInserterSidebarToggleRef, + getInsertionPoint, isPublishSidebarOpened, } = unlock( select( editorStore ) ); const { getBlockRootClientId, __unstableGetEditorMode, getSettings } = @@ -47,8 +49,9 @@ export default function InserterSidebar() { return getBlockRootClientId(); }; return { - inserterSidebarToggleRef: getInserterSidebarToggleRef(), blockInsertionPoint: getBlockInsertionPoint(), + inserterSidebarToggleRef: getInserterSidebarToggleRef(), + insertionPoint: getInsertionPoint(), showMostUsedBlocks: get( 'core', 'mostUsedBlocks' ), blockSectionRootClientId: getBlockSectionRootClientId(), sidebarIsOpened: !! ( @@ -87,13 +90,11 @@ export default function InserterSidebar() { rootClientId={ blockSectionRootClientId ?? blockInsertionPoint.rootClientId } - __experimentalInsertionIndex={ - blockInsertionPoint.insertionIndex - } - onSelect={ blockInsertionPoint.onSelect } - __experimentalInitialTab={ blockInsertionPoint.tab } - __experimentalInitialCategory={ blockInsertionPoint.category } - __experimentalFilterValue={ blockInsertionPoint.filterValue } + __experimentalInsertionIndex={ blockInsertionPoint.index } + onSelect={ insertionPoint.onSelect } + __experimentalInitialTab={ insertionPoint.tab } + __experimentalInitialCategory={ insertionPoint.category } + __experimentalFilterValue={ insertionPoint.filterValue } onPatternCategorySelection={ sidebarIsOpened ? () => disableComplementaryArea( 'core' ) From 71ad64b3366d9fab7aaafcfc63c901ecd434bc33 Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Mon, 5 Aug 2024 17:09:36 +0100 Subject: [PATCH 4/5] Don't change the insertion point when clearing block selection --- packages/block-editor/src/store/reducer.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index 13d5a872281ea7..93f88c5e0f30b5 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -1625,7 +1625,6 @@ export function insertionPoint( state = null, action ) { case 'HIDE_INSERTION_POINT': case 'SELECT_BLOCK': - case 'CLEAR_SELECTED_BLOCK': return null; } From dea7012c78484de66f76a4c30560ac09424d251f Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Fri, 9 Aug 2024 11:26:36 +0100 Subject: [PATCH 5/5] Also set the insertion point in the quick inserter --- .../src/components/inserter/quick-inserter.js | 5 ++++- packages/block-editor/src/store/reducer.js | 1 + packages/editor/src/components/inserter-sidebar/index.js | 9 ++++++--- 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/packages/block-editor/src/components/inserter/quick-inserter.js b/packages/block-editor/src/components/inserter/quick-inserter.js index aa3d54e87a7fd1..f4c52c04d20c4b 100644 --- a/packages/block-editor/src/components/inserter/quick-inserter.js +++ b/packages/block-editor/src/components/inserter/quick-inserter.js @@ -9,7 +9,7 @@ import clsx from 'clsx'; import { useState, useEffect } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { Button, SearchControl } from '@wordpress/components'; -import { useSelect } from '@wordpress/data'; +import { useDispatch, useSelect } from '@wordpress/data'; /** * Internal dependencies @@ -82,6 +82,8 @@ export default function QuickInserter( { } }, [ setInserterIsOpened ] ); + const { showInsertionPoint } = useDispatch( blockEditorStore ); + // When clicking Browse All select the appropriate block so as // the insertion point can work as expected. const onBrowseAll = () => { @@ -91,6 +93,7 @@ export default function QuickInserter( { filterValue, onSelect, } ); + showInsertionPoint( rootClientId, insertionIndex ); }; let maxBlockPatterns = 0; diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index 93f88c5e0f30b5..91d853a50a6a42 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -1624,6 +1624,7 @@ export function insertionPoint( state = null, action ) { } case 'HIDE_INSERTION_POINT': + case 'CLEAR_SELECTED_BLOCK': case 'SELECT_BLOCK': return null; } diff --git a/packages/editor/src/components/inserter-sidebar/index.js b/packages/editor/src/components/inserter-sidebar/index.js index f9378f11e0e3fc..bf613b5c8c001a 100644 --- a/packages/editor/src/components/inserter-sidebar/index.js +++ b/packages/editor/src/components/inserter-sidebar/index.js @@ -30,13 +30,16 @@ export default function InserterSidebar() { sidebarIsOpened, } = useSelect( ( select ) => { const { - getBlockInsertionPoint, getInserterSidebarToggleRef, getInsertionPoint, isPublishSidebarOpened, } = unlock( select( editorStore ) ); - const { getBlockRootClientId, __unstableGetEditorMode, getSettings } = - select( blockEditorStore ); + const { + getBlockInsertionPoint, + getBlockRootClientId, + __unstableGetEditorMode, + getSettings, + } = select( blockEditorStore ); const { get } = select( preferencesStore ); const { getActiveComplementaryArea } = select( interfaceStore ); const getBlockSectionRootClientId = () => {