fix: redesign

components/AuthGuard.tsx

@@ -0,0 +1,33 @@
+'use client';
+
+import { useEffect } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAuth } from '@/contexts/AuthContext';
+
+export default function AuthGuard({ children }: { children: React.ReactNode }) {
+    const { token, isLoading } = useAuth();
+    const router = useRouter();
+
+    useEffect(() => {
+        if (!isLoading && !token) {
+            router.replace('/admin/login');
+        }
+    }, [token, isLoading, router]);
+
+    if (isLoading) {
+        return (
+            <div className="min-h-screen flex items-center justify-center bg-gray-50 dark:bg-gray-950">
+                <div className="flex flex-col items-center gap-3">
+                    <div className="h-10 w-10 border-4 border-indigo-200 dark:border-indigo-800 border-t-indigo-600 rounded-full animate-spin" />
+                    <p className="text-sm text-gray-500 dark:text-gray-400">در حال بررسی دسترسی...</p>
+                </div>
+            </div>
+        );
+    }
+
+    if (!token) {
+        return null;
+    }
+
+    return <>{children}</>;
+}