import { Toaster } from "@/components/ui/sonner";
import { TooltipProvider } from "@/components/ui/tooltip";
import NotFound from "@/pages/NotFound";
import { Route, Switch } from "wouter";
import ErrorBoundary from "./components/ErrorBoundary";
import { ThemeProvider } from "./contexts/ThemeContext";
import DashboardLayout from "./components/DashboardLayout";
import Home from "./pages/Home";
import Login from "./pages/Login";
import Dashboard from "./pages/Dashboard";
import Training from "./pages/Training";
import Analysis from "./pages/Analysis";
import Videos from "./pages/Videos";
import Progress from "./pages/Progress";
import Rating from "./pages/Rating";
import Leaderboard from "./pages/Leaderboard";
import Checkin from "./pages/Checkin";
import LiveCamera from "./pages/LiveCamera";
import Recorder from "./pages/Recorder";
import Tutorials from "./pages/Tutorials";
import Reminders from "./pages/Reminders";
import VisionLab from "./pages/VisionLab";
import Logs from "./pages/Logs";
import AdminConsole from "./pages/AdminConsole";
import ChangeLog from "./pages/ChangeLog";

function DashboardRoute({ component: Component }: { component: React.ComponentType }) {
  return (
    <DashboardLayout>
      <Component />
    </DashboardLayout>
  );
}

function Router() {
  return (
    <Switch>
      <Route path="/" component={Home} />
      <Route path="/login" component={Login} />
      <Route path="/dashboard">
        <DashboardRoute component={Dashboard} />
      </Route>
      <Route path="/training">
        <DashboardRoute component={Training} />
      </Route>
      <Route path="/analysis">
        <DashboardRoute component={Analysis} />
      </Route>
      <Route path="/videos">
        <DashboardRoute component={Videos} />
      </Route>
      <Route path="/progress">
        <DashboardRoute component={Progress} />
      </Route>
      <Route path="/rating">
        <DashboardRoute component={Rating} />
      </Route>
      <Route path="/leaderboard">
        <DashboardRoute component={Leaderboard} />
      </Route>
      <Route path="/checkin">
        <DashboardRoute component={Checkin} />
      </Route>
      <Route path="/achievements">
        <DashboardRoute component={Checkin} />
      </Route>
      <Route path="/live-camera">
        <DashboardRoute component={LiveCamera} />
      </Route>
      <Route path="/recorder">
        <DashboardRoute component={Recorder} />
      </Route>
      <Route path="/tutorials">
        <DashboardRoute component={Tutorials} />
      </Route>
      <Route path="/reminders">
        <DashboardRoute component={Reminders} />
      </Route>
      <Route path="/logs">
        <DashboardRoute component={Logs} />
      </Route>
      <Route path="/changelog">
        <DashboardRoute component={ChangeLog} />
      </Route>
      <Route path="/vision-lab">
        <DashboardRoute component={VisionLab} />
      </Route>
      <Route path="/admin">
        <DashboardRoute component={AdminConsole} />
      </Route>
      <Route path="/404" component={NotFound} />
      <Route component={NotFound} />
    </Switch>
  );
}

function App() {
  return (
    <ErrorBoundary>
      <ThemeProvider defaultTheme="light">
        <TooltipProvider>
          <Toaster />
          <Router />
        </TooltipProvider>
      </ThemeProvider>
    </ErrorBoundary>
  );
}

export default App;
