From c8abca3081a9259aeafd153aed808cd7a5e34f93 Mon Sep 17 00:00:00 2001 From: Jarda Snajdr Date: Wed, 21 Dec 2022 08:47:48 +0100 Subject: [PATCH] Mobile BlockToolbar: improve useSelect for fewer rerenders --- .../components/block-toolbar/index.native.js | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/packages/block-editor/src/components/block-toolbar/index.native.js b/packages/block-editor/src/components/block-toolbar/index.native.js index 7ae9f8cbaa4ce..a1726441031b1 100644 --- a/packages/block-editor/src/components/block-toolbar/index.native.js +++ b/packages/block-editor/src/components/block-toolbar/index.native.js @@ -11,31 +11,28 @@ import UngroupButton from '../ungroup-button'; import { store as blockEditorStore } from '../../store'; export default function BlockToolbar() { - const { blockClientIds, isValid, mode } = useSelect( ( select ) => { + const { isSelected, isValidAndVisual } = useSelect( ( select ) => { const { getBlockMode, getSelectedBlockClientIds, isBlockValid } = select( blockEditorStore ); const selectedBlockClientIds = getSelectedBlockClientIds(); return { - blockClientIds: selectedBlockClientIds, - isValid: + isSelected: selectedBlockClientIds.length > 0, + isValidAndVisual: selectedBlockClientIds.length === 1 - ? isBlockValid( selectedBlockClientIds[ 0 ] ) - : null, - mode: - selectedBlockClientIds.length === 1 - ? getBlockMode( selectedBlockClientIds[ 0 ] ) - : null, + ? isBlockValid( selectedBlockClientIds[ 0 ] ) && + getBlockMode( selectedBlockClientIds[ 0 ] ) === 'visual' + : false, }; }, [] ); - if ( blockClientIds.length === 0 ) { + if ( ! isSelected ) { return null; } return ( <> - { mode === 'visual' && isValid && ( + { isValidAndVisual && ( <>