Inserter: Incorrect available inner blocks in inserter

[sirreal]

The available blocks in the main inserter may be inaccurate when using the following steps:

• Use a Columns block.
• The active or selected block should be a Column.
• Access the quick inserter by clicking the + block appender in the selected Column.
• Click "Browse all" button at the bottom of the quick inserter.
• The main inserter is opened.
• Only Column is available, in the main inserter. A Column block should allow arbitrary blocks to be inserted.

This manifests with blocks like Columns that have an expected structure (Columns -> Column -> Arbitrary blocks). Only the Column block is available, rather than the arbitrary blocks expected at the appender location.

Visual flow

Add a Column and select it

Click the + appender in the Column

Click "Browse all"

Only the Column block is available.

---

Editor version:

• WordPress version: 5.4
• Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default? Gutenberg plugin
• If the Gutenberg plugin is installed, which version is it? 8.7

Related: #24403

[youknowriad]

I believe this is not a bug, this is the intended behavior of the global inserter because it inserts blocks after the selected block and the only possible block to be inserted after a column, is another column :)

So I think we should close this issue and focus on #24403 instead.

[sirreal]

I was trying to insert content into my column by clicking the + button. The fact that a Column was selected before shouldn't impact the available blocks, and indeed it does not in the quick inserter. Only when the global inserter is accessed via "Browse all."

The fact that different blocks are available in these two steps where I've clicked "Browse all" does seem like a bug to me:

Many available blocks, let's browse all of them 🧐	1 available block 😕

It's easy enough to find yourself in this state. By missing the appender click target you select the column, then click the appender to insert.

[youknowriad]

The global inserter always works that way. you can't make a difference in its content between a "paragraph" block being selected and "columns" (container) block being selected otherwise it becomes confusing.

• How do I insert a block after a columns block if we switch its behavior to inserting inside the currently selected block
• What does it mean to insert inside a selected block if that block is not a container?

I think the behavior of the global inserter is correct but the issue you raised is just a consequence of #24403
The quick inserter (since it's contextual) can work differently depending on where it's opened. if it's opened between blocks, it will insert between blocks, if it's opened inside a container block (appenders), it will insert inside the container;

[sirreal]

I agree with focusing on #24403. It's possible that addressing that issue may improve this.

The behavior of the global inserter may be correct from a technical perspective, especially for someone with deep technical familiarity with the inserter and appender. I don't have that deep understanding 🙂

I have a hard time imagining that a user would want or expect to be presented a Column block when following the steps I've described. Consider this flow, where we have a different set of inner blocks that are only valid children of a specific parent. When we go to append to a Column and "Browse all," we're presented with children of the other block.

Shouldn't the global inserter use the appender's location to determine the block it presents?

[youknowriad]

Shouldn't the global inserter use the appender's location to determine the block it presents?

the global inserter is its own piece of UI independent of the presence of the appender or other inserters on the page, it can only rely on the state of the block editor to dictate its behavior. Right now (and from the very first day of Gutenberg), the behavior has always been: insert after the selected block.

We can of course think of different rules here but these rules should be consistent and they shouldn't depend on the presence of other UI elements on the page.

[youknowriad]

insert after the selected block also means: populate the block inserter with the blocks that can be inserted inside the direct container of the selected block.

[simison]

User might expect all the blocks appear in this state that can be inserted under "column", and pressing them would auto insert column block and the selected block inside it?

[sirreal]

Right now (and from the very first day of Gutenberg), the behavior has always been: insert after the selected block.

It sounds like this is where the confusion and challenge come from. The presence of the appender implies there are no blocks in the column, therefore the inserter has nothing to insert after.

[youknowriad]

It sounds like this is where the confusion and challenge come from. The presence of the appender implies there are no blocks in the column, therefore the inserter has nothing to insert after.

There are no blocks inside the "column" block but there are blocks inside the "columns" block (aka the selected column block)

[chvillanuevap]

My 2 cents. I feel this is a really bad UI -- it's super confusing! What else is the user supposed to do? You can't expect the user to search blocks by name at first because they won't remember/know all. Of course they are going to click "Browse All" expecting to see what blocks can be inserted in the column. The old appender (prior to 5.5) worked so much better. I think this new UI works well in the context of adding content to a post, but horribly in the context of inner blocks.

[chvillanuevap]

Is there a filter to show more than 6 blocks (like in block variations, which show all variations available)? Then I can hide the "Browse All" with CSS.

[hawkmusician]

I have to agree with all the comments above saying that the global inserter's behaviour is extremely confusing. It makes no sense to ask the user to click on "Browse All" to find out that he won't be inserting the block in the same place as if he'd used the quick inserter...

[rebeccahum]

Can you confirm if this is still happening on the latest version of Gutenberg? Unable to reproduce on 5.5.1 or Gutenberg 9.0.

[chvillanuevap]

Yes. I'm using 5.5.1 and 9.0, and it's still there. It's hard to notice with core blocks, but the appender button + clicking on Browse All shows the available blocks for the parent block, not the inner block group. In my photo, the parent inner block is template locked, and when I click on the inner block inserter inside this parent block, it doesn't show me the available blocks.

[chvillanuevap]

I explained the issue in more detail in #25718.

[chvillanuevap]

@rebeccahum I reproduced this bug doing the following:

1. Add a new post.
2. Add "Social Icons" block from core.
3. Click on the "+" appender button inside the social block to add another profile.
4. Click on "Browse All".

What I would expect is for the social icons to show up in the block directory, but instead the regular core blocks show. I find this very confusing.

I have WordPress 5.5.1 installed, as well as Gutenberg 9.1.1. No other plugins are installed.

[rebeccahum]

Got it, I'm able to reproduce now — so you're expecting the child blocks to show up under "Browse All".

[chvillanuevap]

Yes. The issue seems to be related to the way the global inserter works, as @youknowriad said above. This issue with the global inserter also applies to #24403 and #26046, and extends to block patterns in #26281. I believe the root problem of all of these issues is the way the global inserter.

[talldan]

This should be fixed now that #24403 has been solved, so closing. If anyone can still reproduce then would be happy to reopen.