CG-Feedback-Monitor/src/App.tsx

63 lines
2.9 KiB
TypeScript

import { Routes, Route, NavLink } from 'react-router-dom'
import { BRAND_COLOR } from './config/constants'
import Dashboard from './pages/Dashboard'
import Configuration from './pages/Configuration'
import Consultants from './pages/Consultants'
import AssignmentCreate from './pages/AssignmentCreate'
import AssignmentDetail from './pages/AssignmentDetail'
import AssignmentEdit from './pages/AssignmentEdit'
import AssignmentTrash from './pages/AssignmentTrash'
import AssignmentArchive from './pages/AssignmentArchive'
import MeetingHistory from './pages/MeetingHistory'
import MeetingView from './pages/meeting/MeetingView'
import FeedbackDraftPage from './pages/FeedbackDraftPage'
import AssignmentFeedbackPage from './pages/AssignmentFeedbackPage'
import Evaluation from './pages/Evaluation'
export default function App() {
return (
<div className="min-h-screen bg-gray-50 flex flex-col">
<header className="text-white px-4 py-3 flex items-center gap-3 shadow" style={{ backgroundColor: BRAND_COLOR }}>
<span className="font-bold text-lg tracking-tight">Assignment Monitor</span>
</header>
<main className="flex-1 p-4 max-w-2xl mx-auto w-full pb-20">
<Routes>
<Route path="/" element={<Dashboard />} />
<Route path="/assignment/new" element={<AssignmentCreate />} />
<Route path="/assignments/trash" element={<AssignmentTrash />} />
<Route path="/assignments/archive" element={<AssignmentArchive />} />
<Route path="/assignment/:id" element={<AssignmentDetail />} />
<Route path="/assignment/:id/edit" element={<AssignmentEdit />} />
<Route path="/assignment/:id/history" element={<MeetingHistory />} />
<Route path="/assignment/:id/meeting/:meetingId" element={<MeetingView />} />
<Route path="/assignment/:id/feedback/:instituteeId" element={<AssignmentFeedbackPage />} />
<Route path="/assignment/:id/feedback-draft/:instituteeId" element={<FeedbackDraftPage />} />
<Route path="/evaluation" element={<Evaluation />} />
<Route path="/consultants" element={<Consultants />} />
<Route path="/config" element={<Configuration />} />
</Routes>
</main>
<nav className="bg-white border-t border-gray-200 flex justify-around py-2 sticky bottom-0">
{[
{ to: '/', label: 'Home' },
{ to: '/consultants', label: 'Berater' },
{ to: '/evaluation', label: 'Auswertung' },
{ to: '/config', label: 'Config' },
].map(({ to, label }) => (
<NavLink
key={to}
to={to}
end
className={({ isActive }) =>
`text-xs px-3 py-1 rounded ${isActive ? 'font-semibold' : 'text-gray-500'}`
}
style={({ isActive }) => isActive ? { color: BRAND_COLOR } : undefined}
>
{label}
</NavLink>
))}
</nav>
</div>
)
}