controller-v2/client/src/App.tsx

import { Toaster } from "@/components/ui/sonner";
import { TooltipProvider } from "@/components/ui/tooltip";
import { Route, Switch, Router } from "wouter";
import { useHashLocation } from "wouter/use-hash-location";
import ErrorBoundary from "./components/ErrorBoundary";
import { ThemeProvider } from "./contexts/ThemeContext";
import { DeviceProvider } from "./contexts/DeviceContext";
import Home from "./pages/Home";
import NotFound from "./pages/NotFound";
import Dashboard from "./pages/Dashboard";
import AudioPage from "./pages/AudioPage";
import EQPage from "./pages/EQPage";
import EffectsPage from "./pages/EffectsPage";
import BluetoothPage from "./pages/BluetoothPage";
import DspPage from "./pages/DspPage";
import DisplayPage from "./pages/DisplayPage";
import SystemPage from "./pages/SystemPage";
import IOPage from "./pages/IOPage";
import VUPage from "./pages/VUPage";
import SelectPage from "./pages/SelectPage";
import AIPage from "./pages/AIPage";
import CommunityPage from "./pages/CommunityPage";
import { AIDrawerProvider } from "./contexts/AIDrawerContext";
import DesktopAIShell from "./components/DesktopAIShell";
import { appShellColumnClass, appShellGutterClass } from "./lib/appShell";

function AIPageRoute() {
  return <AIPage />;
}

function AppRouter() {
  return (
    <Switch>
      <Route path="/" component={Home} />
      <Route path="/dashboard" component={Dashboard} />
      <Route path="/audio" component={AudioPage} />
      <Route path="/eq" component={EQPage} />
      <Route path="/effects" component={EffectsPage} />
      <Route path="/bluetooth" component={BluetoothPage} />
      <Route path="/dsp" component={DspPage} />
      <Route path="/display" component={DisplayPage} />
      <Route path="/system" component={SystemPage} />
      <Route path="/io" component={IOPage} />
      <Route path="/vu" component={VUPage} />
      <Route path="/select" component={SelectPage} />
      <Route path="/ai" component={AIPageRoute} />
      <Route path="/community" component={CommunityPage} />
      <Route path="/404" component={NotFound} />
      <Route component={NotFound} />
    </Switch>
  );
}

function App() {
  return (
    <ErrorBoundary>
      <ThemeProvider defaultTheme="dark">
        <DeviceProvider>
          <TooltipProvider>
            <Toaster />
            <Router hook={useHashLocation}>
              <AIDrawerProvider>
                <div
                  className={`min-h-dvh bg-[#0d1117] flex justify-center ${appShellGutterClass}`}
                >
                  <div className={`min-h-dvh ${appShellColumnClass}`}>
                    <DesktopAIShell>
                      <AppRouter />
                    </DesktopAIShell>
                  </div>
                </div>
              </AIDrawerProvider>
            </Router>
          </TooltipProvider>
        </DeviceProvider>
      </ThemeProvider>
    </ErrorBoundary>
  );
}

export default App;