import type { Metadata } from "next";

import StoresCommonClient from "@/components/common/StoresCommonClient";
import { getStoresServer } from "@/services/store.service.server";
import { POPULAR_CATEGORIES } from "@/utils/constants";

export const revalidate = 3600; // Revalidate every hour

type Props = {
  params: Promise<{ slug: string; alphabet: string }>;
};

// Module-level cache for category alphabet coupon data
const cachedCategoryAlphabetData: { [key: string]: any } = {};

// Generate metadata for SEO
export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const resolvedParams = await params;
  const categoryId = resolvedParams.slug || "all";
  const alphabet = resolvedParams.alphabet || "all";
  const decodedCategory = decodeURIComponent(categoryId);
  const decodedAlphabet = decodeURIComponent(alphabet);
  const cacheKey = `${categoryId}-${alphabet}`; // Use raw params for cache key
  
  // Fetch data (will be cached for page render)
  if (!cachedCategoryAlphabetData[cacheKey]) {
    const storesData = await getStoresServer(decodedCategory, decodedAlphabet);
    cachedCategoryAlphabetData[cacheKey] = { storesData };
  }
  
  const { storesData } = cachedCategoryAlphabetData[cacheKey];
  const pageHeading = storesData?.page_heading || `${decodedCategory} - ${decodedAlphabet.toUpperCase()}`;
  const storesCount = storesData?.stores?.length || 0;
  
  const alphabetText = decodedAlphabet === "all" ? "all" : `starting with ${decodedAlphabet.toUpperCase()}`;
  
  return {
    title: `${pageHeading} Coupons & Deals | Rebates.com`,
    description: `Find ${storesCount} ${alphabetText} stores offering ${decodedCategory} coupons and cashback deals. Save money with exclusive discounts and promo codes.`,
    keywords: `${decodedCategory}, ${decodedAlphabet}, coupons, deals, promo codes, cashback, discounts`,
    alternates: {
      canonical: `/category_coupons/${categoryId}`,
    },
    openGraph: {
      title: `${pageHeading} Coupons & Deals`,
      description: `Find ${storesCount} ${alphabetText} stores offering ${decodedCategory} coupons and cashback deals.`,
      type: "website",
    },
  };
}

export default async function CategoryCouponsAlphabetPage({ params }: Props) {
  const resolvedParams = await params;
  const categoryId = resolvedParams.slug || "all";
  const alphabet = resolvedParams.alphabet || "all";
  const decodedCategory = decodeURIComponent(categoryId);
  const decodedAlphabet = decodeURIComponent(alphabet);
  const cacheKey = `${categoryId}-${alphabet}`;

  // Use cached data from generateMetadata or fetch if not available
  if (!cachedCategoryAlphabetData[cacheKey]) {
    const storesData = await getStoresServer(decodedCategory, decodedAlphabet);
    cachedCategoryAlphabetData[cacheKey] = { storesData };
  }

  const { storesData } = cachedCategoryAlphabetData[cacheKey];

  return (
    <StoresCommonClient
      routeType="category"
      alphabet={decodedAlphabet}
      categoryId={decodedCategory}
      categoriesData={POPULAR_CATEGORIES}
      storesData={storesData}
    />
  );
}