diff --git a/packages/block-editor/src/components/inserter/hooks/use-block-types-state.js b/packages/block-editor/src/components/inserter/hooks/use-block-types-state.js index 6b9e694c1cdf8..8db23267eee8f 100644 --- a/packages/block-editor/src/components/inserter/hooks/use-block-types-state.js +++ b/packages/block-editor/src/components/inserter/hooks/use-block-types-state.js @@ -8,7 +8,7 @@ import { parse, } from '@wordpress/blocks'; import { useSelect } from '@wordpress/data'; -import { useCallback } from '@wordpress/element'; +import { useCallback, useMemo } from '@wordpress/element'; /** * Internal dependencies @@ -25,13 +25,18 @@ import { withRootClientIdOptionKey } from '../../../store/utils'; * @return {Array} Returns the block types state. (block types, categories, collections, onSelect handler) */ const useBlockTypesState = ( rootClientId, onInsert, isQuick ) => { + const options = useMemo( + () => ( { [ withRootClientIdOptionKey ]: ! isQuick } ), + [ isQuick ] + ); const [ items ] = useSelect( ( select ) => [ - select( blockEditorStore ).getInserterItems( rootClientId, { - [ withRootClientIdOptionKey ]: ! isQuick, - } ), + select( blockEditorStore ).getInserterItems( + rootClientId, + options + ), ], - [ rootClientId, isQuick ] + [ rootClientId, options ] ); const [ categories, collections ] = useSelect( ( select ) => { diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index bf7b5125a770e..bf98521dfe9b6 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -76,6 +76,8 @@ const EMPTY_ARRAY = []; */ const EMPTY_SET = new Set(); +const EMPTY_OBJECT = {}; + /** * Returns a block's name given its client ID, or null if no block exists with * the client ID. @@ -1996,7 +1998,7 @@ const buildBlockTypeItem = */ export const getInserterItems = createRegistrySelector( ( select ) => createSelector( - ( state, rootClientId = null, options = {} ) => { + ( state, rootClientId = null, options = EMPTY_OBJECT ) => { const buildReusableBlockInserterItem = ( reusableBlock ) => { const icon = ! reusableBlock.wp_pattern_sync_status ? {