fix adminwrap issue

src/app/_components/AdminWrap.tsx

@@ -1,7 +1,10 @@
-import { isAdmin } from "~/app/actions"
-
-export default async function AdminWrap({children,}: Readonly<{ children: React.ReactNode }>) {
-	if (await isAdmin()) {
+// "use client"
+// import { isAdmin } from "~/app/actions"
+import { useUser } from "@clerk/nextjs"
+import { env } from "~/env"
+export default function AdminWrap({children,}: Readonly<{ children: React.ReactNode }>) {
+	const user = useUser();
+	if (user.isSignedIn && user.user.id == env.NEXT_PUBLIC_ADMIN_USER_CLERK_ID) {
 		return <>{children}</>
 	}
 	return (<></>) 

src/app/_components/TopNav.tsx

@@ -1,6 +1,7 @@
+"use client"
 import Link from "next/link"
 import AdminWrap from "./AdminWrap"
-import { Show, SignInButton, SignOutButton, SignUpButton, UserButton } from "@clerk/nextjs"
+import { ClerkLoaded, Show, SignInButton, SignOutButton, SignUpButton, UserButton } from "@clerk/nextjs"
 import { Button } from "~/components/ui/button"
 import { ThemeSwitch } from "./ThemeSwitch"
 
@@ -39,13 +40,15 @@ export default function TopNav() {
 						</Button>
 					</Show>
 					<ThemeSwitch />
-					<Show when="signed-in">
-						<Button asChild className="flex h-10 lg:h-full cursor-pointer lg:w-20 content-center" variant={"outline"}>
-							<div>
-							<UserButton />
-							</div>
-						</Button>
-					</Show>
+					<ClerkLoaded>
+						<Show when="signed-in">
+							<Button asChild className="flex h-10 lg:h-full cursor-pointer lg:w-20 content-center" variant={"outline"}>
+								<div>
+									<UserButton />
+								</div>
+							</Button>
+						</Show>
+					</ClerkLoaded>
 				</div>
 			</nav>
 		</div>