Browse all from Block inserter displayed for Social Icons can easily confuse user

[bobbingwide]

Describe the bug

• The block inserter displayed when the user clicks on the Add block icon inside the Social Icons block is different from that dispayed when the user has selected a Social Icon variation.
• The first 6 variations are displayed: WordPress, 500px, Amazon, Bandcamp, Behance and Link.
• This looks the same as for both.
• It's not scrollable, so you either have to search: trying a, b, c, ... z, 0, ... 9 or choose Browse all
• But when you choose Browse all, the main inserter displayed when the Social Icons block is selected doesn't display the variations.
• To get Browse all to work the selected block must be a Social Icon block.
• And you have to be lucky... attempting to reproduce the problem can lead to further unexpected results.

To reproduce Steps to reproduce the behavior:

1. Add a new post
2. Insert the Social Icons block
3. Click on the block inserter icon
4. See the first 6 items listed: WordPress, 500px, Amazon, Bandcamp, Behance and Link
5. Choose Browse all
6. The main block inserter doesn't display the Social Icons variations.

Expected behavior

1. Popup block inserter should be scrollable as well as searchable.
2. The main block inserter, displayed after choosing Browse all, should display the Social Icon variations when the selected block is either the Social Icons block or a Social Icon block.

Screenshots

If applicable, add screenshots to help explain your problem.

Editor version (please complete the following information):

• WordPress version: [e.g: 5.3.2] 5.5.1
• Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default? [e.g: "gutenberg plugin", "default"] Guenberg plugin
• If the Gutenberg plugin is installed, which version is it? [e.g., 7.6] 9.0.0

Desktop (please complete the following information):

• OS: [e.g. iOS] Windows
• Browser [e.g. chrome, safari] Chrome
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context

• To report a security issue, please visit the WordPress HackerOne program: https://hackerone.com/wordpress.

[talldan]

@bobbingwide Thanks for reporting this. There's a similar report here about the 'Browse All' part of your issue: https://github.com/WordPress/gutenberg/issues/24403

Do you think this is close enough to be considered a duplicate?

[bobbingwide]

Do you think this is close enough to be considered a duplicate?

I came across that problem as well! When the wrong block inserter is displayed and the user chooses a block that looks like the right one ( e.g. WordPress or YouTube embed blocks ) then the block is inserted before or after the currently selected block. It's just adding to the confusion.

In this issue the problem is that the wrong list of blocks are being displayed in the main block inserter. This is what the right block inserter looks like.

BTW: I've a feeling that the Reusable tab shouldn't be displayed in this situation.

[bobbingwide]

I've also experienced the wrong inserter being displayed when the selected Social Icon is the WordPress icon. In this case, when I search for word I get to see a number of blocks... none of which are the WordPress Social Icon block variation. PS. The first two are my own.

[jordesign]

To my understanding this is resolved now - so I will close the issue.