feat: replace hardcoded permission map with direct OAuth2 scope checks

Remove role-to-permission mapping (usePermissions, RequirePermission) and replace
with direct scope reads from the Logto access token JWT. OrgResolver decodes the
scope claim after /api/me resolves and stores scopes in Zustand. RequireScope and
useScopes replace the old hooks/components across all pages.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

ui/src/auth/OrgResolver.tsx

@@ -1,21 +1,23 @@
 import { useEffect } from 'react';
+import { useLogto } from '@logto/react';
 import { Spinner } from '@cameleer/design-system';
 import { useMe } from '../api/hooks';
 import { useOrgStore } from './useOrganization';
+import { fetchConfig } from '../config';
 
 /**
- * Fetches /api/me and populates the org store with platform admin status
- * and tenant-to-org mapping. Renders children once resolved.
+ * Fetches /api/me and populates the org store with tenant-to-org mapping.
+ * Also reads OAuth2 scopes from the access token and stores them.
+ * Renders children once resolved.
  */
 export function OrgResolver({ children }: { children: React.ReactNode }) {
   const { data: me, isLoading, isError } = useMe();
-  const { setIsPlatformAdmin, setOrganizations, setCurrentOrg, currentOrgId } = useOrgStore();
+  const { getAccessToken } = useLogto();
+  const { setOrganizations, setCurrentOrg, setScopes, currentOrgId } = useOrgStore();
 
   useEffect(() => {
     if (!me) return;
 
-    setIsPlatformAdmin(me.isPlatformAdmin);
-
     // Map tenants: logtoOrgId is the org ID for token scoping, id is the DB UUID
     const orgEntries = me.tenants.map((t) => ({
       id: t.logtoOrgId,
@@ -29,6 +31,21 @@ export function OrgResolver({ children }: { children: React.ReactNode }) {
     if (orgEntries.length === 1 && !currentOrgId) {
       setCurrentOrg(orgEntries[0].id);
     }
+
+    // Read scopes from the access token JWT payload
+    fetchConfig().then((config) => {
+      if (!config.logtoResource) return;
+      getAccessToken(config.logtoResource).then((token) => {
+        if (!token) return;
+        try {
+          const payload = JSON.parse(atob(token.split('.')[1]));
+          const scopeStr = (payload.scope as string) ?? '';
+          setScopes(new Set(scopeStr.split(' ').filter(Boolean)));
+        } catch {
+          setScopes(new Set());
+        }
+      }).catch(() => setScopes(new Set()));
+    });
   }, [me]);
 
   if (isLoading) {

ui/src/auth/useAuth.ts

@@ -4,7 +4,7 @@ import { useOrgStore } from './useOrganization';
 
 export function useAuth() {
   const { isAuthenticated, isLoading, signOut, signIn } = useLogto();
-  const { currentTenantId, isPlatformAdmin } = useOrgStore();
+  const { currentTenantId } = useOrgStore();
 
   const logout = useCallback(() => {
     signOut(window.location.origin + '/login');
@@ -14,7 +14,6 @@ export function useAuth() {
     isAuthenticated,
     isLoading,
     tenantId: currentTenantId,
-    isPlatformAdmin,
     logout,
     signIn,
   };

ui/src/auth/useOrganization.ts

@@ -8,23 +8,20 @@ export interface OrgInfo {
 }
 
 interface OrgState {
-  currentOrgId: string | null;      // Logto org ID — used for getAccessToken(resource, orgId)
-  currentTenantId: string | null;   // DB UUID — used for API calls like /api/tenants/{id}
-  currentOrgRoles: string[] | null; // Logto org roles for the current org (e.g. 'admin', 'member')
+  currentOrgId: string | null;    // Logto org ID — used for getAccessToken(resource, orgId)
+  currentTenantId: string | null; // DB UUID — used for API calls like /api/tenants/{id}
   organizations: OrgInfo[];
-  isPlatformAdmin: boolean;
+  scopes: Set<string>;
   setCurrentOrg: (orgId: string | null) => void;
   setOrganizations: (orgs: OrgInfo[]) => void;
-  setIsPlatformAdmin: (value: boolean) => void;
-  setCurrentOrgRoles: (roles: string[] | null) => void;
+  setScopes: (scopes: Set<string>) => void;
 }
 
 export const useOrgStore = create<OrgState>((set, get) => ({
   currentOrgId: null,
   currentTenantId: null,
-  currentOrgRoles: null,
   organizations: [],
-  isPlatformAdmin: false,
+  scopes: new Set(),
   setCurrentOrg: (orgId) => {
     const org = get().organizations.find((o) => o.id === orgId);
     set({ currentOrgId: orgId, currentTenantId: org?.tenantId ?? null });
@@ -38,6 +35,5 @@ export const useOrgStore = create<OrgState>((set, get) => ({
       currentTenantId: match?.tenantId ?? get().currentTenantId,
     });
   },
-  setIsPlatformAdmin: (value) => set({ isPlatformAdmin: value }),
-  setCurrentOrgRoles: (roles) => set({ currentOrgRoles: roles }),
+  setScopes: (scopes) => set({ scopes }),
 }));

ui/src/auth/useScopes.ts

@@ -0,0 +1,5 @@
+import { useOrgStore } from './useOrganization';
+
+export function useScopes() {
+  return useOrgStore((state) => state.scopes);
+}