refactor(admin): drop simulations/experiments/models pages; group nav into sections

Removes the in-shell MLOps pages (experiments, models, simulations) and their
client API helpers in favour of external MLflow/Airflow links. Nav is regrouped
into Signals / Recommender status / Ops sections for clarity.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

apps/admin/src/components/AdminShell.tsx

@@ -6,31 +6,54 @@ import { usePathname } from 'next/navigation';
 const mlflowUrl = process.env.NEXT_PUBLIC_MLFLOW_URL ?? '/mlflow';
 const airflowUrl = process.env.NEXT_PUBLIC_AIRFLOW_URL ?? '/airflow';
 
-type NavItem =
-  | { href: string; label: string; external?: false }
-  | { href: string; label: string; external: true };
+type NavItem = {
+  href: string;
+  label: string;
+  external?: boolean;
+};
 
-const NAV: NavItem[] = [
-  { href: '/', label: 'Overview' },
-  { href: '/users', label: 'Users' },
-  { href: '/events', label: 'Events' },
-  { href: '/features', label: 'Features' },
-  { href: '/tips', label: 'Rec log' },
-  { href: '/reward-analytics', label: 'Rewards' },
-  { href: '/experiments', label: 'MLOps' },
-  { href: '/simulations', label: 'Simulations' },
-  { href: '/models', label: 'Models' },
-  { href: '/data-quality', label: 'Data quality' },
-  { href: '/ops', label: 'Ops' },
-  { href: '/sql', label: 'SQL runner' },
-  { href: '/health', label: 'Health' },
-  { href: '/audit', label: 'Audit log' },
-  { href: '/docs', label: 'Docs' },
-];
+type NavSection = {
+  label?: string;
+  items: NavItem[];
+};
 
-const NAV_EXTERNAL: NavItem[] = [
-  { href: mlflowUrl, label: 'MLflow ↗', external: true },
-  { href: airflowUrl, label: 'Airflow ↗', external: true },
+const NAV: NavSection[] = [
+  {
+    items: [{ href: '/', label: 'Overview' }],
+  },
+  {
+    label: 'Signals',
+    items: [
+      { href: '/users', label: 'Users' },
+      { href: '/events', label: 'Events' },
+      { href: '/features', label: 'Features' },
+      { href: '/data-quality', label: 'Data quality' },
+    ],
+  },
+  {
+    label: 'Recommender status',
+    items: [
+      { href: '/tips', label: 'Tips' },
+      { href: '/reward-analytics', label: 'Rewards' },
+    ],
+  },
+  {
+    label: 'Operations',
+    items: [
+      { href: '/health', label: 'Health' },
+      { href: '/ops', label: 'Ops' },
+      { href: '/sql', label: 'SQL runner' },
+      { href: '/audit', label: 'Audit log' },
+    ],
+  },
+  {
+    label: 'Resources',
+    items: [
+      { href: '/docs', label: 'Docs' },
+      { href: mlflowUrl, label: 'MLflow ↗', external: true },
+      { href: airflowUrl, label: 'Airflow ↗', external: true },
+    ],
+  },
 ];
 
 export function AdminShell({ children }: { children: React.ReactNode }) {
@@ -45,36 +68,46 @@ export function AdminShell({ children }: { children: React.ReactNode }) {
             Admin
           </span>
         </div>
-        <nav className="flex-1 px-2 py-3 space-y-0.5 overflow-y-auto">
-          {NAV.map(({ href, label }) => {
-            const active = href === '/' ? pathname === '/' : pathname.startsWith(href);
-            return (
-              <Link
-                key={href}
-                href={href}
-                className={`flex items-center px-3 py-2 rounded text-sm transition-colors ${
-                  active
-                    ? 'bg-gray-800 text-white font-medium'
-                    : 'text-gray-400 hover:text-white hover:bg-gray-900'
-                }`}
-              >
-                {label}
-              </Link>
-            );
-          })}
-          <div className="pt-3 pb-1 px-3">
-            <span className="text-xs text-gray-600 uppercase tracking-wider font-medium">MLOps</span>
-          </div>
-          {NAV_EXTERNAL.map(({ href, label }) => (
-            <a
-              key={href}
-              href={href}
-              target="_blank"
-              rel="noreferrer"
-              className="flex items-center px-3 py-2 rounded text-sm text-gray-500 hover:text-white hover:bg-gray-900 transition-colors"
-            >
-              {label}
-            </a>
+        <nav className="flex-1 px-2 py-3 overflow-y-auto">
+          {NAV.map((section, sectionIdx) => (
+            <div key={section.label ?? `top-${sectionIdx}`} className={sectionIdx === 0 ? '' : 'pt-3'}>
+              {section.label && (
+                <div className="pb-1 px-3">
+                  <span className="text-xs text-gray-600 uppercase tracking-wider font-medium">
+                    {section.label}
+                  </span>
+                </div>
+              )}
+              <div className="space-y-0.5">
+                {section.items.map((item) => {
+                  const active =
+                    !item.external &&
+                    (item.href === '/' ? pathname === '/' : pathname.startsWith(item.href));
+                  const className = `flex items-center px-3 py-2 rounded text-sm transition-colors ${
+                    active
+                      ? 'bg-gray-800 text-white font-medium'
+                      : item.external
+                        ? 'text-gray-500 hover:text-white hover:bg-gray-900'
+                        : 'text-gray-400 hover:text-white hover:bg-gray-900'
+                  }`;
+                  return item.external ? (
+                    <a
+                      key={item.href}
+                      href={item.href}
+                      target="_blank"
+                      rel="noreferrer"
+                      className={className}
+                    >
+                      {item.label}
+                    </a>
+                  ) : (
+                    <Link key={item.href} href={item.href} className={className}>
+                      {item.label}
+                    </Link>
+                  );
+                })}
+              </div>
+            </div>
           ))}
         </nav>
       </aside>