From 1e830c288322b3de97d679a1bf0ad34e2ef85f1a Mon Sep 17 00:00:00 2001 From: Jorge Costa <jorge.costa@developer.pt> Date: Tue, 26 Apr 2022 13:39:34 +0100 Subject: [PATCH] Fix: Show add pattern label when patterns are being prioritised. (#40598) --- .../src/components/inserter/index.js | 20 +++++++++++++++++++ .../src/components/inserter/quick-inserter.js | 14 +++---------- 2 files changed, 23 insertions(+), 11 deletions(-) diff --git a/packages/block-editor/src/components/inserter/index.js b/packages/block-editor/src/components/inserter/index.js index 7998e10b2fd636..65bfcfa97e538f 100644 --- 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 index e3973cba6ac1c9..0fc690435b4df6 100644 --- 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 =