import type { Metadata } from "next";
import { PageHero, Reveal, SectionTitle, SiteFooter, SiteNav } from "../components";
import { bannerImages } from "../data";
import { GalleryExperience } from "./GalleryExperience";
import { pageMetadata } from "@/lib/seo";

export const metadata: Metadata = pageMetadata({
  title: "Resort Gallery",
  description:
    "Explore photos of Bass Resort in Bhaktapur, including garden walkways, terrace dining, guest rooms, courtyards, and evening spaces.",
  path: "/gallery",
  image: "/images/bass-resort-webp/img-0967.webp",
  keywords: ["Bass Resort photos", "Bhaktapur resort gallery", "garden hotel Bhaktapur"],
});

export default function GalleryPage() {
  return (
    <>
      <Reveal />
      <SiteNav />
      <main>
        <PageHero
          title="Gallery"
          copy="Explore the garden walkways, rooms, terrace dining, courtyards, and peaceful evening atmosphere at Bass Resort."
          image={bannerImages.gallery}
          imagePosition="center 46%"
        />
        <section className="section">
          <div className="container">
            <SectionTitle
              eyebrow="Property Photos"
              title="Walkways, dining, cottages, and evening spaces"
              description="See the spaces guests can enjoy during a comfortable garden stay and restaurant visit in Bhaktapur."
            />
            <GalleryExperience />
          </div>
        </section>
      </main>
      <SiteFooter />
    </>
  );
}