Sonner Promise 3 - Promise toast with error

Pro

Promise toast that surfaces the rejected error in the sonner message.

Shadcn Sonner Promise 3 component

Component data

ID
sonner/sonner-promise-3
Access
pro
Created
Oct 5, 2025
Type
example
Libraries
Radix UI, Base UI, React Aria

Sonner Promise 3 component design & features

This sonner example uses the shadcn Sonner component with toast.promise and an error callback that reads the rejection. The toast starts in a loading state and then shows the error message from the failed request.

This pattern belongs on saves and network calls where the sonner component should report the actual failure, not a generic error string.