pocket-pascal/client/src/App.tsx

import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom"

import { HomeScreen } from "@/components/home/HomeScreen"
import { AppShell } from "@/components/layout/AppShell"
import { LanguageProvider } from "@/lib/language"
import { BuilderScreen } from "@/screens/BuilderScreen"
import { HowToLibraryScreen } from "@/screens/HowToLibraryScreen"
import { KitchenHubScreen } from "@/screens/KitchenHubScreen"
import { KnowledgeHubScreen } from "@/screens/KnowledgeHubScreen"
import { PantryScreen } from "@/screens/PantryScreen"
import { PlaceholderScreen } from "@/screens/PlaceholderScreen"
import { PlanHubScreen } from "@/screens/PlanHubScreen"
import { PlateScreen } from "@/screens/PlateScreen"
import { RulesScreen } from "@/screens/RulesScreen"
import { SettingsScreen } from "@/screens/SettingsScreen"
import { WeekPlanScreen } from "@/screens/WeekPlanScreen"
import { ui } from "@/i18n/ui"

export default function App() {
  return (
    <LanguageProvider>
      <BrowserRouter>
        <Routes>
          <Route element={<AppShell />}>
            <Route index element={<HomeScreen />} />

            <Route path="kitchen" element={<KitchenHubScreen />} />
            <Route path="kitchen/pantry" element={<PantryScreen />} />
            <Route path="kitchen/builder" element={<BuilderScreen />} />
            <Route
              path="kitchen/stock"
              element={
                <PlaceholderScreen
                  backTo="/kitchen"
                  backLabel={ui.kitchen.back}
                  title={ui.placeholders.stockTitle}
                  body={ui.placeholders.stockBody}
                />
              }
            />

            <Route path="plan" element={<PlanHubScreen />} />
            <Route path="plan/week" element={<WeekPlanScreen />} />
            <Route
              path="plan/meal-planner"
              element={
                <PlaceholderScreen
                  backTo="/plan"
                  backLabel={ui.planHub.back}
                  title={ui.placeholders.mealPlannerTitle}
                  body={ui.placeholders.mealPlannerBody}
                />
              }
            />
            <Route
              path="plan/shopping"
              element={
                <PlaceholderScreen
                  backTo="/plan"
                  backLabel={ui.planHub.back}
                  title={ui.placeholders.shoppingTitle}
                  body={ui.placeholders.shoppingBody}
                />
              }
            />
            <Route
              path="plan/recipes"
              element={
                <PlaceholderScreen
                  backTo="/plan"
                  backLabel={ui.planHub.back}
                  title={ui.placeholders.recipesTitle}
                  body={ui.placeholders.recipesBody}
                />
              }
            />

            <Route path="knowledge" element={<KnowledgeHubScreen />} />
            <Route path="knowledge/plate" element={<PlateScreen />} />
            <Route path="knowledge/recipes" element={<HowToLibraryScreen />} />
            <Route path="knowledge/rules" element={<RulesScreen />} />
            <Route path="knowledge/settings" element={<SettingsScreen />} />

            {/* Legacy redirects */}
            <Route path="pantry" element={<Navigate to="/kitchen/pantry" replace />} />
            <Route path="builder" element={<Navigate to="/kitchen/builder" replace />} />
            <Route path="weekplan" element={<Navigate to="/plan/week" replace />} />
            <Route path="settings" element={<Navigate to="/knowledge/settings" replace />} />

            <Route path="*" element={<Navigate to="/" replace />} />
          </Route>
        </Routes>
      </BrowserRouter>
    </LanguageProvider>
  )
}