/ src / App.tsx
App.tsx
 1  import { BrowserRouter, Routes, Route, Link, useLocation } from 'react-router-dom';
 2  import { DashboardPage } from './pages/DashboardPage';
 3  import { ProposalsPage } from './pages/ProposalsPage';
 4  import { MintingPage } from './pages/MintingPage';
 5  import { GovernorsPage } from './pages/GovernorsPage';
 6  import { SettingsPage } from './pages/SettingsPage';
 7  
 8  function NavLink({ to, children }: { to: string; children: React.ReactNode }) {
 9    const location = useLocation();
10    const isActive = location.pathname === to || (to !== '/' && location.pathname.startsWith(to));
11  
12    return (
13      <Link
14        to={to}
15        className={`px-3 py-2 rounded-lg transition-colors ${
16          isActive
17            ? 'bg-alpha text-text-primary'
18            : 'text-text-secondary hover:text-text-primary hover:bg-card-hover'
19        }`}
20      >
21        {children}
22      </Link>
23    );
24  }
25  
26  function App() {
27    return (
28      <BrowserRouter>
29        <div className="min-h-screen bg-background">
30          {/* Navigation */}
31          <nav className="border-b border-border">
32            <div className="max-w-7xl mx-auto px-4 py-4">
33              <div className="flex items-center justify-between">
34                <Link to="/" className="text-xl font-bold text-text-primary">
35                  ACDC Governor
36                </Link>
37                <div className="flex items-center gap-2">
38                  <NavLink to="/">Dashboard</NavLink>
39                  <NavLink to="/proposals">Proposals</NavLink>
40                  <NavLink to="/minting">Minting</NavLink>
41                  <NavLink to="/governors">Governors</NavLink>
42                  <NavLink to="/settings">Settings</NavLink>
43                  <button className="ml-4 px-4 py-2 bg-alpha text-text-primary rounded-lg hover:bg-alpha-dark transition-colors">
44                    Connect Wallet
45                  </button>
46                </div>
47              </div>
48            </div>
49          </nav>
50  
51          {/* Content */}
52          <main>
53            <Routes>
54              <Route path="/" element={<DashboardPage />} />
55              <Route path="/proposals" element={<ProposalsPage />} />
56              <Route path="/proposals/:id" element={<ProposalsPage />} />
57              <Route path="/minting" element={<MintingPage />} />
58              <Route path="/governors" element={<GovernorsPage />} />
59              <Route path="/settings" element={<SettingsPage />} />
60            </Routes>
61          </main>
62        </div>
63      </BrowserRouter>
64    );
65  }
66  
67  export default App;