import CategoriesData from "@comp/AppsComponent/CategoriesData/page";
import React from "react";

export async function generateMetadata({ params }) {
  const decodedName = decodeURIComponent(params.id[1]);
  const products = await fetchProducts(params?.["id"]?.[0]);

  return {
    title: decodedName,
    description:
      products.seo.description != ""
        ? products.seo.description
        : `  خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
    metadataBase: new URL(
      `https://www.vesmeh.com/categories/${params.id[0]}/${decodedName}`
    ),
    keywords: [
      "آرایشی",
      "بهداشت خانگی",
      "محصولات زیبایی",
      "لوازم تمیزی",
      "مراقبت شخصی",
    ],
    alternates: {
      canonical: `https://www.vesmeh.com/categories/${params.id[0]}/${decodedName}`,
    },
    openGraph: {
      title: decodedName,
      description:
        products.seo.description != ""
          ? products.seo.description
          : `  خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
      url: `https://www.vesmeh.com/categories/${params.id[0]}/${decodedName}`,
      type: "website",
    },
    twitter: {
      site: "@vesmehstore",
      description:
        products.seo.description != ""
          ? products.seo.description
          : `  خرید ${decodedName}| برندهای متنوع با پایین ترین قیمت | فروشگاه اینترنتی وسمه`,
      title: decodedName,
      creator: "@vesmehstore",
    },
  };
}

// page
// categoryId
// brandIds
// isActive
// minPrice
// maxPrice
// sortBy

const fetchProducts = async (categoryId, searchParams = {}) => {
  const {
    brandIds: brandIdsString,
    isActive,
    specialOffer,
    ...params
  } = searchParams;

  const query = {
    ...(categoryId != 0 ? { categoryId } : {}),
    page: 0,
    ...(typeof isActive !== "undefined" ? { isActive: !!isActive } : {}),
    ...(typeof specialOffer !== "undefined"
      ? { specialOffer: !!specialOffer }
      : {}),
    ...params,
  };

  const brandIds = brandIdsString?.split(",") ?? [];
  const brandIdsQuery =
    brandIds.length > 0
      ? `&${brandIds.map((id) => `brandIds=${id}`).join("&")}`
      : "";

  try {
    const res = await fetch(
      `${process.env.NEXT_PUBLIC_API_URL}/product?` +
        new URLSearchParams(query).toString() +
        brandIdsQuery,
      {
        cache: "no-cache",
      }
    );
    if (!res.ok) return [];
    const products = await res.json();

    console.log("Fetched products:", products);
    return products;
  } catch (error) {
    console.error("Error fetching products:", error);
    return [];
  }
};

const page = async ({ params, searchParams }) => {
  const products = await fetchProducts(params?.["id"]?.[0], searchParams);

  return (
    <div>
      <CategoriesData params={params} products={products} />
    </div>
  );
};

export default page;
