import { notFound } from "next/navigation"
import AttractionHeroSection from "@/components/tours/attraction-hero-section"
import AttractionContentSection from "@/components/tours/attraction-content-section"
import Footer from "@/components/footer"
import { destinations, moreDestinations } from "@/lib/destinations-data"

interface PageProps {
  params: {
    destination: string
    attraction: string
  }
}

export async function generateStaticParams() {
  const allDestinations = [...destinations, ...moreDestinations]
  const params: { destination: string; attraction: string }[] = []

  allDestinations.forEach((destination) => {
    destination.attractions.forEach((attraction) => {
      params.push({
        destination: destination.slug,
        attraction: attraction.slug,
      })
    })
  })

  return params
}

export default function AttractionPage({ params }: PageProps) {
  const allDestinations = [...destinations, ...moreDestinations]
  const destination = allDestinations.find((d) => d.slug === params.destination)

  if (!destination) {
    notFound()
  }

  const attraction = destination.attractions.find((a) => a.slug === params.attraction)

  if (!attraction) {
    notFound()
  }

  return (
    <div className="min-h-screen">
      <AttractionHeroSection attraction={attraction} destination={destination} />
      <AttractionContentSection attraction={attraction} destination={destination} />
    </div>
  )
}