import Link from "next/link";
import Header from "@/app/components/Header";
import Footer from "@/app/components/Footer";
import { type Tender } from "@/lib/api";
import TenderDetailsClient from "./TenderDetailsClient";

// Generate static params for static export
export async function generateStaticParams() {
  try {
    const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "https://api.msbsgov.com/api";
    const response = await fetch(`${API_BASE_URL}/tenders?limit=1000`);

    if (!response.ok) {
      console.warn("Failed to fetch tenders for static generation");
      return [];
    }

    const data = await response.json();
    if (data.success && data.data?.tenders) {
      return data.data.tenders.map((tender: Tender) => ({
        id: tender.id.toString(),
      }));
    }

    return [];
  } catch (error) {
    console.warn("Error generating static params:", error);
    return [];
  }
}

async function getTender(id: string): Promise<Tender | null> {
  try {
    const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "https://api.msbsgov.com/api";
    const response = await fetch(`${API_BASE_URL}/tenders/${id}`);

    if (!response.ok) {
      return null;
    }

    const data = await response.json();
    if (data.success && data.data) {
      return data.data;
    }

    return null;
  } catch (error) {
    console.error("Error fetching tender:", error);
    return null;
  }
}

export default async function TenderDetailsPage(props: { params: Promise<{ id: string }> }) {
  const params = await props.params;
  const { id } = params;
  const tender = await getTender(id);

  if (!tender) {
    return (
      <div className="min-h-screen bg-gray-50 flex items-center justify-center">
        <div className="text-center">
          <p className="text-red-600 text-lg mb-4">Tender not found</p>
          <Link
            href="/"
            className="px-6 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 transition-colors"
          >
            Back to Home
          </Link>
        </div>
      </div>
    );
  }

  return (
    <div className="min-h-screen bg-white overflow-x-hidden w-full max-w-full">
      <Header />
      <TenderDetailsClient tender={tender} />
      <Footer />
    </div>
  );
}