diff --git a/packages/block-editor/src/components/block-switcher/index.js b/packages/block-editor/src/components/block-switcher/index.js
index 4267e28d991ae2..bed2a1093050d1 100644
--- a/packages/block-editor/src/components/block-switcher/index.js
+++ b/packages/block-editor/src/components/block-switcher/index.js
@@ -33,38 +33,16 @@ function BlockSwitcherDropdownMenuContents( {
onClose,
clientIds,
hasBlockStyles,
- canRemove,
+ patterns,
+ blocks,
+ possibleBlockTransformations,
+ blockVariationTransformations,
+ hasPatternTransformation,
+ hasBlockOrBlockVariationTransforms,
} ) {
const { replaceBlocks, multiSelect, updateBlockAttributes } =
useDispatch( blockEditorStore );
- const { possibleBlockTransformations, patterns, blocks } = useSelect(
- ( select ) => {
- const {
- getBlocksByClientId,
- getBlockRootClientId,
- getBlockTransformItems,
- __experimentalGetPatternTransformItems,
- } = select( blockEditorStore );
- const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
- const _blocks = getBlocksByClientId( clientIds );
- return {
- blocks: _blocks,
- possibleBlockTransformations: getBlockTransformItems(
- _blocks,
- rootClientId
- ),
- patterns: __experimentalGetPatternTransformItems(
- _blocks,
- rootClientId
- ),
- };
- },
- [ clientIds ]
- );
- const blockVariationTransformations = useBlockVariationTransforms( {
- clientIds,
- blocks,
- } );
+
function selectForMultipleBlocks( insertedBlocks ) {
if ( insertedBlocks.length > 1 ) {
multiSelect(
@@ -91,32 +69,6 @@ function BlockSwitcherDropdownMenuContents( {
replaceBlocks( clientIds, transformedBlocks );
selectForMultipleBlocks( transformedBlocks );
}
- /**
- * The `isTemplate` check is a stopgap solution here.
- * Ideally, the Transforms API should handle this
- * by allowing to exclude blocks from wildcard transformations.
- */
- const isSingleBlock = blocks.length === 1;
- const isTemplate = isSingleBlock && isTemplatePart( blocks[ 0 ] );
- const hasPossibleBlockTransformations =
- !! possibleBlockTransformations.length && canRemove && ! isTemplate;
- const hasPossibleBlockVariationTransformations =
- !! blockVariationTransformations?.length;
- const hasPatternTransformation = !! patterns?.length && canRemove;
- const hasBlockOrBlockVariationTransforms =
- hasPossibleBlockTransformations ||
- hasPossibleBlockVariationTransformations;
- const hasContents =
- hasBlockStyles ||
- hasBlockOrBlockVariationTransforms ||
- hasPatternTransformation;
- if ( ! hasContents ) {
- return (
-
- { __( 'No transforms.' ) }
-
- );
- }
return (
@@ -170,6 +122,9 @@ export const BlockSwitcher = ( { clientIds } ) => {
isReusable,
isTemplate,
isDisabled,
+ possibleBlockTransformations,
+ patterns,
+ blocks,
} = useSelect(
( select ) => {
const {
@@ -178,6 +133,9 @@ export const BlockSwitcher = ( { clientIds } ) => {
getBlockAttributes,
canRemoveBlocks,
getBlockEditingMode,
+ getBlockRootClientId,
+ getBlockTransformItems,
+ __experimentalGetPatternTransformItems,
} = select( blockEditorStore );
const { getBlockStyles, getBlockType, getActiveBlockVariation } =
select( blocksStore );
@@ -212,6 +170,8 @@ export const BlockSwitcher = ( { clientIds } ) => {
_icon = isSelectionOfSameType ? blockType.icon : copy;
}
+ const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
+
return {
canRemove: canRemoveBlocks( clientIds ),
hasBlockStyles:
@@ -224,6 +184,15 @@ export const BlockSwitcher = ( { clientIds } ) => {
_isSingleBlockSelected && isTemplatePart( _blocks[ 0 ] ),
hasContentOnlyLocking: _hasTemplateLock,
isDisabled: editingMode !== 'default',
+ blocks: _blocks,
+ possibleBlockTransformations: getBlockTransformItems(
+ _blocks,
+ rootClientId
+ ),
+ patterns: __experimentalGetPatternTransformItems(
+ _blocks,
+ rootClientId
+ ),
};
},
[ clientIds ]
@@ -238,6 +207,11 @@ export const BlockSwitcher = ( { clientIds } ) => {
[]
);
+ const blockVariationTransformations = useBlockVariationTransforms( {
+ clientIds,
+ blocks,
+ } );
+
if ( invalidBlocks ) {
return null;
}
@@ -252,18 +226,34 @@ export const BlockSwitcher = ( { clientIds } ) => {
? blockTitle
: undefined;
+ const hideTooltip = blockSwitcherLabel === blockIndicatorText;
+
+ const hasPossibleBlockTransformations =
+ !! possibleBlockTransformations.length && canRemove && ! isTemplate;
+ const hasPossibleBlockVariationTransformations =
+ !! blockVariationTransformations?.length;
+ const hasPatternTransformation = !! patterns?.length && canRemove;
+ const hasBlockOrBlockVariationTransforms =
+ hasPossibleBlockTransformations ||
+ hasPossibleBlockVariationTransformations;
+ const hasContents =
+ hasBlockStyles ||
+ hasBlockOrBlockVariationTransforms ||
+ hasPatternTransformation;
+
const hideDropdown =
isDisabled ||
( ! hasBlockStyles && ! canRemove ) ||
- hasContentOnlyLocking;
+ hasContentOnlyLocking ||
+ ! hasContents;
if ( hideDropdown ) {
return (
-
+
{
onClose={ onClose }
clientIds={ clientIds }
hasBlockStyles={ hasBlockStyles }
- canRemove={ canRemove }
+ patterns={ patterns }
+ blocks={ blocks }
+ possibleBlockTransformations={
+ possibleBlockTransformations
+ }
+ blockVariationTransformations={
+ blockVariationTransformations
+ }
+ hasPatternTransformation={
+ hasPatternTransformation
+ }
+ hasBlockOrBlockVariationTransforms={
+ hasBlockOrBlockVariationTransforms
+ }
/>
) }