import Header from "@/components/header";
import Footer from "@/components/footer";
import GalleryPage from "@/components/photo-gallery";
import { ArrowLeft } from "lucide-react";
import { Link } from "wouter";
import { usePageMeta } from "@/hooks/use-page-meta";
import { InArticleAd, PageSideAds, TopBannerAd, MultiplexAd } from "@/components/adsense";

export default function GalleryPageWrapper() {
  usePageMeta("Fotogalerie – Einzigartige Momente von unseren Aufzeichnungen | FOLX TV", "Spannende Schnappschüsse und besondere Augenblicke, eingefangen bei unseren Aufzeichnungen. Authentische Bilder der Volksmusik- und Schlager-Stars in einzigartigen Momenten bei FOLX TV.");
  return (
    <div className="min-h-screen bg-background">
      <Header />
      <PageSideAds />
      <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
        <TopBannerAd />
        <Link href="/">
          <button className="flex items-center gap-2 text-muted-foreground hover:text-foreground transition-colors mb-6 text-sm" data-testid="button-back">
            <ArrowLeft className="w-4 h-4" />
            Zurück
          </button>
        </Link>
        <h1 className="text-2xl font-bold text-foreground mb-6" data-testid="text-gallery-title">
          Fotogalerie
        </h1>
        <InArticleAd />
        <GalleryPage />
        <InArticleAd />
              <div className="mt-8" data-testid="ad-multiplex-end">
          <div className="text-[9px] text-muted-foreground/40 text-center pb-1 uppercase tracking-widest">Anzeige</div>
          <MultiplexAd />
        </div>
</main>
      <Footer />
    </div>
  );
}
