Enhance NewCustomerModal with callback support and toast notifications

- Add `onCustomerCreated` callback to refresh customer list after creation.
- Integrate `showInfoToast` and `showSuccessToast` for validation and creation feedback.
- Prevent closing modal on backdrop click; add explicit cancel button.
- Refactor `addCustomer` to use `callApi` and centralized routes.
- Simplify customer fetching logic in `CustomersPage` with reusable function.

internal_frontend/app/customers/page.tsx

@@ -35,28 +35,28 @@ export default function CustomersPage() {
     const pageSize = 15;
     const handleError = useErrorHandler();
 
-    useEffect(() => {
+    const loadCustomers = async () => {
         setLoading(true);
-        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([]);
-            })
-            .finally(() => {
-                setLoading(false);
-            });
+        try {
+            const response = await fetch('/api/customers');
+            if (!response.ok) {
+                showError("Failed to fetch customers data");
+                throw new Error(`Failed to fetch customers: ${response.statusText}`);
+            }
+            const data = await response.json();
+            showInfoToast("Customers data loaded");
+            setCustomers(data);
+        } catch (error) {
+            showError("Failed to fetch customers data (1)");
+            handleError(error);
+            setCustomers([]);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    useEffect(() => {
+        loadCustomers();
     }, [handleError]);
 
     const filtered = useMemo(() => {
@@ -114,7 +114,7 @@ export default function CustomersPage() {
                     <CardContent className="space-y-6">
                         <div className="flex flex-col md:flex-row justify-between items-center gap-4">
                             <Input placeholder="Suche" value={search} onChange={(e) => setSearch(e.target.value)}/>
-                            <NewCustomerModal/>
+                            <NewCustomerModal onCustomerCreated={loadCustomers}/>
                         </div>
 
                         {customers.length === 0 && loading ? (