calcite-design-system
calcite-design-system copied to clipboard
Esri
Enhancement: calcite-alert - options for seeing queued messages without dismissing them
Description
We are using the <calcite-alert> in order to display errors, warnings or success messages. However, it has been reported that collapsing all the messages into a single one (with the indicator showing how many messages are present) is not ideal since it forces users to close messages in order to see what other messages may be available.
It would be interesting to have a way of looking at other messages without dismissing them. Two main possibilities to explore:
- Allow expand a queue to view all currently queued alerts.
- Prop to decide on whether to stack or queue alerts, style guardrails to prevent 20 alerts from taking over an entire page.
CC @yannikmesserli
SVCH
@hccampos here is an initial comp - spacing, interaction, display not finalized - would this more or less solve (obviously lots to question around .. max number displayed, scrolling when "too many alerts", do you display the chip count while expanded, etc.):
@jcfranco would this necessitate the creation of an "alert-wrapper" component to handle positioning and "added UI" to handle multiple (related - https://github.com/Esri/calcite-components/issues/3033)?
IMHO, that looks nice @macandcheese, but I'll defer to @janett-baresel and @yannikmesserli on this one.
Thanks all. Will continue to work and iterate on this and ping this thread when more final designs are ready for testing / feedback.
@jcfranco - I think you mentioned you had an idea for this that wouldn't require a wrapping calcite-alerts / calcite-alert-group.
Could you expand on that (alert queue pun alert 🚨 )? Multiple items may need to be positioned in a single fixed container along with "extra UI elements", I am not sure the best way to achieve that without some kind of wrapping parent to control placement and manage expand / close and associated animations.
I am much in favor of a "dismiss all" button by the way. This scene is a great example... https://arcg.is/1muLOm. 23 errors for loading layers. To get rid of the error messages and use the slides, i have to click 23 times.
Additional context and suggestions were made in: https://github.com/Esri/calcite-components/issues/6366#issuecomment-1407114777
Which should be combined / considered alongside the previous suggestions.
Adding ArcGIS Online label to this issue as #6366 was an issue reported by Online
Final designs are available in Figma.
Figma file: https://www.figma.com/file/m6xhdPVaEO4VjnA7XfIHya/Alert-Queue-Stacking-%5Bissue-2835%5D?node-id=1%3A2604&t=RrRRvJe3rqulHGHT-1
Direct link to the prototype: https://www.figma.com/proto/m6xhdPVaEO4VjnA7XfIHya/Alert-Queue-Stacking-%5Bissue-2835%5D?node-id=276-37805&viewport=-308%2C1974%2C0.07&scaling=scale-down-width&starting-point-node-id=276%3A37805
Depending on the solution, determine the nature of the risk if should be part of the September or October release to coincide with the Online release in October.
@macandcheese Belated update, but I think we may be able to avoid the wrapper by expanding on what you were describing where alert would have some sort of internal container/component that would take care of the updated queue experience. Do you think we could team up to work on a prototype next week? 🤜💥🤛
We'll need to adjust the milestone for this one. cc @geospatialem