menu component with text

[azim-b]

One of the new components introduced in wave v0.20.0 is ui.menu(), which with the commands looks quite useful.

It supports image and icon but one of the things that I think may be missing is an option to add just text. This seems trivial so I suppose that the option to add "just text" has been omitted intentionally? Or, it's there but I missed it.

The use cases I'm considering are, for example:

Instead of 3 ui.tabs "Deploy", "Resource", and "Monitor", I could use just 1 ui.menu called Model Ops and when I hit the down arrow, it would be show me these 3 options (i.e. ui.commands).

This would make the navigation menu UI much cleaner. One of the apps that I have been working on have so many features now that it makes use of 9 ui.tabs.

So, for the ui.menu, the options right now IIUC are: no text, icon, and image. Could we add an option to allow text, but keep it as an optional parameter (so that it could be used for the first option as well, i.e. no text)?

Please let me know your thoughts.

[mturoci]

Instead of 3 ui.tabs "Deploy", "Resource", and "Monitor", I could use just 1 ui.menu called Model Ops and when I hit the down arrow, it would be show me these 3 options (i.e. ui.commands).

Having menu for 3 tabs is overkill and worse UX due to extra clicks needed and worse discoverability of navigation.

This would make the navigation menu UI much cleaner. One of the apps that I have been working on have so many features now that it makes use of 9 ui.tabs.

9 is not too many IMO. Especially if your intention is navigation I would suggest going with a side nav instead. The reason is simple - navigation possibilities are not hidden from users at first glance and are required to do just a single click instead of 2+ (click menu first, then pick what I want).

The commands are more suited for (as the name suggests) actions when there are way too many of them.

Final note: Menu with text should be possible now with the use of ui.inline([text, menu]), but it's advised to be used with caution in order not to make the UX worse.

[azim-b]

ui.inline([text, menu]) didn't work well because the text is not clickable.

In any case, based on your suggestion that a menu for 3 items is worse UX, we'll go with side nav instead. Thanks.

[mturoci]

ui.inline([text, menu]) didn't work well because the text is not clickable.

if you need clickability, you can go with link/button(link=True).

[azim-b]

ah, good idea!