import type { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { ChuyenNhuongDetailClient } from '@/components/chuyen-nhuong/chuyen-nhuong-detail-client';
import { fetchTransferListingById } from '@/lib/chuyen-nhuong-server';

interface PageProps {
  params: Promise<{ id: string; locale: string }>;
}

export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
  const { id } = await params;
  const listing = await fetchTransferListingById(id);
  if (!listing) return { title: 'Không tìm thấy tin chuyển nhượng' };

  const description = listing.description?.slice(0, 160) ??
    `${listing.title} — Chuyển nhượng tại ${listing.district}, ${listing.city}`;

  return {
    title: `${listing.title} — Chuyển nhượng ${listing.district}`,
    description,
    openGraph: {
      title: listing.title,
      description,
      images: listing.media
        ?.filter((m) => m.type === 'image')
        .slice(0, 1)
        .map((m) => ({ url: m.url })) ?? [],
    },
  };
}

export default async function ChuyenNhuongDetailPage({ params }: PageProps) {
  const { id } = await params;
  const listing = await fetchTransferListingById(id);

  if (!listing) {
    notFound();
  }

  return <ChuyenNhuongDetailClient listing={listing} />;
}