import { notFound } from "next/navigation";

import Footer from "@/components/common/Footer";

import MainBg from "@/images/main-bg.webp";
import { getSiteSettings } from "@/lib/getSiteSettings";
import AboutFooterText from "@/components/frontend/pages/about/AboutFooterText";
import Banner from "@/components/frontend/pages/history/Banner";
import GalleryDetail from "@/components/frontend/pages/history/GalleryDetail";
import { getAlbumBySlug } from "@/lib/Galleryalbums";

interface PageProps {
  params: Promise<{
    slug: string;
  }>;
}

const Page = async ({ params }: PageProps) => {
  const { slug } = await params;
  const siteSettings = await getSiteSettings();
  const album = getAlbumBySlug(slug);

  if (!album) {
    notFound();
  }

  return (
    <>
      <Banner />
      <main
        className="mainsection"
        style={{
          backgroundImage: `url(${MainBg.src})`,
        }}
      >
        <GalleryDetail album={album} />
      </main>

      <Footer siteSettings={siteSettings}>
        <AboutFooterText />
      </Footer>
    </>
  );
};

export default Page;