Pattern overrides: The image block toolbar has no separator before the Reset option

[carolinan]

Description

Blocks inside synced patterns that have override enabled have a reset option in the block toolbar.
The heading, paragraph and button block all have a separator in the toolbar between the block options and the reset (they all use the rich text options), but it is missing from the image block.

Step-by-step reproduction instructions

Create a synced pattern with an image block inside.
Edit the original pattern, select the image, open the Advanced panel in the settings sidebar and enable overrides. Save,
Go back to where you had placed the pattern.
Select the image and view the toolbar.

Screenshots, screen recording, code snippet

Environment info

Gutenberg trunk
WP 6.6-beta1-58338, with the beta tester plugin.

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

No

[amitraj2203]

Hi @carolinan,

As far as I know, the issue is occurring because the BlockControls group is set to other in both the ResetOverridesControl and the Image block. In the image block, the BlockControls that includes options for Replace, Alt, and Title also has its group set to other, which is why they are combining.

If we change the BlockControls's group prop to block in Image, the crop icon button will move when clicked (since the crop icon has group="block"), which is not ideal.

Screen.Recording.2024-06-05.at.2.06.23.PM.mov

The remaining options are inline and parent, but I'm not sure which would be the best choice here. Or maybe some different approach.

[SantosGuillamot]

@amitraj2203 is right that the problem is caused because those controls are all using group "other". I've started this pull request with a potential fix: link.