Always provide user-visible feedback for errors instead of only logging to the console. This ensures users are aware of failures and can take appropriate action. This is especially important for:
Always provide user-visible feedback for errors instead of only logging to the console. This ensures users are aware of failures and can take appropriate action. This is especially important for:
Example converting console-only error to user feedback:
// Before
const handleAction = async () => {
try {
await someAsyncOperation();
} catch (err) {
console.error(err); // Silent failure
}
};
// After
const handleAction = async () => {
try {
await someAsyncOperation();
} catch (err) {
console.error(err);
showErrorToast("Operation failed", err.message);
// or
setError("Failed to complete action. Please try again.");
}
};
For mutations, implement both success and error handlers:
const mutation = api.something.mutate.useMutation({
onSuccess: () => {
showSuccessToast("Operation completed");
// Update UI state
},
onError: (e) => {
showErrorToast("Operation failed", e.message);
// Preserve UI state
}
});
Enter the URL of a public GitHub repository