Fix: Show add pattern label when patterns are being prioritised.

WordPress · Apr 26, 2022 · ab05239 · ab05239
1 parent c5b9ca1
commit ab05239
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/packages/block-editor/src/components/inserter/index.js b/packages/block-editor/src/components/inserter/index.js
@@ -30,6 +30,7 @@ const defaultRenderToggle = ( {
 	blockTitle,
 	hasSingleBlockType,
 	toggleProps = {},
+	prioritizePatterns,
 } ) => {
 	let label;
 	if ( hasSingleBlockType ) {
@@ -38,6 +39,8 @@ const defaultRenderToggle = ( {
 			_x( 'Add %s', 'directly add the only allowed block' ),
 			blockTitle
 		);
+	} else if ( prioritizePatterns ) {
+		label = __( 'Add pattern' );
 	} else {
 		label = _x( 'Add block', 'Generic label for block inserter button' );
 	}
@@ -106,6 +109,7 @@ class Inserter extends Component {
 			toggleProps,
 			hasItems,
 			renderToggle = defaultRenderToggle,
+			prioritizePatterns,
 		} = this.props;
 
 		return renderToggle( {
@@ -116,6 +120,7 @@ class Inserter extends Component {
 			hasSingleBlockType,
 			directInsertBlock,
 			toggleProps,
+			prioritizePatterns,
 		} );
 	}
 
@@ -138,6 +143,7 @@ class Inserter extends Component {
 			// This prop is experimental to give some time for the quick inserter to mature
 			// Feel free to make them stable after a few releases.
 			__experimentalIsQuick: isQuick,
+			prioritizePatterns,
 		} = this.props;
 
 		if ( isQuick ) {
@@ -149,6 +155,7 @@ class Inserter extends Component {
 					rootClientId={ rootClientId }
 					clientId={ clientId }
 					isAppender={ isAppender }
+					prioritizePatterns={ prioritizePatterns }
 				/>
 			);
 		}
@@ -206,7 +213,11 @@ export default compose( [
 			hasInserterItems,
 			__experimentalGetAllowedBlocks,
 			__experimentalGetDirectInsertBlock,
+			getBlockIndex,
+			getBlockCount,
+			getSettings,
 		} = select( blockEditorStore );
+
 		const { getBlockVariations } = select( blocksStore );
 
 		rootClientId =
@@ -218,6 +229,10 @@ export default compose( [
 			rootClientId
 		);
 
+		const index = getBlockIndex( clientId );
+		const blockCount = getBlockCount();
+		const settings = getSettings();
+
 		const hasSingleBlockType =
 			size( allowedBlocks ) === 1 &&
 			size(
@@ -236,6 +251,11 @@ export default compose( [
 			allowedBlockType,
 			directInsertBlock,
 			rootClientId,
+			prioritizePatterns:
+				settings.__experimentalPreferPatternsOnRoot &&
+				! rootClientId &&
+				index > 0 &&
+				( index < blockCount || blockCount === 0 ),
 		};
 	} ),
 	withDispatch( ( dispatch, ownProps, { select } ) => {

diff --git a/packages/block-editor/src/components/inserter/quick-inserter.js b/packages/block-editor/src/components/inserter/quick-inserter.js
@@ -30,6 +30,7 @@ export default function QuickInserter( {
 	rootClientId,
 	clientId,
 	isAppender,
+	prioritizePatterns,
 } ) {
 	const [ filterValue, setFilterValue ] = useState( '' );
 	const [ destinationRootClientId, onInsertBlocks ] = useInsertionPoint( {
@@ -48,11 +49,7 @@ export default function QuickInserter( {
 		destinationRootClientId
 	);
 
-	const {
-		setInserterIsOpened,
-		insertionIndex,
-		prioritizePatterns,
-	} = useSelect(
+	const { setInserterIsOpened, insertionIndex } = useSelect(
 		( select ) => {
 			const { getSettings, getBlockIndex, getBlockCount } = select(
 				blockEditorStore
@@ -63,15 +60,10 @@ export default function QuickInserter( {
 
 			return {
 				setInserterIsOpened: settings.__experimentalSetIsInserterOpened,
-				prioritizePatterns:
-					settings.__experimentalPreferPatternsOnRoot &&
-					! rootClientId &&
-					index > 0 &&
-					( index < blockCount || blockCount === 0 ),
 				insertionIndex: index === -1 ? blockCount : index,
 			};
 		},
-		[ clientId, rootClientId ]
+		[ clientId ]
 	);
 
 	const showPatterns =