feat: enhance dashboard and canvas page functionality

- Added theme support to the dashboard with light, dark, and system options.
- Improved canvas ID handling with validation and fetching logic.
- Updated layout component to suppress hydration warnings for better rendering.
- Refactored dashboard to include user session management and workspace creation functionality.

components/providers.tsx

@@ -4,6 +4,7 @@ import { ReactNode } from "react";
 import { ConvexReactClient } from "convex/react";
 import { ConvexBetterAuthProvider } from "@convex-dev/better-auth/react";
 import { AuthUIProvider } from "@daveyplate/better-auth-ui";
+import { ThemeProvider } from "next-themes";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
 
@@ -21,20 +22,22 @@ export function Providers({
   const router = useRouter();
 
   return (
-    <ConvexBetterAuthProvider
-      client={convex}
-      authClient={authClient}
-      initialToken={initialToken}
-    >
-      <AuthUIProvider
+    <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+      <ConvexBetterAuthProvider
+        client={convex}
         authClient={authClient}
-        navigate={router.push}
-        replace={router.replace}
-        onSessionChange={() => router.refresh()}
-        Link={Link}
+        initialToken={initialToken}
       >
-        {children}
-      </AuthUIProvider>
-    </ConvexBetterAuthProvider>
+        <AuthUIProvider
+          authClient={authClient}
+          navigate={router.push}
+          replace={router.replace}
+          onSessionChange={() => router.refresh()}
+          Link={Link}
+        >
+          {children}
+        </AuthUIProvider>
+      </ConvexBetterAuthProvider>
+    </ThemeProvider>
   );
 }