Gitlab-Migration/rheinsw-mono-repo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Introduce ErrorBoundary component for improved error handling

Browse Source 
- Add `ErrorBoundary` component to handle rendering fallback UI during errors.
- Integrate `ErrorBoundary` into main layout and critical pages for global error handling.
- Create `useErrorHandler` hook to handle async errors consistently across components.
- Refactor `NewCustomerModal` and `CustomersPage` to leverage `useErrorHandler` for improved error management.
- Add a fallback dialog UI for user-friendly error reporting and resolution.
This commit is contained in:
Thatsaphorn
2025-07-11 19:06:07 +02:00
parent 2a95efb75f
commit 18014ce9f0
4 changed files with 196 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
internal_frontend/app/layout.tsx
View File

@@ -9,6 +9,8 @@ import {DynamicBreadcrumb} from "@/components/dynamic-breadcrumb";
import {getServerSession} from "next-auth";
import LoginScreen from "@/components/login-screen";
import {authOptions} from "@/lib/api/auth/authOptions";
import {ErrorBoundary} from "@/components/error-boundary";
import {Toaster} from "sonner";
export const metadata: Metadata = {
title: "Internal | Rhein Software",
@@ -25,42 +27,49 @@ export default async function RootLayout({
return (
<html lang="de" suppressHydrationWarning>
<body>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{session?.accessToken ? (
<SidebarProvider
style={
{
"--sidebar-width": "calc(var(--spacing) * 72)",
"--header-height": "calc(var(--spacing) * 12)",
} as React.CSSProperties
}
>
<AppSidebar/>
<ErrorBoundary>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{session?.accessToken ? (
<SidebarProvider
style={
{
"--sidebar-width": "calc(var(--spacing) * 72)",
"--header-height": "calc(var(--spacing) * 12)",
} as React.CSSProperties
}
>
<AppSidebar/>
<SidebarInset>
<header
className="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12">
<div className="flex items-center gap-2 px-4">
<SidebarTrigger className="-ml-1"/>
<Separator
orientation="vertical"
className="mr-2 data-[orientation=vertical]:h-4"
/>
<DynamicBreadcrumb/>
</div>
</header>
{children}
</SidebarInset>
</SidebarProvider>
) : (
<LoginScreen/>
)}
</ThemeProvider>
<SidebarInset>
<header
className="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12">
<div className="flex items-center gap-2 px-4">
<SidebarTrigger className="-ml-1"/>
<Separator
orientation="vertical"
className="mr-2 data-[orientation=vertical]:h-4"
/>
<DynamicBreadcrumb/>
</div>
</header>
<ErrorBoundary>
{children}
</ErrorBoundary>
</SidebarInset>
</SidebarProvider>
) : (
<ErrorBoundary>
<LoginScreen/>
</ErrorBoundary>
)}
<Toaster/>
</ThemeProvider>
</ErrorBoundary>
</body>
</html>
);