import { Switch, Route, useLocation } from "wouter";
import { useEffect } from "react";
import { queryClient } from "./lib/queryClient";
import { QueryClientProvider } from "@tanstack/react-query";
import { Toaster } from "@/components/ui/toaster";
import { TooltipProvider } from "@/components/ui/tooltip";
import NotFound from "@/pages/not-found";
import Home from "@/pages/home";
import ArticlePage from "@/pages/article";
import CategoryPage from "@/pages/category";
import VideosPage from "@/pages/videos";
import GalleryPageWrapper from "@/pages/gallery";
import HoroscopePage from "@/pages/horoscope";
import RecipesPage from "@/pages/recipes";
import SearchPage from "@/pages/search";
import EmpfangPage from "@/pages/empfang";
import AboutPage from "@/pages/about";
import ImpressumPage from "@/pages/impressum";
import DatenschutzPage from "@/pages/datenschutz";
import KontaktPage from "@/pages/kontakt";
import AdminGalleryPage from "@/pages/admin-gallery";
import CookieConsent from "@/components/cookie-consent";

function ScrollToTop() {
  const [location] = useLocation();
  useEffect(() => {
    window.scrollTo(0, 0);
  }, [location]);
  return null;
}

function Router() {
  return (
    <div>
      <ScrollToTop />
      <Switch>
        <Route path="/" component={Home} />
        <Route path="/search" component={SearchPage} />
        <Route path="/article/:slug" component={ArticlePage} />
        <Route path="/category/:category" component={CategoryPage} />
        <Route path="/videos" component={VideosPage} />
        <Route path="/gallery" component={GalleryPageWrapper} />
        <Route path="/horoskop" component={HoroscopePage} />
        <Route path="/horoskop/:sign" component={HoroscopePage} />
        <Route path="/rezepte" component={RecipesPage} />
        <Route path="/empfang-folx-tv" component={EmpfangPage} />
        <Route path="/ueber-uns" component={AboutPage} />
        <Route path="/impressum" component={ImpressumPage} />
        <Route path="/datenschutz" component={DatenschutzPage} />
        <Route path="/kontakt" component={KontaktPage} />
        <Route path="/admin/gallery" component={AdminGalleryPage} />
        <Route component={NotFound} />
      </Switch>
    </div>
  );
}

function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <TooltipProvider>
        <Toaster />
        <Router />
      </TooltipProvider>
    </QueryClientProvider>
  );
}

export default App;