79 lines
2.6 KiB
JavaScript
79 lines
2.6 KiB
JavaScript
import { BrowserRouter as Router, Routes, Route, Link, useLocation } from 'react-router-dom'
|
|
import { Home, PawPrint, Activity, Heart, FlaskConical, Settings } from 'lucide-react'
|
|
import Dashboard from './pages/Dashboard'
|
|
import DogList from './pages/DogList'
|
|
import DogDetail from './pages/DogDetail'
|
|
import PedigreeView from './pages/PedigreeView'
|
|
import LitterList from './pages/LitterList'
|
|
import LitterDetail from './pages/LitterDetail'
|
|
import BreedingCalendar from './pages/BreedingCalendar'
|
|
import PairingSimulator from './pages/PairingSimulator'
|
|
import SettingsPage from './pages/SettingsPage'
|
|
import { useSettings } from './hooks/useSettings'
|
|
import './App.css'
|
|
|
|
function NavLink({ to, icon: Icon, label }) {
|
|
const location = useLocation()
|
|
const isActive = location.pathname === to
|
|
return (
|
|
<Link to={to} className={`nav-link${isActive ? ' active' : ''}`}>
|
|
<Icon size={20} />
|
|
<span>{label}</span>
|
|
</Link>
|
|
)
|
|
}
|
|
|
|
function AppInner() {
|
|
const { settings } = useSettings()
|
|
const kennelName = settings?.kennel_name || 'BREEDR'
|
|
|
|
return (
|
|
<div className="app">
|
|
<nav className="navbar">
|
|
<div className="container">
|
|
<div className="nav-brand">
|
|
<img
|
|
src="/static/br-logo.png"
|
|
alt="BREEDR Logo"
|
|
className="brand-logo"
|
|
/>
|
|
<span className="brand-text">{kennelName}</span>
|
|
</div>
|
|
<div className="nav-links">
|
|
<NavLink to="/" icon={Home} label="Dashboard" />
|
|
<NavLink to="/dogs" icon={PawPrint} label="Dogs" />
|
|
<NavLink to="/litters" icon={Activity} label="Litters" />
|
|
<NavLink to="/breeding" icon={Heart} label="Breeding" />
|
|
<NavLink to="/pairing" icon={FlaskConical} label="Pairing" />
|
|
<NavLink to="/settings" icon={Settings} label="Settings" />
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main className="main-content">
|
|
<Routes>
|
|
<Route path="/" element={<Dashboard />} />
|
|
<Route path="/dogs" element={<DogList />} />
|
|
<Route path="/dogs/:id" element={<DogDetail />} />
|
|
<Route path="/pedigree/:id" element={<PedigreeView />} />
|
|
<Route path="/litters" element={<LitterList />} />
|
|
<Route path="/litters/:id" element={<LitterDetail />} />
|
|
<Route path="/breeding" element={<BreedingCalendar />} />
|
|
<Route path="/pairing" element={<PairingSimulator />} />
|
|
<Route path="/settings" element={<SettingsPage />} />
|
|
</Routes>
|
|
</main>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function App() {
|
|
return (
|
|
<Router>
|
|
<AppInner />
|
|
</Router>
|
|
)
|
|
}
|
|
|
|
export default App
|