import Link from 'next/link';
import { notFound } from 'next/navigation';
import { prisma } from '@/lib/prisma';
import ShareButtons from '@/components/ShareButtons';

export default async function ProofSentPage({
  params,
  searchParams,
}: {
  params: { id: string };
  searchParams: { emailed?: string };
}) {
  const proof = await prisma.designProof.findUnique({
    where: { id: params.id },
    include: { product: true },
  });
  if (!proof) notFound();

  const siteUrl = process.env.NEXT_PUBLIC_SITE_URL ?? 'http://localhost:3000';
  const link = `${siteUrl}/proofs/${proof.id}`;
  const emailed = searchParams.emailed === '1';

  return (
    <div className="mx-auto max-w-xl px-6 py-16 text-center">
      <p className="tag-label text-splash-pink">Design uploaded</p>
      <h1 className="mt-2 font-display text-3xl">
        {emailed ? 'Sent to your customer' : 'Ready to send'}
      </h1>

      {emailed ? (
        <p className="mt-3 text-sm text-muted">
          We emailed {proof.customerEmail} a link to review and approve this design. You can also send
          it another way below.
        </p>
      ) : (
        <div className="mt-3 border border-splash-orange bg-splash-orange/5 p-4 text-left text-sm">
          <p className="font-medium text-ink">Email wasn&apos;t sent automatically.</p>
          <p className="mt-1 text-muted">
            This usually means SMTP isn&apos;t configured yet in <code className="font-mono">.env</code> (see
            the README&apos;s &quot;Sending emails&quot; section). Use one of the options below instead.
          </p>
        </div>
      )}

      <div className="mt-8 border border-line bg-surface p-6">
        {proof.imageDataUrl ? (
          <img
            src={proof.imageDataUrl}
            alt="Uploaded design"
            className="mx-auto max-h-64 object-contain"
          />
        ) : (
          <p className="text-sm text-muted">No image was saved with this upload.</p>
        )}
      </div>

      <ShareButtons
        message={`Here's your ${proof.product.name} design to review and approve: ${link}`}
        link={link}
        redirectUri={link}
      />

      <Link href="/admin/proofs/new" className="mt-8 inline-block tag-label hover:text-ink">
        ← Upload another design
      </Link>
    </div>
  );
}
