feat: implement role-based UI filtering for overview and navigation

adminfront/src/components/layout/AppLayout.tsx

@@ -52,9 +52,15 @@ function AppLayout() {
     const isTenantAdmin = profile?.role === "tenant_admin";
     const manageableCount = profile?.manageableTenants?.length ?? 0;
 
+    // Filter out restricted items for non-super admins
+    const filteredItems = items.filter(item => {
+      if (item.to === "/api-keys") return isSuperAdmin;
+      return true;
+    });
+
     if (isSuperAdmin) {
       // Super Admin sees everything
-      items.splice(1, 0, {
+      filteredItems.splice(1, 0, {
         label: "ui.admin.nav.tenants",
         to: "/tenants",
         icon: Building2,
@@ -62,14 +68,14 @@ function AppLayout() {
     } else if (isTenantAdmin) {
       if (manageableCount <= 1 && profile?.tenantId) {
         // Direct link if only one (or zero in array but has tenantId) tenant
-        items.splice(1, 0, {
+        filteredItems.splice(1, 0, {
           label: "ui.admin.nav.my_tenant",
           to: `/tenants/${profile.tenantId}`,
           icon: Building2,
         });
       } else if (manageableCount > 1) {
         // Show list menu if multiple tenants
-        items.splice(1, 0, {
+        filteredItems.splice(1, 0, {
           label: "ui.admin.nav.tenants",
           to: "/tenants",
           icon: Building2,
@@ -77,7 +83,7 @@ function AppLayout() {
       }
     }
 
-    return items;
+    return filteredItems;
   }, [profile]);
 
   const handleLogout = () => {