94 lines
3.2 KiB
TypeScript
94 lines
3.2 KiB
TypeScript
import { Routes, Route } from 'react-router-dom';
|
|
import { ModalProvider } from './context/modals/useModal';
|
|
import { ModalRoot } from './context/modals/ModalRoot';
|
|
import { ToastProvider } from './context/toasts/useToast';
|
|
import { ToastRoot } from './context/toasts/ToastRoot';
|
|
import { LoaderProvider } from './context/loaders/useLoader';
|
|
import { LoaderRoot } from './context/loaders/LoaderRoot';
|
|
import Cart from './pages/Cart';
|
|
import { Navbar } from './components/Navbar';
|
|
import { Home } from './pages/Home';
|
|
import { Products } from './pages/Products';
|
|
import Login from './pages/Login';
|
|
import { Register } from './pages/Register';
|
|
import { Orders } from './pages/Orders';
|
|
import { ProtectedRoute } from './components/ProtectedRoute';
|
|
import { Boards } from './pages/Boards';
|
|
import { BoardCreate } from './pages/BoardCreate';
|
|
import { BoardEdit } from './pages/BoardEdit';
|
|
import { BoardDetail } from './pages/BoardDetail';
|
|
import { CardDetail } from './pages/CardDetail';
|
|
|
|
const App = () => {
|
|
return (
|
|
<LoaderProvider>
|
|
<ToastProvider>
|
|
<ModalProvider>
|
|
<div className="min-h-screen bg-gray-900 text-gray-100">
|
|
<Navbar />
|
|
<main className="flex-1 p-8 max-w-7xl mx-auto w-full">
|
|
<Routes>
|
|
<Route path="/" element={<Home />} />
|
|
<Route path="/login" element={<Login />} />
|
|
<Route path="/register" element={<Register />} />
|
|
|
|
{/* Protected Routes */}
|
|
<Route
|
|
path="/boards"
|
|
element={
|
|
<ProtectedRoute>
|
|
<Boards />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/boards/new"
|
|
element={
|
|
<ProtectedRoute>
|
|
<BoardCreate />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/boards/:id/edit"
|
|
element={
|
|
<ProtectedRoute>
|
|
<BoardEdit />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/boards/:id"
|
|
element={
|
|
<ProtectedRoute>
|
|
<BoardDetail />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/boards/:id/cards/:cardId"
|
|
element={
|
|
<ProtectedRoute>
|
|
<CardDetail />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
|
|
{/* Legacy Routes */}
|
|
<Route path="/products" element={<Products />} />
|
|
<Route path="/cart" element={<Cart />} />
|
|
<Route path="/orders" element={<Orders />} />
|
|
</Routes>
|
|
</main>
|
|
{/* Order matters for Z-Index: Loader (70) > Toast (60) > Modal (50) */}
|
|
<LoaderRoot />
|
|
<ToastRoot />
|
|
<ModalRoot />
|
|
</div>
|
|
</ModalProvider>
|
|
</ToastProvider>
|
|
</LoaderProvider>
|
|
);
|
|
};
|
|
|
|
export default App;
|