fix: resolve Prettier markdown code block parsing errors

- Fix syntax errors in skills markdown files (.github/skills, .opencode/skills)
- Change typescript to tsx for code blocks with JSX
- Replace ellipsis (...) in array examples with valid syntax
- Separate CSS from TypeScript into distinct code blocks
- Convert JavaScript object examples to valid JSON in docs
- Fix enum definitions with proper comma separation

app/dashboard/page.tsx

@@ -11,25 +11,25 @@ import {
   Zap,
 } from "lucide-react";
 import { useRouter } from "next/navigation";
-import { useSession } from "next-auth/react";
 import { type FC, useCallback, useEffect, useMemo, useState } from "react";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { authClient } from "@/lib/auth/client";
 
 const DashboardPage: FC = () => {
-  const { data: session, status } = useSession();
+  const { data, isPending } = authClient.useSession();
   const router = useRouter();
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {
     // Once session is loaded, redirect appropriately
-    if (status === "unauthenticated") {
-      router.push("/login");
-    } else if (status === "authenticated") {
+    if (!isPending && !data?.session) {
+      router.push("/auth/sign-in");
+    } else if (!isPending && data?.session) {
       setLoading(false);
     }
-  }, [status, router]);
+  }, [isPending, data, router]);
 
   // Memoize navigation cards - only recalculates when user role changes
   const navigationCards = useMemo(() => {
@@ -56,7 +56,7 @@ const DashboardPage: FC = () => {
       },
     ];
 
-    if (session?.user?.role === "ADMIN") {
+    if (data?.user?.role === "admin") {
       return [
         ...baseCards,
         {
@@ -86,7 +86,7 @@ const DashboardPage: FC = () => {
       ];
     }
     return baseCards;
-  }, [session?.user?.role]);
+  }, [data?.user?.role]);
 
   // Memoize class getter functions
   const getCardClasses = useCallback((variant: string) => {
@@ -150,13 +150,13 @@ const DashboardPage: FC = () => {
             <div className="space-y-3">
               <div className="flex items-center gap-3">
                 <h1 className="text-4xl font-bold tracking-tight bg-clip-text text-transparent bg-linear-to-r from-foreground to-foreground/70">
-                  Welcome back, {session?.user?.name || "User"}!
+                  Welcome back, {data?.user?.name || "User"}!
                 </h1>
                 <Badge
                   variant="secondary"
                   className="text-xs px-3 py-1 bg-primary/10 text-primary border-primary/20"
                 >
-                  {session?.user?.role}
+                  {data?.user?.role}
                 </Badge>
               </div>
               <p className="text-muted-foreground text-lg">