Scaffold full-stack volunteer scheduling application
Go backend with domain-based packages (volunteer, schedule, timeoff, checkin, notification), SQLite storage, JWT auth, and chi router. React TypeScript frontend with routing, auth context, and pages for all core features. Multi-stage Dockerfile and docker-compose included. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
60
web/src/App.tsx
Normal file
60
web/src/App.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import React from 'react';
|
||||
import { BrowserRouter, Routes, Route, NavLink, Navigate } from 'react-router-dom';
|
||||
import { AuthProvider, useAuth } from './auth';
|
||||
import Login from './pages/Login';
|
||||
import Dashboard from './pages/Dashboard';
|
||||
import Schedules from './pages/Schedules';
|
||||
import TimeOff from './pages/TimeOff';
|
||||
import Volunteers from './pages/Volunteers';
|
||||
import './App.css';
|
||||
|
||||
function Nav() {
|
||||
const { role, logout } = useAuth();
|
||||
return (
|
||||
<nav>
|
||||
<span className="nav-brand">Walkies</span>
|
||||
<NavLink to="/">Dashboard</NavLink>
|
||||
<NavLink to="/schedules">Schedules</NavLink>
|
||||
<NavLink to="/timeoff">Time Off</NavLink>
|
||||
{role === 'admin' && <NavLink to="/volunteers">Volunteers</NavLink>}
|
||||
<button className="btn-link" onClick={logout}>Sign Out</button>
|
||||
</nav>
|
||||
);
|
||||
}
|
||||
|
||||
function ProtectedLayout() {
|
||||
const { token } = useAuth();
|
||||
if (!token) return <Navigate to="/login" replace />;
|
||||
return (
|
||||
<div className="layout">
|
||||
<Nav />
|
||||
<main>
|
||||
<Routes>
|
||||
<Route path="/" element={<Dashboard />} />
|
||||
<Route path="/schedules" element={<Schedules />} />
|
||||
<Route path="/timeoff" element={<TimeOff />} />
|
||||
<Route path="/volunteers" element={<Volunteers />} />
|
||||
</Routes>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function LoginRoute() {
|
||||
const { token } = useAuth();
|
||||
if (token) return <Navigate to="/" replace />;
|
||||
return <Login />;
|
||||
}
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<AuthProvider>
|
||||
<BrowserRouter>
|
||||
<Routes>
|
||||
<Route path="/login" element={<LoginRoute />} />
|
||||
<Route path="/*" element={<ProtectedLayout />} />
|
||||
</Routes>
|
||||
</BrowserRouter>
|
||||
</AuthProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user