diff --git a/web/app/error.tsx b/web/app/error.tsx new file mode 100644 index 0000000..eb67727 --- /dev/null +++ b/web/app/error.tsx @@ -0,0 +1,65 @@ +"use client"; + +import { useEffect } from "react"; + +export default function Error({ + error, + reset, +}: { + error: Error & { digest?: string }; + reset: () => void; +}) { + useEffect(() => { + console.error("Top-level error boundary caught:", error); + }, [error]); + + return ( +
+
+
+ + + api unreachable + +
+ +
+

+ Couldn't reach the API +

+

+ The dashboard fetches data from{" "} + + api-server:3000 + {" "} + on the internal docker network. The container may be down or + still starting. Wait a few seconds and retry. +

+ + + +
+
+ error +
+ 
+              {error.message}
+              {error.digest ? `\n\ndigest: ${error.digest}` : ""}
+
+
+
+
+
+ ); +} diff --git a/web/app/layout.tsx b/web/app/layout.tsx index 1a4acb1..e6058d7 100644 --- a/web/app/layout.tsx +++ b/web/app/layout.tsx @@ -1,7 +1,21 @@ import "./globals.css"; +import type { Metadata, Viewport } from "next"; +import Nav from "@/components/nav"; +import AutoRefresh from "@/components/auto-refresh"; -export const metadata = { +export const metadata: Metadata = { title: "CM Bot V2", + description: "CM Bot account and user dashboard", +}; + +export const viewport: Viewport = { + themeColor: "#facc15", +}; + +const workbenchGrid = { + backgroundImage: + "radial-gradient(circle at 1px 1px, rgba(24,24,27,0.07) 1px, transparent 0)", + backgroundSize: "24px 24px", }; export default function RootLayout({ @@ -11,7 +25,14 @@ export default function RootLayout({ }) { return ( - {children} + +