Phase 4 frontend polish: bundle analyzer, useTransition, error UX

- next.config: wrap config with @next/bundle-analyzer (enabled
  via ANALYZE=true) so future bundle deltas are inspectable
- web/package.json: add analyze script + bundle-analyzer devDep
- admin/disputes: wrap state updates in startTransition so the
  status-filter swap doesn't block the table; fade table while
  pending so the user gets feedback without a loading spinner
- add segment-level error boundaries for /invitations, /social,
  and /mcp using the existing RouteError component so failures
  in those fetch-heavy interactive routes show contextual UI
  instead of falling back to the root error page

Author: waydelyle

packages/web/next.config.ts

@@ -1,4 +1,9 @@
 import type { NextConfig } from 'next';
+import withBundleAnalyzer from '@next/bundle-analyzer';
+
+const bundleAnalyzer = withBundleAnalyzer({
+  enabled: process.env.ANALYZE === 'true',
+});
 
 const nextConfig: NextConfig = {
   output: 'standalone',
@@ -17,4 +22,4 @@ const nextConfig: NextConfig = {
   },
 };
 
-export default nextConfig;
+export default bundleAnalyzer(nextConfig);

packages/web/package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "dev": "next dev --port 3200",
     "build": "next build",
+    "analyze": "ANALYZE=true next build",
     "start": "next start --port 3200",
     "test": "node --test tests/**/*.test.mjs",
     "lint": "eslint .",
@@ -21,6 +22,7 @@
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3.3.5",
+    "@next/bundle-analyzer": "^16.2.4",
     "@tailwindcss/postcss": "^4.1.0",
     "@types/react": "^19.1.0",
     "@types/react-dom": "^19.1.0",

packages/web/src/app/admin/disputes/page.tsx

@@ -1,22 +1,25 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useTransition } from 'react';
 import { fetchAdminDisputes, type AdminDispute } from '@/lib/api';
 
 export default function AdminDisputesPage() {
   const [disputes, setDisputes] = useState<AdminDispute[]>([]);
   const [total, setTotal] = useState(0);
   const [loading, setLoading] = useState(true);
   const [statusFilter, setStatusFilter] = useState<string>('');
+  const [isPending, startTransition] = useTransition();
 
   useEffect(() => {
     const adminKey = sessionStorage.getItem('adminKey') ?? '';
     if (!adminKey) return;
     setLoading(true);
     fetchAdminDisputes(adminKey, { status: statusFilter || undefined, limit: '50' }).then((data) => {
       if (data) {
-        setDisputes(data.disputes);
-        setTotal(data.total);
+        startTransition(() => {
+          setDisputes(data.disputes);
+          setTotal(data.total);
+        });
       }
       setLoading(false);
     });
@@ -49,7 +52,7 @@ export default function AdminDisputesPage() {
       ) : disputes.length === 0 ? (
         <p className="mono mt-8 text-sm text-[var(--color-text-3)]">No disputes found.</p>
       ) : (
-        <table className="mono mt-6 w-full text-sm">
+        <table className={`mono mt-6 w-full text-sm ${isPending ? 'opacity-60 transition-opacity' : ''}`}>
           <thead>
             <tr className="border-b border-[var(--color-border)] text-left text-[var(--color-text-3)]">
               <th className="py-2">ID</th>

packages/web/src/app/invitations/error.tsx

@@ -0,0 +1,5 @@
+'use client';
+import RouteError from '@/components/RouteError';
+export default function Error(props: { error: Error & { digest?: string }; reset: () => void }) {
+  return <RouteError {...props} section="invitations" />;
+}

packages/web/src/app/mcp/error.tsx

@@ -0,0 +1,5 @@
+'use client';
+import RouteError from '@/components/RouteError';
+export default function Error(props: { error: Error & { digest?: string }; reset: () => void }) {
+  return <RouteError {...props} section="MCP services" />;
+}

packages/web/src/app/social/error.tsx

@@ -0,0 +1,5 @@
+'use client';
+import RouteError from '@/components/RouteError';
+export default function Error(props: { error: Error & { digest?: string }; reset: () => void }) {
+  return <RouteError {...props} section="social feed" />;
+}