feat: enhance canvas and node components with error handling and retry logic

- Integrated retry logic for AI image generation to handle transient errors and improve user experience.
- Updated error categorization to provide more informative feedback based on different failure scenarios.
- Enhanced node components to display retry attempts and error messages, improving visibility during image generation failures.
- Refactored canvas and node components to include retry count in status updates, ensuring accurate tracking of generation attempts.

app/(app)/canvas/[canvasId]/error.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import Link from "next/link";
+
+import { Button } from "@/components/ui/button";
+
+type CanvasErrorProps = {
+  error: Error & { digest?: string };
+  unstable_retry: () => void;
+};
+
+export default function CanvasError({ error, unstable_retry }: CanvasErrorProps) {
+  return (
+    <main className="flex h-screen w-screen items-center justify-center bg-background px-4">
+      <div className="w-full max-w-md space-y-4 rounded-xl border bg-card p-6 shadow-sm">
+        <div className="space-y-1 text-center">
+          <h1 className="text-xl font-semibold">Canvas konnte nicht geladen werden</h1>
+          <p className="text-sm text-muted-foreground">
+            Beim Laden dieses Canvas ist ein Fehler aufgetreten.
+          </p>
+          {error.digest ? (
+            <p className="text-xs text-muted-foreground/80">Fehler-ID: {error.digest}</p>
+          ) : null}
+        </div>
+
+        <div className="flex flex-col gap-2 sm:flex-row sm:justify-center">
+          <Button className="sm:flex-1" onClick={() => unstable_retry()}>
+            Erneut versuchen
+          </Button>
+          <Button asChild variant="outline" className="sm:flex-1">
+            <Link href="/dashboard">Zum Dashboard</Link>
+          </Button>
+        </div>
+      </div>
+    </main>
+  );
+}

app/(app)/canvas/[canvasId]/page.tsx

@@ -1,6 +1,7 @@
 import { notFound, redirect } from "next/navigation";
 
 import Canvas from "@/components/canvas/canvas";
+import ConnectionBanner from "@/components/canvas/connection-banner";
 import CanvasSidebar from "@/components/canvas/canvas-sidebar";
 import { api } from "@/convex/_generated/api";
 import type { Id } from "@/convex/_generated/dataModel";
@@ -50,7 +51,8 @@ export default async function CanvasPage({
   return (
     <div className="flex h-screen w-screen overflow-hidden">
       <CanvasSidebar />
-      <div className="flex-1">
+      <div className="relative flex-1">
+        <ConnectionBanner />
         <Canvas canvasId={typedCanvasId} />
       </div>
     </div>