Extraneous transforms on synced patterns

[richtabor]

Description:

Transforms for synced patterns are overly generous, even if transforms simply wrap content. This behavior can create confusion and lead to unintended transformations. Limiting transforms from synced patterns would provide a more intuitive experience.

Steps to Reproduce:

1. Insert a synced pattern.
2. Attempt to transform the pattern.
3. Observe the availability of excessive transform options.

Expected:

Transform options should be limited for synced patterns to avoid unnecessary or unintended transformations.

Visual

[Mamaduka]

What's your proposal?

[Rishit30G]

Hi
I'm able to understand the issue, however I'm curious to know where will these changes specifically take place in code
I'm sharing the files that I looked up for making changes:

packages/block-editor/src/components/block-toolbar/index.js
packages/block-editor/src/components/block-switcher/index.js

Would appreciate some help on this one
Thanks 🙇🏻

[Mamaduka]

@Rishit30G, it depends on the proposed solution, which needs clarification. Do we disable transformations for synced patterns or just reduce the options? If the latter, then what options should remain?

[Rishit30G]

Thanks for addressing @Mamaduka , I was planning to limit the options once we get confirmation on which ones to keep
So meanwhile I was trying to find ways to limit the options, but the thing was that I wasn't able to find where the options are coming from

[Mamaduka]

@Rishit30G, have look at packages/block-editor/src/components/block-switcher/index.js file. It is responsible for rendering transformations.

[Rishit30G]

Thanks, I explored couple of helper functions in this order from selector.js and factory.js:
getPossibleBlockTransformations() -> getBlockTypesForPossibleFromTransforms() -> isPossibleTransformForSource()
But I only came to a conclusion that any changes made to them can globally affect the other transformation, curious to know how can we isolate changes specific to template transformations

[talldan]

Easiest thing might be to add an isMatch property to the transform definitions to exclude the 'core/block'.

The details block already has similar to prevent wrapping itself in another details block:

gutenberg/packages/block-library/src/details/transforms.js

Lines 12 to 16 in 467e4a2

	isMatch( {}, blocks ) {
	return ! (
	blocks.length === 1 && blocks[ 0 ].name === 'core/details'
	);
	},

[talldan]

@Rishit30G Is this something you're still interested in working on?

[Rishit30G]

Hi @talldan
Yes, I would still be interested to work on it, sorry for the delayed response 🙇🏻
Incase I'm not able to by today, I would pass it back
Thanks

[Rishit30G]

Thanks for sharing insights @talldan 🙇🏻
I have tried implementing it, please check the screencast below:
https://github.com/user-attachments/assets/75ca4f73-bd5b-4e51-984e-edfaae932c70
So for now, I have tried to removing the details block from the core/block