diff --git a/packages/block-editor/src/components/block-list/index.native.js b/packages/block-editor/src/components/block-list/index.native.js index 5227bce63ecc67..aeeb7fc815e557 100644 --- a/packages/block-editor/src/components/block-list/index.native.js +++ b/packages/block-editor/src/components/block-list/index.native.js @@ -61,15 +61,19 @@ export class BlockList extends Component { // create an empty block of the selected type const newBlock = createBlock( itemValue ); - this.finishBlockAppendingOrReplacing( newBlock ); + this.finishInsertingOrReplacingBlock( newBlock ); } - finishBlockAppendingOrReplacing( newBlock ) { - // now determine whether we need to replace the currently selected block (if it's empty) - // or just add a new block as usual + finishInsertingOrReplacingBlock( newBlock ) { if ( this.isReplaceable( this.props.selectedBlock ) ) { - // do replace here + // replace selected block this.props.replaceBlock( this.props.selectedBlockClientId, newBlock ); + } else if ( this.props.isPostTitleSelected && this.isReplaceable( this.props.firstBlock ) ) { + // replace first block in post: there is no selected block when the post title is selected, + // so replaceBlock does not select the new block and we need to manually select the new block + const { clientId: firstBlockId } = this.props.firstBlock; + this.props.replaceBlock( firstBlockId, newBlock ); + this.props.selectBlock( newBlock.clientId ); } else { this.props.insertBlock( newBlock, this.getNewBlockInsertionIndex() ); } @@ -110,7 +114,7 @@ export class BlockList extends Component { newMediaBlock.attributes.id = payload.mediaId; // finally append or replace as appropriate - this.finishBlockAppendingOrReplacing( newMediaBlock ); + this.finishInsertingOrReplacingBlock( newMediaBlock ); } ); } @@ -260,7 +264,7 @@ export class BlockList extends Component { const paragraphBlock = createBlock( 'core/paragraph' ); return ( { - this.finishBlockAppendingOrReplacing( paragraphBlock ); + this.finishInsertingOrReplacingBlock( paragraphBlock ); } } > @@ -277,6 +281,7 @@ export class BlockList extends Component { export default compose( [ withSelect( ( select, { rootClientId } ) => { const { + getBlock, getBlockCount, getBlockName, getBlockIndex, @@ -287,13 +292,15 @@ export default compose( [ } = select( 'core/block-editor' ); const selectedBlockClientId = getSelectedBlockClientId(); + const blockClientIds = getBlockOrder( rootClientId ); return { - blockClientIds: getBlockOrder( rootClientId ), + blockClientIds, blockCount: getBlockCount( rootClientId ), getBlockName, isBlockSelected, selectedBlock: getSelectedBlock(), + firstBlock: getBlock( blockClientIds[ 0 ] ), selectedBlockClientId, selectedBlockOrder: getBlockIndex( selectedBlockClientId ), }; @@ -303,12 +310,14 @@ export default compose( [ insertBlock, replaceBlock, clearSelectedBlock, + selectBlock, } = dispatch( 'core/block-editor' ); return { clearSelectedBlock, insertBlock, replaceBlock, + selectBlock, }; } ), ] )( BlockList );