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>

src/app/admin/cv/category/list/page.tsx

@@ -47,7 +47,7 @@ export default function CvPage() {
                           entires[0].filter((e) => { return e.categoryId == cat.id }).length > 0 ? (
                             <>
                               {entires[0].filter((e) => { return e.categoryId == cat.id }).map((entry) => (
-                                <CollapsibleForm entityName="Entry" form={CreateUpdateCvEntryForm} entity={entry} entityLabelIndex="title" />
+                                <CollapsibleForm key={entry.id} entityName="Entry" form={CreateUpdateCvEntryForm} entity={entry} entityLabelIndex="title" />
                               ))}
                             </>
                           ) : (<></>)

src/app/admin/project/list/page.tsx

@@ -38,7 +38,7 @@ export default function ProjectList() {
                           techStacks[0].filter((e) => { return e.id == project.stackId }).length > 0 ? (
                             <>
                               {techStacks[0].filter((e) => { return e.id == project.stackId }).map((stack) => (
-                                <CollapsibleForm entityName="Stack" form={CreateUpdateStackForm} entity={stack} entityLabelIndex="stackItems"/>
+                                <CollapsibleForm key={stack.id} entityName="Stack" form={CreateUpdateStackForm} entity={stack} entityLabelIndex="stackItems"/>
                               ))}
                             </>
                           ) : (<></>)