Allow selecting from all available Pages when adding to Navigation block

[getdave]

Problem

As originally illustrated in https://github.com/WordPress/gutenberg/issues/38121, users can find it difficult to locate the correct Post (typically Pages) when adding links to the Navigation block.

Whilst the search in the Link UI has been improved, it still requires the user to recall the name of the Page in order to be able to search for it by string. This can cause issues which become pronounced on larger sites with lots of administrators.

Proposal

I propose we introduce an ability to see the full tree of all the Pages on your website directly from the Link UI interface in the Navigation block.

Similar proposals have been made previously including:

• https://github.com/WordPress/gutenberg/issues/38121#issuecomment-1018249500
• https://github.com/WordPress/gutenberg/issues/50831

My proposal differs in that I recommend we do not attempt to shoe horn this UI into the search results of the Link UI as presenting a hierarchical tree in this view which cause a lot of visual issues (not to mention technical overhead).

Instead I suggest we re-use the established UI pattern used by the Add block interface which exists in the Navigation block today. This can be repurposed (roughly) as follows:

Once you click "Select Pages" you would see a hierarchical tree of all the Pages on your site perhaps somewhat similar to:

We could even consider a "Bulk Add" mechanic for this interface.

Benefits

• Avoids over-reliance on search to find the Page you wish to add.
• Makes it easier for users to identify the Page they wish to add - especially if Pages have the same name but are under different "trees".

---

Create a means to see all your Pages in a single view and pick the one you want rather than having to rely on search.

@richtabor On this point, I wonder whether we could expand upon the UX pattern introduced into the Link UI with the Add block area, to add a new option called Select {Post Type} (i.e. Select Page).

When clicked, it would show a tree representation of all your Pages which you could pick from. I believe that a dedicated view is best because trying to shoehorn in a hierarchical, nested view into the Link UI search results will only add further complication.

In envisage this include a UI similar (but not identical) to that I mocked up in this Issue.

Originally posted by @getdave in #38121

[getdave]

cc'ing @richtabor @jasmussen who have both been heavily involved with Link UI and Navigation.

[jasmussen]

Here's an older prototype, which hasn't been shared beyond the public Figma files because it diverges a bit from existing link UI explorations. But in case it inspires fresh ideas, it seems related.

[getdave]

@jasmussen Perfect. That Figma is exactly what I had in mind here. Here's a video capture:

https://github.com/user-attachments/assets/7d487b16-f141-4214-aa15-446e8e7d25b8

I propose implementing the choose from all Pages element first.

[rinkalpagdar]

Once you click "Select Pages" you would see a hierarchical tree of all the Pages on your site perhaps somewhat similar to:

Hello @getdave, What if there are thousands of pages? Then, the hierarchical tree will be too long. I think it might impact the UI. Please share your thoughts.