Handle heavily nested items in the Nav Editor screen

[draganescu]

We have a problem on the navigation screen when menus are deeply nested: the fixed size of the navigator will lead the nested items more and more to the right until they overflow.

So far we've had some ideas like increasing the width of the navigator (to the detriment of the navigation block) or to enable/use horizontal scrolling inside the navigator (not a very popular pattern for understandable reasons).

A new approach that surfaced in our discussions is to add the option to drill down menu items so that we could limit the depth available at any moment in the navigator.

Would it be interesting to explore this either as an implementation experiment or as a mock-up?

This would be complementary to the expand and collapse leaves of parent branches (a feature to be implemented) as an option to make nesting manageable, or it could just as well replace the expand and collapse feature as the better way to handle nesting in horizontally constrained spaces.

cc @shaunandrews

[shaunandrews]

I also posted this in the larger design issue (#24029): Here's the design for how to handle deeply nested items in the list view:

[getdave]

Noting here for the purposes of prioritisation that the existing Navigation screen seems to have a hard limit of 11 levels of nesting. After that you cannot nest further.

Screen.Capture.on.2021-08-23.at.11-21-38.mp4

Now the new Navigation screen is in vertical orientation it does in fact handle nesting but there are UI/UX refinements needed.

Therefore @draganescu @javierarce would you object to redefining this Issue to track the need to implement these refinements?

Or perhaps we can close this one out and create a new Issue to track the refinements?

[getdave]

Turns out if you know about the "list view" feature of the Nav block then you can see all nested levels:

Screen.Capture.on.2021-08-23.at.14-23-59.mov

This makes me think the Issue is now "Make the list view more obvious" rather than solving the nesting issue.

I could be wrong - what say you @draganescu and @javierarce?

[javierarce]

This makes me think the Issue is now "Make the list view more obvious" rather than solving the nesting issue.

As a big proponent of the top bar, I'd say that that could be the ideal place to put that icon (so +1 to your last suggestion).

And I think we could address the "UI/UX refinements" of the menu items you mentioned here in the issue #34035

[draganescu]

I think we should close this issue as we'll just inherit what the listview supports.