import { NextResponse } from "next/server";

// Define TypeScript interfaces for card details and card structure
interface CardDetail {
  label: string;
  value: string;
}

interface Card {
  title: string;
  logo: string;
  image: string;
  details: CardDetail[];
  benefits: string[];
  applyLink: string;
}

// Mock Database with strict typing
const cardDatabase: Record<string, Card> = {
  "1": {
    title: "Citi Cashback Credit Card",
    logo: "/citi-logo.png",
    image: "/credit-card-image.png",
    details: [
      { label: "Interest Rate", value: "3.5%" },
      { label: "Minimum Salary", value: "AED 8K" },
      { label: "Fx Rate", value: "2.99%" },
      { label: "Annual Fee", value: "AED 0" },
      { label: "Balance Transfer", value: "Yes" },
      { label: "Cashback", value: "Yes" },
    ],
    benefits: [
      "No Annual Membership Fee (AMF) subject to spend",
      "3% cashback on Non-AED Spend",
      "2% cashback on Grocery Spend",
      "1% cashback on all other spend",
    ],
    applyLink: "https://www.example.com/apply-now",
  },
};

// Define the expected context type
interface Context {
  params: {
    id: string;
  };
}

// ✅ Correct TypeScript implementation for a Next.js App Router API Route
export async function GET(
  req: Request,
  context: Context
): Promise<NextResponse> {
  const { id } = context.params;

  // Check if the card exists
  if (!cardDatabase[id]) {
    return NextResponse.json({ error: "Card not found" }, { status: 404 });
  }

  // Return the card details in JSON format
  return NextResponse.json(cardDatabase[id]);
}