Alerts provide valuable feedback to the user. Toasts are often used to provide the messages. You know toasts. Those little messages that pop up from the bottom of the screen for just a few seconds then disappear. They’re unobtrusive and polite but in my opinion not appropriate for displaying error or warning messages in an enterprise application. The big problem I have with them is they quickly disappear making it difficult for the users to get a screenshot or just study the message for clues to what they should do. So the only time I think a toast is appropriate is when reporting success, such as a successful save.
Error and warning messages, in my opinion, should be more prominent and persist until the user dismisses the message or the user performs another action that makes the message irrelevant. So of course I’ve built a component to do just that and appropriately named it AlertBCA. The component utilizes the Bootstrap Alert styling which provides for several colors to associate with the type of message. Danger red for errors of course, warning yellow for warnings, and info blue for additional information as examples.
The appearance of the alerts is open to extension. Just create your own style classes and pass the class for the css styling in as a parameter in the components Add method along with the message.
Check out the AlertBCA component at the Blazor Component Authority Demo App for a working example and the source code. Please leave a comment, I would love some feedback.
Thanks for reading.
