fix: align permission-gated UI actions

apps/admin/src/layouts/MainLayout.tsx

@@ -31,7 +31,11 @@ import {
 } from '@ant-design/icons';
 import { usePermission } from '../hooks/usePermission';
 import api from '../api';
-import { writePermissions } from '../auth/permission-store';
+import {
+  beginPermissionVerification,
+  clearPermissions,
+  writePermissions,
+} from '../auth/permission-store';
 import NotificationBell from '../components/NotificationBell';
 import RouteDock from '../components/RouteDock';
 import { buildMenu, type AppMenuItem } from '../auth/menu-policy';
@@ -82,6 +86,7 @@ const MainLayout: React.FC = () => {
 
   useEffect(() => {
     let cancelled = false;
+    beginPermissionVerification();
     api
       .get<{ id: number; username: string; permissions: string[]; roles?: string[] }>(
         '/auth/profile',
@@ -95,6 +100,7 @@ const MainLayout: React.FC = () => {
         setUser(nextUser);
       })
       .catch(() => {
+        if (!cancelled) clearPermissions('ready');
         // The API interceptor handles expired/invalid sessions.
       });
     return () => {
@@ -116,7 +122,7 @@ const MainLayout: React.FC = () => {
   const handleLogout = useCallback(() => {
     localStorage.removeItem('token');
     localStorage.removeItem('user');
-    localStorage.removeItem('permissions');
+    clearPermissions();
     navigate('/login');
   }, [navigate]);