Description

• Context
  • Current Issues
• Discussed Proposal
• Initial Proposal

Context

The objective of this proposal is to improve the visual layout and usability of the AWM actions

Current Issues

These actions currently have the following issues regarding visual layout and usability
- Excessive use of vertical space
- Component use is not standard with other XWiki controls
- Its icons are conflicting on the "delete" actions
- The primary Action "Add" is somewhat hidden from the user, taking into account that it is out of alignment with the content area of the page

Discussed Proposal

The proposal below is updated from the discussions had in the Forum.

• All buttons should be placed in the standard page menu.
• The Create button should automatically create a new entry on the app (page with the right template), instead of leading to the create page UI.
• All other buttons should be placed as options under the kebab button.

New Icons to be used in the kebab menu:

Initial Proposal

The changes proposed below are an alternative for the controls based on issues previously mentioned

Excessive user of vertical space

This can be solved by using the concept of a "toolbar" for these actions. All actions will align horizontally instead of vertically. To promote the main action, the default primary style of button of XWiki will be used.

To keep this section well integrated and cohesive, a light gray background should be used so that related components don't get lost in space.

Also, because most actions on this area are supportive and not primary (edit app, delete entries, delete app) there's the possibility to hide them from view initially and provide them as a dropdown accessed via the "cog" icon.

Defining the primary action

The primary action in these apps in day to day use is the "Add Entry" option. But this action is almost hidden in plain sight in the interface, by its positioning as well as by its visual style. 

Component used are not standard with other XWiki controls

To remedy the non-standard use of links in all caps, the proposal is to change the component to a button OR at least a link stylized as button.  

Conflicting Icons

For actions that have a clearly defined icon, we can continue using them, like a trashcan for deletion. 

For the action of "Delete All Entries" we can rename it to "Clear All Entries" and leave the action without an icon.

Final look of the proposal