Error warning
Error warnings are used to tell users about unrelated errors in another part of the application, or a third party service.
When to use this pattern
Error warnings are used to tell users about unrelated errors in another part of the application, or a third party service. They do not block the user from completing the current task.
An unrelated error should be non-intrusive, but the user should still be told so they can make an informed decision on whether to continue or not.
Example:
Slack integration error You won’t receive any Slack notifications about this environment until it’s fixed.
When not to use this pattern
Do not use an error warning when the error is directly related to the current task. Instead, use the
error page pattern or the error banner pattern.Do not use an error warning for validating information the user has entered, instead use the validation errors pattern.
How it works
Use the EuiToast component, with the props:
color="danger"iconType="alert"
Use the title prop to tell the user what went wrong, and <p> tags to add any additional context.
Help improve this pattern
To help make sure that this page is useful, relevant and up to date, you can join our #ux‑wg‑patterns discussions on Slack.