import { getTranslations, setRequestLocale } from 'next-intl/server'
import { mockDb } from '@/lib/mockDb'
import PlannerForm from './PlannerForm'
import type { Metadata } from 'next'
import { basicMetadata } from '@/lib/seo'

interface Props {
  params: Promise<{ locale: string }>
}

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { locale } = await params
  const t = await getTranslations({ locale, namespace: 'planner' })
  return basicMetadata(`${t('title')} — Marmaris Local`, t('subtitle'), locale)
}

export default async function PlanOlusturPage({ params }: Props) {
  const { locale } = await params
  setRequestLocale(locale)

  const t = await getTranslations('planner')
  const neighborhoods = await mockDb.getNeighborhoods()

  const getLocalizedName = (obj: any) => {
    if (!obj) return ''
    return locale === 'ru' ? obj.nameRu : locale === 'en' ? obj.nameEn : obj.nameTr
  }

  const neighborhoodOptions = neighborhoods.map(n => ({
    value: n.slug,
    label: getLocalizedName(n)
  }))

  return (
    <div className="flex-1 flex flex-col min-h-screen bg-stone text-ink">
      <main className="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8 py-12 flex-1 w-full">
        <div className="bg-paper p-8 rounded-3xl border border-pine/8 shadow-sm">
          <div className="mb-8 border-b border-dashed border-pine/8 pb-6">
            <h1 className="text-3xl font-heading font-extrabold text-pine lowercase">
              {t('title')}
            </h1>
            <p className="text-sm text-shutter mt-2">
              {t('subtitle')}
            </p>
          </div>

          <PlannerForm
            locale={locale}
            translations={{
              days: t('days'),
              style: t('style'),
              neighborhoods: t('neighborhoods'),
              generate: t('generate'),
              generating: t('generating'),
              gastronomy: t('styles.gastronomy'),
              relaxation: t('styles.relaxation'),
              adventure: t('styles.adventure'),
            }}
            neighborhoods={neighborhoodOptions}
          />
        </div>
      </main>
    </div>
  )
}