From c3a7a1f7d490023d8f9bb0ee05f9e4f99c4b42f4 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Wed, 22 Oct 2025 10:59:41 -0500 Subject: [PATCH 01/11] Don't subscribe in layout hasGlobalPadding if we know it doesn't --- packages/block-editor/src/hooks/layout.js | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/block-editor/src/hooks/layout.js b/packages/block-editor/src/hooks/layout.js index 003a680940b977..772b86b334eee4 100644 --- a/packages/block-editor/src/hooks/layout.js +++ b/packages/block-editor/src/hooks/layout.js @@ -74,13 +74,17 @@ export function useLayoutClasses( blockAttributes = {}, blockName = '' ) { const hasGlobalPadding = useSelect( ( select ) => { - return ( - ( usedLayout?.inherit || - usedLayout?.contentSize || - usedLayout?.type === 'constrained' ) && - select( blockEditorStore ).getSettings().__experimentalFeatures - ?.useRootPaddingAwareAlignments - ); + // Early return to avoid subscription when layout doesn't use global padding + if ( + ! usedLayout?.inherit && + ! usedLayout?.contentSize && + usedLayout?.type !== 'constrained' + ) { + return false; + } + + return select( blockEditorStore ).getSettings() + .__experimentalFeatures?.useRootPaddingAwareAlignments; }, [ usedLayout?.contentSize, usedLayout?.inherit, usedLayout?.type ] ); From cca358243b2cde974644ccf3ab8903faab0ef5ef Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Tue, 21 Oct 2025 09:21:57 -0500 Subject: [PATCH 02/11] Don't subscribe BorderPanel if it's not enabled for that block --- packages/block-editor/src/hooks/border.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/packages/block-editor/src/hooks/border.js b/packages/block-editor/src/hooks/border.js index 4ab4c69a41f311..fbce7c1880b46f 100644 --- a/packages/block-editor/src/hooks/border.js +++ b/packages/block-editor/src/hooks/border.js @@ -142,12 +142,18 @@ function BordersInspectorControl( { label, children, resetAllFilter } ) { export function BorderPanel( { clientId, name, setAttributes, settings } ) { const isEnabled = useHasBorderPanel( settings ); - function selector( select ) { - const { style, borderColor } = - select( blockEditorStore ).getBlockAttributes( clientId ) || {}; - return { style, borderColor }; - } - const { style, borderColor } = useSelect( selector, [ clientId ] ); + const { style, borderColor } = useSelect( + ( select ) => { + // Early return to avoid subscription when disabled + if ( ! isEnabled ) { + return {}; + } + const { style: _style, borderColor: _borderColor } = + select( blockEditorStore ).getBlockAttributes( clientId ) || {}; + return { style: _style, borderColor: _borderColor }; + }, + [ clientId, isEnabled ] + ); const value = useMemo( () => { return attributesToStyle( { style, borderColor } ); }, [ style, borderColor ] ); From 1a099148e75c2849ca5222faca04b719774b1f4e Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Tue, 21 Oct 2025 09:22:49 -0500 Subject: [PATCH 03/11] Don't subscribe ColorEdit if it's not enabled for that block --- packages/block-editor/src/hooks/color.js | 27 ++++++++++++++++++------ 1 file changed, 20 insertions(+), 7 deletions(-) diff --git a/packages/block-editor/src/hooks/color.js b/packages/block-editor/src/hooks/color.js index ef8984c9367853..237a462dab7b14 100644 --- a/packages/block-editor/src/hooks/color.js +++ b/packages/block-editor/src/hooks/color.js @@ -262,14 +262,27 @@ function ColorInspectorControl( { children, resetAllFilter } ) { export function ColorEdit( { clientId, name, setAttributes, settings } ) { const isEnabled = useHasColorPanel( settings ); - function selector( select ) { - const { style, textColor, backgroundColor, gradient } = - select( blockEditorStore ).getBlockAttributes( clientId ) || {}; - return { style, textColor, backgroundColor, gradient }; - } + const { style, textColor, backgroundColor, gradient } = useSelect( - selector, - [ clientId ] + ( select ) => { + // Early return to avoid subscription when disabled + if ( ! isEnabled ) { + return {}; + } + const { + style: _style, + textColor: _textColor, + backgroundColor: _backgroundColor, + gradient: _gradient, + } = select( blockEditorStore ).getBlockAttributes( clientId ) || {}; + return { + style: _style, + textColor: _textColor, + backgroundColor: _backgroundColor, + gradient: _gradient, + }; + }, + [ clientId, isEnabled ] ); const value = useMemo( () => { return attributesToStyle( { From c2b4d56fdfe174a25e40faa3d5b686de8eef2a29 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Tue, 21 Oct 2025 09:26:51 -0500 Subject: [PATCH 04/11] Don't subscribe dimensions panel to store if it's disabled --- packages/block-editor/src/hooks/dimensions.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/block-editor/src/hooks/dimensions.js b/packages/block-editor/src/hooks/dimensions.js index ffa4048b7740e3..941bf645413743 100644 --- a/packages/block-editor/src/hooks/dimensions.js +++ b/packages/block-editor/src/hooks/dimensions.js @@ -71,9 +71,15 @@ function DimensionsInspectorControl( { children, resetAllFilter } ) { export function DimensionsPanel( { clientId, name, setAttributes, settings } ) { const isEnabled = useHasDimensionsPanel( settings ); const value = useSelect( - ( select ) => - select( blockEditorStore ).getBlockAttributes( clientId )?.style, - [ clientId ] + ( select ) => { + // Early return to avoid subscription when disabled + if ( ! isEnabled ) { + return undefined; + } + return select( blockEditorStore ).getBlockAttributes( clientId ) + ?.style; + }, + [ clientId, isEnabled ] ); const [ visualizedProperty, setVisualizedProperty ] = useVisualizer(); const onChange = ( newStyle ) => { From bb11e4b55f46f669838fa8b31dee1710d1819275 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Tue, 21 Oct 2025 09:27:53 -0500 Subject: [PATCH 05/11] Don't subscribe typography panel to store if it's disabled --- packages/block-editor/src/hooks/typography.js | 30 ++++++++++++++----- 1 file changed, 22 insertions(+), 8 deletions(-) diff --git a/packages/block-editor/src/hooks/typography.js b/packages/block-editor/src/hooks/typography.js index 5c551a4bb35761..b19582911a778e 100644 --- a/packages/block-editor/src/hooks/typography.js +++ b/packages/block-editor/src/hooks/typography.js @@ -115,15 +115,29 @@ function TypographyInspectorControl( { children, resetAllFilter } ) { } export function TypographyPanel( { clientId, name, setAttributes, settings } ) { - function selector( select ) { - const { style, fontFamily, fontSize, fitText } = - select( blockEditorStore ).getBlockAttributes( clientId ) || {}; - return { style, fontFamily, fontSize, fitText }; - } - const { style, fontFamily, fontSize, fitText } = useSelect( selector, [ - clientId, - ] ); const isEnabled = useHasTypographyPanel( settings ); + + const { style, fontFamily, fontSize, fitText } = useSelect( + ( select ) => { + // Early return INSIDE selector to avoid subscription when disabled + if ( ! isEnabled ) { + return {}; + } + const { + style: _style, + fontFamily: _fontFamily, + fontSize: _fontSize, + fitText: _fitText, + } = select( blockEditorStore ).getBlockAttributes( clientId ) || {}; + return { + style: _style, + fontFamily: _fontFamily, + fontSize: _fontSize, + fitText: _fitText, + }; + }, + [ clientId, isEnabled ] + ); const value = useMemo( () => attributesToStyle( { style, fontFamily, fontSize } ), [ style, fontSize, fontFamily ] From 6b638d1d5fb64ada96bb5cf2fd905603b0c9f715 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 10:18:09 -0500 Subject: [PATCH 06/11] Don't subscribe PatternRenameModal to core store unless it's open --- .../components/pattern-rename-modal/index.js | 39 ++++++++++++------- 1 file changed, 24 insertions(+), 15 deletions(-) diff --git a/packages/editor/src/components/pattern-rename-modal/index.js b/packages/editor/src/components/pattern-rename-modal/index.js index ea9a46e977b240..085efbb4cf33c4 100644 --- a/packages/editor/src/components/pattern-rename-modal/index.js +++ b/packages/editor/src/components/pattern-rename-modal/index.js @@ -17,25 +17,34 @@ const { RenamePatternModal } = unlock( patternsPrivateApis ); export const modalName = 'editor/pattern-rename'; export default function PatternRenameModal() { - const { record, postType } = useSelect( ( select ) => { - const { getCurrentPostType, getCurrentPostId } = select( editorStore ); - const { getEditedEntityRecord } = select( coreStore ); - const _postType = getCurrentPostType(); - return { - record: getEditedEntityRecord( - 'postType', - _postType, - getCurrentPostId() - ), - postType: _postType, - }; - }, [] ); - const { closeModal } = useDispatch( interfaceStore ); - const isActive = useSelect( ( select ) => select( interfaceStore ).isModalActive( modalName ) ); + const { record, postType } = useSelect( + ( select ) => { + if ( ! isActive ) { + return {}; + } + + const { getCurrentPostType, getCurrentPostId } = + select( editorStore ); + const { getEditedEntityRecord } = select( coreStore ); + const _postType = getCurrentPostType(); + return { + record: getEditedEntityRecord( + 'postType', + _postType, + getCurrentPostId() + ), + postType: _postType, + }; + }, + [ isActive ] + ); + + const { closeModal } = useDispatch( interfaceStore ); + if ( ! isActive || postType !== PATTERN_POST_TYPE ) { return null; } From 77f14d725d2b3a750139b107cbf2446db2630267 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 10:32:16 -0500 Subject: [PATCH 07/11] Don't subscribe PatternDuplicateModal to core store unless it's open --- .../pattern-duplicate-modal/index.js | 38 +++++++++++-------- 1 file changed, 23 insertions(+), 15 deletions(-) diff --git a/packages/editor/src/components/pattern-duplicate-modal/index.js b/packages/editor/src/components/pattern-duplicate-modal/index.js index 2e5593536d1834..4c6ff6f83ef43f 100644 --- a/packages/editor/src/components/pattern-duplicate-modal/index.js +++ b/packages/editor/src/components/pattern-duplicate-modal/index.js @@ -17,25 +17,33 @@ const { DuplicatePatternModal } = unlock( patternsPrivateApis ); export const modalName = 'editor/pattern-duplicate'; export default function PatternDuplicateModal() { - const { record, postType } = useSelect( ( select ) => { - const { getCurrentPostType, getCurrentPostId } = select( editorStore ); - const { getEditedEntityRecord } = select( coreStore ); - const _postType = getCurrentPostType(); - return { - record: getEditedEntityRecord( - 'postType', - _postType, - getCurrentPostId() - ), - postType: _postType, - }; - }, [] ); - const { closeModal } = useDispatch( interfaceStore ); - const isActive = useSelect( ( select ) => select( interfaceStore ).isModalActive( modalName ) ); + const { record, postType } = useSelect( + ( select ) => { + if ( ! isActive ) { + return {}; + } + + const { getCurrentPostType, getCurrentPostId } = + select( editorStore ); + const { getEditedEntityRecord } = select( coreStore ); + const _postType = getCurrentPostType(); + return { + record: getEditedEntityRecord( + 'postType', + _postType, + getCurrentPostId() + ), + postType: _postType, + }; + }, + [ isActive ] + ); + const { closeModal } = useDispatch( interfaceStore ); + if ( ! isActive || postType !== PATTERN_POST_TYPE ) { return null; } From b70e35586c3de9fb86f25601755786add51da33e Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 11:07:46 -0500 Subject: [PATCH 08/11] Don't mount init pattern modal unless on relevant post type --- .../src/components/init-pattern-modal/index.js | 17 ++++++----------- .../edit-post/src/components/layout/index.js | 4 +++- 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/packages/edit-post/src/components/init-pattern-modal/index.js b/packages/edit-post/src/components/init-pattern-modal/index.js index 1bfeadd73f94a6..fdc633534895ae 100644 --- a/packages/edit-post/src/components/init-pattern-modal/index.js +++ b/packages/edit-post/src/components/init-pattern-modal/index.js @@ -19,19 +19,14 @@ export default function InitPatternModal() { const [ syncType, setSyncType ] = useState( undefined ); const [ title, setTitle ] = useState( '' ); - const { postType, isNewPost } = useSelect( ( select ) => { - const { getEditedPostAttribute, isCleanNewPost } = - select( editorStore ); - return { - postType: getEditedPostAttribute( 'type' ), - isNewPost: isCleanNewPost(), - }; - }, [] ); - const [ isModalOpen, setIsModalOpen ] = useState( - () => isNewPost && postType === 'wp_block' + const isNewPost = useSelect( + ( select ) => select( editorStore ).isCleanNewPost(), + [] ); - if ( postType !== 'wp_block' || ! isNewPost ) { + const [ isModalOpen, setIsModalOpen ] = useState( () => isNewPost ); + + if ( ! isNewPost ) { return null; } diff --git a/packages/edit-post/src/components/layout/index.js b/packages/edit-post/src/components/layout/index.js index 6bf2b2349d240f..61d1cef6441d28 100644 --- a/packages/edit-post/src/components/layout/index.js +++ b/packages/edit-post/src/components/layout/index.js @@ -673,7 +673,9 @@ function Layout( { - + { currentPostType === 'wp_block' && ( + + ) } { backButton } From 6978a58077fc9521635e9a4bd84d14b2295d5a7b Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 11:21:53 -0500 Subject: [PATCH 09/11] Combine blockEditorStore subscriptionsn for InbetweenInsertionPointPopover --- .../src/components/block-tools/insertion-point.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/block-editor/src/components/block-tools/insertion-point.js b/packages/block-editor/src/components/block-tools/insertion-point.js index 55d6a2a4864fa3..b69772f6c8641a 100644 --- a/packages/block-editor/src/components/block-tools/insertion-point.js +++ b/packages/block-editor/src/components/block-tools/insertion-point.js @@ -45,6 +45,7 @@ function InbetweenInsertionPointPopover( { isInserterShown, isDistractionFree, isZoomOutMode, + getBlockEditingMode, } = useSelect( ( select ) => { const { getBlockOrder, @@ -55,6 +56,7 @@ function InbetweenInsertionPointPopover( { getNextBlockClientId, getSettings, isZoomOut, + getBlockEditingMode: _getBlockEditingMode, } = unlock( select( blockEditorStore ) ); const insertionPoint = getBlockInsertionPoint(); const order = getBlockOrder( insertionPoint.rootClientId ); @@ -86,9 +88,9 @@ function InbetweenInsertionPointPopover( { isDistractionFree: settings.isDistractionFree, isInserterShown: insertionPoint?.__unstableWithInserter, isZoomOutMode: isZoomOut(), + getBlockEditingMode: _getBlockEditingMode, }; }, [] ); - const { getBlockEditingMode } = useSelect( blockEditorStore ); const disableMotion = useReducedMotion(); From 5c212abc90a25586a128ef2151458edcf060de31 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 11:31:22 -0500 Subject: [PATCH 10/11] Combine block-tools subscriptions --- .../src/components/block-tools/index.js | 28 +++++++++++++++---- 1 file changed, 22 insertions(+), 6 deletions(-) diff --git a/packages/block-editor/src/components/block-tools/index.js b/packages/block-editor/src/components/block-tools/index.js index 86597a03cde2a5..629aabbf556f5a 100644 --- a/packages/block-editor/src/components/block-tools/index.js +++ b/packages/block-editor/src/components/block-tools/index.js @@ -39,8 +39,15 @@ function selector( select ) { isTyping, isDragging, isZoomOut, + getBlocksByClientId, + getSelectedBlockClientIds, + getBlockRootClientId, + isGroupable, + getBlockName, } = unlock( select( blockEditorStore ) ); + const { getGroupingBlockName } = select( blocksStore ); + const clientId = getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId(); @@ -50,6 +57,12 @@ function selector( select ) { isTyping: isTyping(), isZoomOutMode: isZoomOut(), isDragging: isDragging(), + getBlocksByClientId, + getSelectedBlockClientIds, + getBlockRootClientId, + isGroupable, + getBlockName, + getGroupingBlockName, }; } @@ -67,18 +80,21 @@ export default function BlockTools( { __unstableContentRef, ...props } ) { - const { clientId, hasFixedToolbar, isTyping, isZoomOutMode, isDragging } = - useSelect( selector, [] ); - - const isMatch = useShortcutEventMatch(); const { + clientId, + hasFixedToolbar, + isTyping, + isZoomOutMode, + isDragging, getBlocksByClientId, getSelectedBlockClientIds, getBlockRootClientId, isGroupable, getBlockName, - } = useSelect( blockEditorStore ); - const { getGroupingBlockName } = useSelect( blocksStore ); + getGroupingBlockName, + } = useSelect( selector, [] ); + + const isMatch = useShortcutEventMatch(); const { showEmptyBlockSideInserter, showBlockToolbarPopover } = useShowBlockTools(); const pasteStyles = usePasteStyles(); From e08948555cfae26440551fdda798152a8863bb23 Mon Sep 17 00:00:00 2001 From: Jerry Jones Date: Thu, 23 Oct 2025 11:58:23 -0500 Subject: [PATCH 11/11] Refactor useShowBlockTools into the single useSelect in BlockTools Combining selectors where possible is good for performance. This refactor keeps the complexity isolated while eleminating an unnecessary extra subscription. --- .../src/components/block-tools/index.js | 27 +++++-- .../block-tools/should-show-block-tools.js | 46 +++++++++++ .../block-tools/use-show-block-tools.js | 77 +++++++++---------- 3 files changed, 103 insertions(+), 47 deletions(-) create mode 100644 packages/block-editor/src/components/block-tools/should-show-block-tools.js diff --git a/packages/block-editor/src/components/block-tools/index.js b/packages/block-editor/src/components/block-tools/index.js index 629aabbf556f5a..41a40d48d20b20 100644 --- a/packages/block-editor/src/components/block-tools/index.js +++ b/packages/block-editor/src/components/block-tools/index.js @@ -26,7 +26,7 @@ import BlockToolbarPopover from './block-toolbar-popover'; import { store as blockEditorStore } from '../../store'; import usePopoverScroll from '../block-popover/use-popover-scroll'; import ZoomOutModeInserters from './zoom-out-mode-inserters'; -import { useShowBlockTools } from './use-show-block-tools'; +import { shouldShowBlockTools } from './should-show-block-tools'; import { unlock } from '../../lock-unlock'; import { cleanEmptyObject } from '../../hooks/utils'; import usePasteStyles from '../use-paste-styles'; @@ -44,19 +44,36 @@ function selector( select ) { getBlockRootClientId, isGroupable, getBlockName, + getBlock, + getBlockMode, + isBlockInterfaceHidden, } = unlock( select( blockEditorStore ) ); const { getGroupingBlockName } = select( blocksStore ); const clientId = getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId(); + const _isTyping = isTyping(); + const _hasFixedToolbar = getSettings().hasFixedToolbar; + + const { showEmptyBlockSideInserter, showBlockToolbarPopover } = + shouldShowBlockTools( { + block: getBlock( clientId ), + blockMode: clientId ? getBlockMode( clientId ) : null, + isBlockInterfaceHidden: isBlockInterfaceHidden(), + clientId, + isTyping: _isTyping, + hasFixedToolbar: _hasFixedToolbar, + } ); return { clientId, - hasFixedToolbar: getSettings().hasFixedToolbar, - isTyping: isTyping(), + hasFixedToolbar: _hasFixedToolbar, + isTyping: _isTyping, isZoomOutMode: isZoomOut(), isDragging: isDragging(), + showEmptyBlockSideInserter, + showBlockToolbarPopover, getBlocksByClientId, getSelectedBlockClientIds, getBlockRootClientId, @@ -92,11 +109,11 @@ export default function BlockTools( { isGroupable, getBlockName, getGroupingBlockName, + showEmptyBlockSideInserter, + showBlockToolbarPopover, } = useSelect( selector, [] ); const isMatch = useShortcutEventMatch(); - const { showEmptyBlockSideInserter, showBlockToolbarPopover } = - useShowBlockTools(); const pasteStyles = usePasteStyles(); const { diff --git a/packages/block-editor/src/components/block-tools/should-show-block-tools.js b/packages/block-editor/src/components/block-tools/should-show-block-tools.js new file mode 100644 index 00000000000000..c30cb3d212bd22 --- /dev/null +++ b/packages/block-editor/src/components/block-tools/should-show-block-tools.js @@ -0,0 +1,46 @@ +/** + * WordPress dependencies + */ +import { isUnmodifiedDefaultBlock } from '@wordpress/blocks'; + +/** + * Determines which block tools should be showing based on the current editor state. + * This is a pure function that can be called from within a selector. + * + * @param {Object} options Calculation options. + * @param {Object} options.block The selected block object. + * @param {string} options.blockMode The block mode ('visual' or 'html'). + * @param {boolean} options.isBlockInterfaceHidden Whether the block interface is hidden. + * @param {string} options.clientId The selected block client ID. + * @param {boolean} options.isTyping Whether the user is currently typing. + * @param {boolean} options.hasFixedToolbar Whether the toolbar is fixed. + * + * @return {Object} Object of which block tools will be shown. + */ +export function shouldShowBlockTools( { + block, + blockMode, + isBlockInterfaceHidden, + clientId, + isTyping, + hasFixedToolbar, +} ) { + const hasSelectedBlock = !! clientId && !! block; + const isEmptyDefaultBlock = + hasSelectedBlock && + isUnmodifiedDefaultBlock( block, 'content' ) && + blockMode !== 'html'; + const showEmptyBlockSideInserter = + clientId && ! isTyping && isEmptyDefaultBlock; + const showBlockToolbarPopover = + ! isBlockInterfaceHidden && + ! hasFixedToolbar && + ! showEmptyBlockSideInserter && + hasSelectedBlock && + ! isEmptyDefaultBlock; + + return { + showEmptyBlockSideInserter, + showBlockToolbarPopover, + }; +} diff --git a/packages/block-editor/src/components/block-tools/use-show-block-tools.js b/packages/block-editor/src/components/block-tools/use-show-block-tools.js index 2b9236bb25b953..fb4b78f24a2b0d 100644 --- a/packages/block-editor/src/components/block-tools/use-show-block-tools.js +++ b/packages/block-editor/src/components/block-tools/use-show-block-tools.js @@ -1,53 +1,46 @@ /** * WordPress dependencies */ -import { useSelect } from '@wordpress/data'; import { isUnmodifiedDefaultBlock } from '@wordpress/blocks'; /** - * Internal dependencies - */ -import { store as blockEditorStore } from '../../store'; -import { unlock } from '../../lock-unlock'; - -/** - * Source of truth for which block tools are showing in the block editor. + * Calculates which block tools should be showing based on the current editor state. + * This is a pure function that can be called from within a selector. + * + * @param {Object} options Calculation options. + * @param {Object} options.block The selected block object. + * @param {string} options.blockMode The block mode ('visual' or 'html'). + * @param {boolean} options.isBlockInterfaceHidden Whether the block interface is hidden. + * @param {string} options.clientId The selected block client ID. + * @param {boolean} options.isTyping Whether the user is currently typing. + * @param {boolean} options.hasFixedToolbar Whether the toolbar is fixed. * * @return {Object} Object of which block tools will be shown. */ -export function useShowBlockTools() { - return useSelect( ( select ) => { - const { - getSelectedBlockClientId, - getFirstMultiSelectedBlockClientId, - getBlock, - getBlockMode, - getSettings, - isTyping, - isBlockInterfaceHidden, - } = unlock( select( blockEditorStore ) ); - - const clientId = - getSelectedBlockClientId() || getFirstMultiSelectedBlockClientId(); - - const block = getBlock( clientId ); - const hasSelectedBlock = !! clientId && !! block; - const isEmptyDefaultBlock = - hasSelectedBlock && - isUnmodifiedDefaultBlock( block, 'content' ) && - getBlockMode( clientId ) !== 'html'; - const _showEmptyBlockSideInserter = - clientId && ! isTyping() && isEmptyDefaultBlock; - const _showBlockToolbarPopover = - ! isBlockInterfaceHidden() && - ! getSettings().hasFixedToolbar && - ! _showEmptyBlockSideInserter && - hasSelectedBlock && - ! isEmptyDefaultBlock; +export function calculateShowBlockTools( { + block, + blockMode, + isBlockInterfaceHidden, + clientId, + isTyping, + hasFixedToolbar, +} ) { + const hasSelectedBlock = !! clientId && !! block; + const isEmptyDefaultBlock = + hasSelectedBlock && + isUnmodifiedDefaultBlock( block, 'content' ) && + blockMode !== 'html'; + const showEmptyBlockSideInserter = + clientId && ! isTyping && isEmptyDefaultBlock; + const showBlockToolbarPopover = + ! isBlockInterfaceHidden && + ! hasFixedToolbar && + ! showEmptyBlockSideInserter && + hasSelectedBlock && + ! isEmptyDefaultBlock; - return { - showEmptyBlockSideInserter: _showEmptyBlockSideInserter, - showBlockToolbarPopover: _showBlockToolbarPopover, - }; - }, [] ); + return { + showEmptyBlockSideInserter, + showBlockToolbarPopover, + }; }