v0 prompt to add error handling
Run this against an existing v0 generation and it retrofits failure paths everywhere: error boundaries per route, inline retry for fetches, rollback for optimistic mutations, and forms that keep user input. A dev-only debug panel with failure toggles is included, so you can see each error state without unplugging your network.
Last updated
Take the current generation and retrofit error handling end to end. Nothing may fail as a blank screen, a spinner that never resolves, or a silent console log.
Boundaries: wrap each route segment in an error boundary showing a short human message and a reset action, with no stack traces exposed to the user.
Data fetching: every fetch gets a failure branch rendered inline where the data would have appeared, with a retry that refetches only that section. Add an AbortController timeout of 10 seconds so a hung request becomes a visible error instead of an eternal skeleton.
Forms: submit failures render under the submit button, name what failed, and preserve everything the user typed. Field-level validation errors sit under their fields and clear when the field changes.
Mutations: optimistic updates roll back on failure and raise a toast naming the action that failed, like "Couldn't archive the item", never a bare "Something went wrong."
Route handlers, if this generation has any: wrap each in one shared helper that catches thrown errors and returns JSON { error, message } with an appropriate status, treating an unparseable body as a 400.
Offline: listen for the browser's offline and online events and show a dismissible banner while disconnected. Queue nothing, just inform.
So I can verify each path, add a dev-only debug panel with toggles that force fetch failure, mutation failure, and slow network. End by listing every file you changed and which failure path each change covers, so I can review before accepting.Same task in other tools
Questions about this prompt
Will v0 apply this across a large generation in one pass?
It tries, and misses corners on big projects. If your generation has more than a handful of screens, run the prompt scoped to one area at a time, forms first, then fetches, then mutations, checking the debug panel between passes.
How do I actually see the error states in the preview?
Use the debug panel the prompt requires. Flip "force fetch failure" and navigate around; every section should show its inline error and recover on retry. If a section still shows an infinite skeleton, name that component in your next message.
It made every message "Something went wrong." Can I fix that?
Yes, that is v0 falling back to a generic copy string. Reply with the exact pattern you want, such as "error messages must name the action and the affected item", and ask it to sweep the existing messages to match.