Fix data-state errors

webdevcody · Oct 25, 2024 · 852e977 · 852e977
1 parent 418a989
commit 852e977
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/app/footer.tsx b/app/footer.tsx
@@ -1,5 +1,12 @@
+import dynamic from "next/dynamic";
 import Link from "next/link";
-import { ThemeToggle } from "@/components/ThemeToggle";
+
+const ThemeToggle = dynamic(
+  async () => (await import("@/components/ThemeToggle")).ThemeToggle,
+  {
+    ssr: false,
+  },
+);
 
 export default function Footer() {
   return (

diff --git a/components/UserMenu.tsx b/components/UserMenu.tsx
@@ -3,7 +3,7 @@
 import { ReactNode } from "react";
 import { useAuthActions } from "@convex-dev/auth/react";
 import { PersonIcon } from "@radix-ui/react-icons";
-import { ThemeToggle } from "@/components/ThemeToggle";
+import dynamic from "next/dynamic";
 import { Button } from "@/components/ui/button";
 import {
   DropdownMenu,
@@ -14,6 +14,13 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 
+const ThemeToggle = dynamic(
+  async () => (await import("@/components/ThemeToggle")).ThemeToggle,
+  {
+    ssr: false,
+  },
+);
+
 export function UserMenu({ children }: { children: ReactNode }) {
   return (
     <div className="flex items-center gap-2 text-sm font-medium">