import { GET } from "@/utils/get";
import { Category, Package } from "@/types/models";
import { getTranslations } from "next-intl/server";
import { ProgramsFilter } from "../(all)/_components/filter";
import { PackageBox } from "../(all)/_components/package-box";
import { PackagesContainer } from "./_components/packages-container";

export const generateMetadata = async () => {
    const t = await getTranslations();
    return {
        title: t("routes.packages"),
        description: t("packages.subtitle"),
    };
};

export default async function PackagesPage({
    searchParams,
}: {
    searchParams: Promise<Record<string, any>>;
}) {
    const t = await getTranslations();
    const params = await searchParams;

    const [data, offersData] = await Promise.all([
        GET({ url: "/packages", searchParams: params }),
        GET({ url: "/offers/packages" })
    ]);

    if (!data) {
        return (
            <div className="flex flex-col items-center justify-center p-20 text-center w-full">
                <h2 className="text-2xl font-bold text-red-600 mb-2">{t("custom.failed")}</h2>
                <p className="text-gray-600">{t("custom.try-again")}</p>
            </div>
        );
    }

    const packages: Package[] = data?.packages?.data ?? [];
    const categories: Category[] = data?.categories ?? [];

    // Inject promotions
    const offers = offersData?.packages?.data || [];
    packages.forEach(pkg => {
        const offer = offers.find((o: any) => Number(o.id) === Number(pkg.id));
        if (offer) {
            pkg.price = String(offer.price);
            pkg.discount_amount = offer.discount_amount;
            pkg.final_price = offer.final_price;
            pkg.promotion = offer.promotion;
        }
    });

    return (
        <main className="grid md:grid-cols-3 gap-8 min-h-dvh">
            <div className="hidden md:block">
                <ProgramsFilter categories={categories} />
            </div>
            <PackagesContainer packages={packages} categories={categories} />
        </main>
    );
}