Implement Notification UI
Created by: mray
This is a proposal UI for the notification system as described in #867 and based on the Card based Interface #739 . It consists of three main screen mockups that should capture most usage throughout Plinth.
Notifications appear in three places:
- On the bottom part of the header in form of a summary
- At the top part of cards in form of a summary
- Inside cards in form of content
"Summaries" are single lined entries that link to actual notification content and can hold partial information of individual notifications (ideally the most relevant). Summaries may represent multiple notifications, indicated by a number greater than 2.
"Content" covers the whole content of one individual notification. Next to the actual message it shows creation date (or last update), its source, interaction possibilities like an "X" to dismiss or archive a notification or indications like progress bars.
My mockups assume only two types of notifications "warning" and "note". They are color-coded red and blue. The actual amount of different types should be extensible though and try to cover as few as possible and as many as needed, depending on experience with module developers.
1. Apps screen
Like every screen, the apps screen features the header summary at the very top. This summary contains all current notifications (in this example 4) and links to the notification module (2.).
Cards can have notification summaries in their top part like title, close button, progress bar. Those summaries link to the Cards notification tab (3.).
2. Notification Module
The notification module would be a module with the only purpose to maintain an overview of all notifications. It would provide access to notification content of all apps in one place and allow to access archived notifications. It also features the option to sort by different criteria as source, priority or date.
3. Apps Notification tab
The app notification tab contains only notifications from its very own app.
The respective app card has a notification summary on its top that links to the notification tab.
... what is missing? What does not work?