Description

Context

Top issues identified during a usability pass:

• Drag and drop only actions
• Lack o visual aids in drag and drop (there's only text)
• Important information that can be hidden by very tall navigation structures
• Lack of meaningful options to configure the navigation, which are available in the Tree Macro

Proposal

The proposal aims to mitigate the problems pointed above.

• The drag and drop only operations are changed to buttons in the tree itself. Besides the pin icon.
• To provide a better understanding for the user, the term "Excluded" pages is changed to "Hide" and icons to reflect this change (eye icon)
  • The visual design of each hidden page is also updated to reflect the hidden condition.
• The introductory text is moved to the top of the page
• At the start of every "movable" line has a drag symbol before it
• Add new config options described in https://extensions.xwiki.org/xwiki/bin/view/Extension/Document%20Tree%20Macro#HExamples
  • We could bring them all, but most of them are not immediately related to the user experience of using the menu. The ones being proposed are mostly on/off options that can be easily understood.

Desktop View

Hiding and showing pages (Exclusions)

New options

To improve the admin experience and allow for easier customization, we bring some of the options listed in https://extensions.xwiki.org/xwiki/bin/view/Extension/Document%20Tree%20Macro#HParameters

We could bring all of them of course, but the excess of information can also damage the experience, so the idea is to bring mostly on/off switches and also options that were requested at different Jiras (https://jira.xwiki.org/browse/XWIKI-21841).

All "exclude" options were renamed to Hide to better explain the effects on the UI .

Mobile View