grocery-app/frontend/src/App.jsx

import { BrowserRouter, Route, Routes } from "react-router-dom";
import { ROLES } from "./constants/roles";
import { AuthProvider } from "./context/AuthContext.jsx";
import { ActionToastProvider } from "./context/ActionToastContext.jsx";
import { ConfigProvider } from "./context/ConfigContext.jsx";
import { HouseholdProvider } from "./context/HouseholdContext.jsx";
import { UploadQueueProvider } from "./context/UploadQueueContext.jsx";
import { SettingsProvider } from "./context/SettingsContext.jsx";
import { StoreProvider } from "./context/StoreContext.jsx";

import AdminPanel from "./pages/AdminPanel.jsx";
import GroceryList from "./pages/GroceryList.jsx";
import Login from "./pages/Login.jsx";
import Manage from "./pages/Manage.jsx";
import Register from "./pages/Register.jsx";
import Settings from "./pages/Settings.jsx";
import InviteLink from "./pages/InviteLink.jsx";

import AppLayout from "./components/layout/AppLayout.jsx";
import UploadToaster from "./components/common/UploadToaster.jsx";
import PrivateRoute from "./utils/PrivateRoute.jsx";
import RoleGuard from "./utils/RoleGuard.jsx";

function App() {
  return (
    <ConfigProvider>
      <AuthProvider>
        <HouseholdProvider>
          <StoreProvider>
            <UploadQueueProvider>
              <ActionToastProvider>
                <SettingsProvider>
                  <BrowserRouter>
                    <Routes>
                      {/* Public route */}
                      <Route path="/login" element={<Login />} />
                      <Route path="/register" element={<Register />} />
                      <Route path="/invite/:token" element={<InviteLink />} />

                      {/* Private routes with layout */}
                      <Route
                        element={
                          <PrivateRoute>
                            <AppLayout />
                          </PrivateRoute>
                        }
                      >
                        <Route path="/" element={<GroceryList />} />
                        <Route path="/manage" element={<Manage />} />
                        <Route path="/settings" element={<Settings />} />

                        <Route
                          path="/admin"
                          element={
                            <RoleGuard allowed={[ROLES.SYSTEM_ADMIN]}>
                              <AdminPanel />
                            </RoleGuard>
                          }
                        />
                      </Route>
                    </Routes>
                    <UploadToaster />
                  </BrowserRouter>
                </SettingsProvider>
              </ActionToastProvider>
            </UploadQueueProvider>
          </StoreProvider>
        </HouseholdProvider>
      </AuthProvider>
    </ConfigProvider>
  );
}

export default App;