import Container from "@/components/elements/Container";
import { cookies } from "next/headers";
import InfiniteBillboard from "@/components/billboards/InfiniteBillboard";
import BillboardsFilter from "@/components/billboards/BillboardPage/BillboardsFilter";
import { fetchBillboards } from "@/api/fetchBillboards";
import { Metadata } from "next";
import { pageSeo } from "@/config/pageSeo";
import { generatePageMetadata } from "@/utils/generatePageMetadata";

// درون‌ریزی دیتاها برای تبدیل متن به ID
import provinces from "@/data/provinces.json";
import cities from "@/data/cities.json";

interface IBillboardsProps {
  params: Promise<{ slug?: string[] }>;
  searchParams: Promise<{
    province?: string;
    city?: string;
    category?: string;
    search?: string;
    sort?: string;
  }>;
}

// تابع استخراج داده که هم در Metadata و هم در Page استفاده می‌شود
const getSEOData = (slugSegments: string[] = [], filters: any) => {
  let provinceId = filters.province || "";
  let cityId = filters.city || "";
  let category = filters.category || "";
  let locationLabel = "";

  if (slugSegments && slugSegments.length > 0) {
    const fullText = decodeURIComponent(slugSegments[0]).replace(/-/g, ' ');

    if (fullText.startsWith("تبلیغات")) {
      // استخراج دسته‌بندی
      const afterAds = fullText.split("تبلیغات")[1]?.trim();
      if (afterAds) {
        category = afterAds.split("در")[0]?.trim();
        if (category.includes("خدمات مد و زیبایی")) category = "";
      }

      // استخراج مکان و تبدیل به ID برای فیلتر API
      if (fullText.includes("در شهر")) {
        const cityName = fullText.split("در شهر")[1]?.trim();
        const foundCity = cities.find(c => cityName.includes(c.name));
        if (foundCity) {
          cityId = foundCity.id.toString();
          locationLabel = ` در شهر ${foundCity.name}`;
        }
      } else if (fullText.includes("در استان")) {
        const provinceName = fullText.split("در استان")[1]?.trim();
        const foundProvince = provinces.find(p => provinceName.includes(p.name));
        if (foundProvince) {
          provinceId = foundProvince.id.toString();
          locationLabel = ` در استان ${foundProvince.name}`;
        }
      }
    }
  }

  // اگر لیبل از URL ساخته نشد، از کوئری پارامتر استفاده کن
  if (!locationLabel) {
    if (filters.city) {
      const city = cities.find(c => c.id.toString() === filters.city);
      if (city) locationLabel = ` در شهر ${city.name}`;
    } else if (filters.province) {
      const province = provinces.find(p => p.id.toString() === filters.province);
      if (province) locationLabel = ` در استان ${province.name}`;
    }
  }

  const categoryLabel = category || filters.category || "خدمات حوزه زیبایی و مد";
  return { provinceId, cityId, category, categoryLabel, locationLabel };
};

// --- متادیتای سئو ---
export async function generateMetadata({ params, searchParams }: IBillboardsProps): Promise<Metadata> {
  const [urlParams, filters] = await Promise.all([params, searchParams]);

  const isDefaultBillboards =
    (!urlParams.slug || urlParams.slug.length === 0) &&
    !filters.province &&
    !filters.city &&
    !filters.category &&
    !filters.search &&
    !filters.sort;

  if (isDefaultBillboards) {
    return generatePageMetadata({
      title: pageSeo.billboards.title,
      description: pageSeo.billboards.description,
      path: pageSeo.billboards.path,
      keywords: [...pageSeo.billboards.keywords],
    });
  }

  const { locationLabel, categoryLabel } = getSEOData(urlParams.slug, filters);

  const title = `تبلیغات ${categoryLabel}${locationLabel} | بیلبورد مدستاگرام`;
  const description = `بیلبورد و تبلیغات ${categoryLabel}${locationLabel} در مدستاگرام. فضای ویژه تبلیغات کسب‌وکارهای حوزه زیبایی برای دیده‌شدن بیشتر و جذب مشتری.`;

  const path =
    urlParams.slug && urlParams.slug.length > 0
      ? `/billboards/${urlParams.slug.join("/")}`
      : pageSeo.billboards.path;

  return generatePageMetadata({ title, description, path });
}

// --- اصلاح فیلتر و محتوا ---
export default async function Billboards({ params, searchParams }: IBillboardsProps) {
  const [urlParams, filters, cookieStore] = await Promise.all([
    params,
    searchParams,
    cookies()
  ]);
  
  const token = cookieStore.get("token")?.value || "";

  // ۱. استخراج داده‌های واقعی از اسلاگ فارسی
  const { provinceId, cityId, category, categoryLabel, locationLabel } = getSEOData(urlParams.slug, filters);

  // ۲. ترکیب فیلترها (بسیار مهم: مقادیر استخراج شده از URL جایگزین فیلترهای خالی می‌شوند)
  const combinedFilters = {
    ...filters,
    province: provinceId || filters.province,
    city: cityId || filters.city,
    category: category || filters.category
  };

  // ۳. ارسال فیلترهای صحیح به API
  const initialData = await fetchBillboards(1, 10, combinedFilters, token);

  return (
    <Container>
      <h1 className="sr-only">
        {(!urlParams.slug || urlParams.slug.length === 0) &&
        !filters.province &&
        !filters.city &&
        !filters.category &&
        !filters.search
          ? pageSeo.billboards.title.replace(" | مدستاگرام", "")
          : `تبلیغات ${categoryLabel}${locationLabel} در مدستاگرام`}
      </h1>

      <BillboardsFilter />
      
      {/* ۴. پاس دادن فیلترهای ترکیبی به کامپوننت اینفینیت */}
      <InfiniteBillboard
        initialData={initialData}
        filters={combinedFilters} 
        token={token}
      />
    </Container>
  );
}