diff --git a/packages/block-editor/src/components/inserter/block-patterns-tab/index.js b/packages/block-editor/src/components/inserter/block-patterns-tab/index.js index ebf816a9e2decb..ef4d2ae3f4a8cc 100644 --- a/packages/block-editor/src/components/inserter/block-patterns-tab/index.js +++ b/packages/block-editor/src/components/inserter/block-patterns-tab/index.js @@ -12,21 +12,18 @@ import { __ } from '@wordpress/i18n'; import PatternsExplorerModal from '../block-patterns-explorer'; import MobileTabNavigation from '../mobile-tab-navigation'; import { PatternCategoryPreviews } from './pattern-category-previews'; -import { usePatternCategories } from './use-pattern-categories'; import CategoryTabs from '../category-tabs'; import InserterNoResults from '../no-results'; function BlockPatternsTab( { onSelectCategory, selectedCategory, + categories, onInsert, rootClientId, children, } ) { const [ showPatternsExplorer, setShowPatternsExplorer ] = useState( false ); - - const categories = usePatternCategories( rootClientId ); - const isMobile = useViewportMatch( 'medium', '<' ); if ( ! categories.length ) { diff --git a/packages/block-editor/src/components/inserter/menu.js b/packages/block-editor/src/components/inserter/menu.js index e5b24cf82bb6c7..0d1f7d77b84fcf 100644 --- a/packages/block-editor/src/components/inserter/menu.js +++ b/packages/block-editor/src/components/inserter/menu.js @@ -33,6 +33,7 @@ import useInsertionPoint from './hooks/use-insertion-point'; import InserterTabs from './tabs'; import { useZoomOut } from '../../hooks/use-zoom-out'; import { store as blockEditorStore } from '../../store'; +import { usePatternCategories } from './block-patterns-tab/use-pattern-categories'; const NOOP = () => {}; function InserterMenu( @@ -61,9 +62,12 @@ function InserterMenu( const [ filterValue, setFilterValue, delayedFilterValue ] = useDebouncedInput( __experimentalFilterValue ); const [ hoveredItem, setHoveredItem ] = useState( null ); - const [ selectedPatternCategory, setSelectedPatternCategory ] = useState( { - name: __experimentalInitialCategory, - } ); + const categories = usePatternCategories( rootClientId ); + const [ selectedPatternCategory, setSelectedPatternCategory ] = useState( + categories.find( + ( category ) => category.name === __experimentalInitialCategory + ) + ); const [ patternFilter, setPatternFilter ] = useState( 'all' ); const [ selectedMediaCategory, setSelectedMediaCategory ] = useState( null ); @@ -227,6 +231,7 @@ function InserterMenu( onInsert={ onInsertPattern } onSelectCategory={ onClickPatternCategory } selectedCategory={ selectedPatternCategory } + categories={ categories } > { showPatternPanel && (