51 lines
2.2 KiB
TypeScript
51 lines
2.2 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { Navbar } from './components/Navbar';
|
|
import { Dashboard } from './pages/Dashboard';
|
|
import { Playground } from './pages/Playground';
|
|
import { Traffic } from './pages/Traffic';
|
|
import { Models } from './pages/Models';
|
|
import { Rules } from './pages/Rules';
|
|
import { Analytics } from './pages/Analytics';
|
|
import { SettingsPage } from './pages/SettingsPage';
|
|
|
|
export function App() {
|
|
const [activeTab, setActiveTab] = useState<string>('dashboard');
|
|
|
|
return (
|
|
<div className="min-h-screen bg-bg-primary text-text-primary flex flex-col selection:bg-accent-primary/20">
|
|
{/* Top AI Control Room Navbar */}
|
|
<Navbar activeTab={activeTab} setActiveTab={setActiveTab} />
|
|
|
|
{/* Main Container */}
|
|
<main className="flex-1 max-w-7xl w-full mx-auto px-4 sm:px-6 lg:px-8 pt-8">
|
|
{activeTab === 'dashboard' && <Dashboard onNavigate={setActiveTab} />}
|
|
{activeTab === 'playground' && <Playground />}
|
|
{activeTab === 'traffic' && <Traffic />}
|
|
{activeTab === 'models' && <Models />}
|
|
{activeTab === 'rules' && <Rules />}
|
|
{activeTab === 'analytics' && <Analytics />}
|
|
{activeTab === 'settings' && <SettingsPage />}
|
|
</main>
|
|
|
|
{/* Footer */}
|
|
<footer className="border-t border-border-subtle bg-bg-secondary/80 py-8 mt-12">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex flex-col sm:flex-row items-center justify-between gap-4 font-mono text-xs text-text-muted">
|
|
<div className="flex items-center gap-3">
|
|
<div className="w-6 h-6 rounded-lg bg-[#0D1117] border border-border-subtle flex items-center justify-center p-0.5">
|
|
<img src="/logo.png" alt="MR" className="w-full h-full object-contain" />
|
|
</div>
|
|
<span className="font-bold text-text-primary">Model Router</span>
|
|
<span className="text-text-dim">•</span>
|
|
<span>Intelligent LLM Request Dispatcher</span>
|
|
</div>
|
|
<div className="text-text-dim text-[11px]">
|
|
Local-First • Provider-Agnostic • Open-Source MIT
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default App;
|