fix: unify theme system - fix theme switching persistence

- Unified localStorage key to 'theme-preference' across all components
- Fixed header.tsx using wrong localStorage key ('theme' instead of 'theme-preference')
- Added localStorage hybrid persistence for instant theme changes
- Removed router.refresh() which was causing stale data revert
- Replaced Blue theme with Sepia
- Consolidated auth() calls to prevent race conditions
- Updated UserSettingsData types to include all themes

keep-notes/app/(main)/admin/ai/page.tsx

@@ -0,0 +1,127 @@
+import { AdminMetrics } from '@/components/admin-metrics'
+import { Button } from '@/components/ui/button'
+import { Zap, Settings, Activity, TrendingUp } from 'lucide-react'
+
+export default async function AdminAIPage() {
+  // Mock AI metrics - in a real app, these would come from analytics
+  const aiMetrics = [
+    {
+      title: 'Total Requests',
+      value: '856',
+      trend: { value: 12, isPositive: true },
+      icon: <Zap className="h-5 w-5 text-yellow-600 dark:text-yellow-400" />,
+    },
+    {
+      title: 'Success Rate',
+      value: '98.5%',
+      trend: { value: 2, isPositive: true },
+      icon: <TrendingUp className="h-5 w-5 text-green-600 dark:text-green-400" />,
+    },
+    {
+      title: 'Avg Response Time',
+      value: '1.2s',
+      trend: { value: 5, isPositive: true },
+      icon: <Activity className="h-5 w-5 text-blue-600 dark:text-blue-400" />,
+    },
+    {
+      title: 'Active Features',
+      value: '6',
+      icon: <Settings className="h-5 w-5 text-purple-600 dark:text-purple-400" />,
+    },
+  ]
+
+  return (
+    <div className="space-y-6">
+      <div className="flex justify-between items-center">
+        <div>
+          <h1 className="text-3xl font-bold text-gray-900 dark:text-white">
+            AI Management
+          </h1>
+          <p className="text-gray-600 dark:text-gray-400 mt-1">
+            Monitor and configure AI features
+          </p>
+        </div>
+        <Button variant="outline">
+          <Settings className="mr-2 h-4 w-4" />
+          Configure
+        </Button>
+      </div>
+
+      <AdminMetrics metrics={aiMetrics} />
+
+      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+        <div className="bg-white dark:bg-zinc-900 rounded-lg shadow overflow-hidden border border-gray-200 dark:border-gray-800 p-6">
+          <h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-4">
+            Active AI Features
+          </h2>
+          <div className="space-y-3">
+            {[
+              'Title Suggestions',
+              'Semantic Search',
+              'Paragraph Reformulation',
+              'Memory Echo',
+              'Language Detection',
+              'Auto Labeling',
+            ].map((feature) => (
+              <div
+                key={feature}
+                className="flex items-center justify-between p-3 bg-gray-50 dark:bg-zinc-800 rounded-lg"
+              >
+                <span className="text-sm text-gray-900 dark:text-white">
+                  {feature}
+                </span>
+                <span className="px-2 py-1 text-xs font-medium text-green-700 dark:text-green-400 bg-green-100 dark:bg-green-900 rounded-full">
+                  Active
+                </span>
+              </div>
+            ))}
+          </div>
+        </div>
+
+        <div className="bg-white dark:bg-zinc-900 rounded-lg shadow overflow-hidden border border-gray-200 dark:border-gray-800 p-6">
+          <h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-4">
+            AI Provider Status
+          </h2>
+          <div className="space-y-3">
+            {[
+              { name: 'OpenAI', status: 'Connected', requests: '642' },
+              { name: 'Ollama', status: 'Available', requests: '214' },
+            ].map((provider) => (
+              <div
+                key={provider.name}
+                className="flex items-center justify-between p-3 bg-gray-50 dark:bg-zinc-800 rounded-lg"
+              >
+                <div>
+                  <p className="text-sm font-medium text-gray-900 dark:text-white">
+                    {provider.name}
+                  </p>
+                  <p className="text-xs text-gray-600 dark:text-gray-400">
+                    {provider.requests} requests
+                  </p>
+                </div>
+                <span
+                  className={`px-2 py-1 text-xs font-medium rounded-full ${
+                    provider.status === 'Connected'
+                      ? 'text-green-700 dark:text-green-400 bg-green-100 dark:bg-green-900'
+                      : 'text-blue-700 dark:text-blue-400 bg-blue-100 dark:bg-blue-900'
+                  }`}
+                >
+                  {provider.status}
+                </span>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+
+      <div className="bg-white dark:bg-zinc-900 rounded-lg shadow overflow-hidden border border-gray-200 dark:border-gray-800 p-6">
+        <h2 className="text-lg font-semibold text-gray-900 dark:text-white mb-4">
+          Recent AI Requests
+        </h2>
+        <p className="text-gray-600 dark:text-gray-400">
+          Recent AI requests will be displayed here.
+        </p>
+      </div>
+    </div>
+  )
+}