import Link from "next/link";
import { notFound } from "next/navigation";
import { toClientJson } from "@/lib/serialize";
import { OpportunityDetailClient } from "@/app/opportunities/[id]/opportunity-detail-client";
import { getOpportunity } from "@/server/services/opportunity.service";

interface OpportunityPageData {
  _id: string;
  title: string;
  stage: string;
  probability?: number;
  leadId?: string | { _id: string };
}

export default async function OpportunityDetailPage({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  const opp = await getOpportunity(id);
  if (!opp) notFound();
  const safe = toClientJson<OpportunityPageData & Record<string, unknown>>(opp);

  return (
    <div className="space-y-6">
      <div className="flex items-center justify-between">
        <h1 className="text-2xl font-bold">{safe.title}</h1>
        <div className="flex gap-3 text-sm">
          <Link href="/pipeline" className="text-[var(--accent)] hover:underline">
            Pipeline
          </Link>
          {safe.leadId ? (
            <Link
              href={`/leads/${typeof safe.leadId === "object" ? safe.leadId._id : safe.leadId}`}
              className="text-[var(--accent)] hover:underline"
            >
              Lead
            </Link>
          ) : null}
        </div>
      </div>
      <OpportunityDetailClient opportunity={safe} />
    </div>
  );
}