feat: add permission-gated navigation and admin access

src/guards/AuthGuard.tsx

@@ -1,17 +1,24 @@
 'use client';
 
+import { AppLoader } from '@/components/AppLoader';
 import { useAppStore } from '@/store/app.store';
 import { useAuthStore } from '@/store/auth.store';
+import { getRoutePermission } from '@/config/app.routes';
+import { usePermissions } from '@/hooks/usePermissions';
 import { ROUTES } from '@/utils/routes';
-import { useRouter } from 'next/navigation';
+import { usePathname, useRouter } from 'next/navigation';
 import type { ReactNode } from 'react';
 import { useEffect } from 'react';
 
 export function AuthGuard({ children }: { children: ReactNode }) {
   const router = useRouter();
+  const pathname = usePathname();
   const accessToken = useAuthStore((state) => state.accessToken);
   const isInitialized = useAppStore((state) => state.isInitialized);
   const user = useAppStore((state) => state.user);
+  const { hasPermission } = usePermissions();
+  const requiredPermission = getRoutePermission(pathname);
+  const canAccessRoute = hasPermission(requiredPermission);
 
   useEffect(() => {
     if (!isInitialized) return;
@@ -21,7 +28,17 @@ export function AuthGuard({ children }: { children: ReactNode }) {
     }
   }, [accessToken, isInitialized, router]);
 
-  if (!isInitialized || !accessToken || !user) {
+  useEffect(() => {
+    if (!isInitialized || !accessToken || !user || canAccessRoute) return;
+
+    router.replace(ROUTES.ACCESS);
+  }, [accessToken, canAccessRoute, isInitialized, router, user]);
+
+  if (!isInitialized || (accessToken && !user)) {
+    return <AppLoader label="Preparing workspace" />;
+  }
+
+  if (!accessToken || !user || !canAccessRoute) {
     return null;
   }