Refactor error handling utilities

- Replace `showError` with a more versatile `showToast` utility.
- Add specific toast functions (`showErrorToast`, `showSuccessToast`, etc.) for better message handling.
- Remove `showError.ts` and migrate logic to `showToast.ts` for cleaner structure.
- Update `ErrorBoundary` and `useErrorHandler` to use the new `showToast` functions.
This commit is contained in:
2025-07-11 19:15:08 +02:00
parent 18014ce9f0
commit c99e09056c
4 changed files with 180 additions and 127 deletions

View File

@@ -25,6 +25,7 @@ import {NewCustomerModal} from "@/components/customers/modal/NewCustomerModal";
import {Customer} from "@/services/customers/entities/customer";
import Link from "next/link";
import {useErrorHandler} from "@/components/error-boundary";
import {showError, showInfoToast} from "@/lib/ui/showToast";
export default function CustomersPage() {
const [customers, setCustomers] = useState<Customer[]>([]);
@@ -39,14 +40,17 @@ export default function CustomersPage() {
fetch('/api/customers')
.then(async (response) => {
if (!response.ok) {
showError("Failed to fetch customers data")
throw new Error(`Failed to fetch customers: ${response.statusText}`);
}
return response.json();
})
.then((data) => {
showInfoToast("Customers data loaded")
setCustomers(data);
})
.catch((error) => {
showError("Failed to fetch customers data (1)")
handleError(error);
setCustomers([]);
})

View File

@@ -1,7 +1,6 @@
"use client";
import React from "react";
import { showError } from "@/lib/ui/showError";
import {Button} from "@/components/ui/button";
import {
Dialog,
@@ -50,9 +49,6 @@ export class ErrorBoundary extends React.Component<
error,
errorInfo,
});
// Show error toast
showError(error);
}
handleReset = () => {
@@ -96,7 +92,8 @@ interface ErrorDialogProps {
function ErrorDialog({error, onReset, open}: ErrorDialogProps) {
return (
<Dialog open={open} onOpenChange={() => {}}>
<Dialog open={open} onOpenChange={() => {
}}>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>Ein Fehler ist aufgetreten</DialogTitle>
@@ -128,10 +125,7 @@ function ErrorDialog({ error, onReset, open }: ErrorDialogProps) {
// Hook for handling async errors
export function useErrorHandler() {
const handleError = React.useCallback((error: unknown) => {
return React.useCallback((error: unknown) => {
console.error("Async error caught:", error);
showError(error);
}, []);
return handleError;
}

View File

@@ -1,16 +0,0 @@
// lib/ui/showError.ts
import {toast} from "sonner";
export function showError(error: unknown, fallback = "Ein unbekannter Fehler ist aufgetreten") {
let message: string;
if (error instanceof Error) {
message = error.message;
} else if (typeof error === "string") {
message = error;
} else {
message = fallback;
}
toast.error(message);
}

View File

@@ -0,0 +1,71 @@
// lib/ui/showToast.ts
import { toast } from "sonner";
// Generic toast function
export function showToast(message: string, type: 'success' | 'error' | 'info' | 'warning' = 'info') {
const options = {
dismissible: true,
closeButton: true,
};
switch (type) {
case 'success':
toast.success(message, options);
break;
case 'error':
toast.error(message, options);
break;
case 'info':
toast.info(message, options);
break;
case 'warning':
toast.warning(message, options);
break;
default:
toast(message, options);
}
}
// Specific toast functions with appropriate error handling
export function showErrorToast(error: unknown, fallback = "Ein unbekannter Fehler ist aufgetreten") {
let message: string;
if (error instanceof Error) {
message = error.message;
} else if (typeof error === "string") {
message = error;
} else {
message = fallback;
}
toast.error(message, {
dismissible: true,
closeButton: true,
});
}
export function showSuccessToast(message: string) {
toast.success(message, {
dismissible: true,
closeButton: true,
});
}
export function showInfoToast(message: string) {
toast.info(message, {
dismissible: true,
closeButton: true,
});
}
export function showWarningToast(message: string) {
toast.warning(message, {
dismissible: true,
closeButton: true,
});
}
// Backward compatibility - keep the original showError function
export function showError(error: unknown, fallback = "Ein unbekannter Fehler ist aufgetreten") {
showErrorToast(error, fallback);
}