import { notFound } from 'next/navigation';
import { prisma } from '@/lib/db';
import { requireUser } from '@/lib/auth';
import { StatusBadge } from '@/components/StatusBadge';
import { OrderProgress } from '@/components/desk/OrderProgress';
import { DeskFocus } from '@/components/desk/Desk';
import { ShareControl } from '@/components/ShareControl';
import { RetryPay } from '@/components/RetryPay';
import { templateById } from '@/lib/templates';
import { voiceById, langName } from '@/lib/voices';
import { saleSummary } from '@/lib/sale';
import { idsOfMahalle } from '@/lib/idari';
import Link from 'next/link';
import { apLong, apShort } from '@/lib/ap';
import { OrderPhotos } from '@/components/OrderPhotos';
import { ListingText } from '@/components/ListingText';
import { listingText } from '@/lib/listing';
import { LinkContact } from '@/components/LinkContact';
import { EmsalTool } from '@/components/EmsalTool';
import { linkOrder } from '@/app/panel/musteriler/actions';

export default async function Detay({ params, searchParams }: { params: Promise<{ id: string }>; searchParams: Promise<{ odeme?: string }> }) {
  const u = await requireUser();
  const { id } = await params; const { odeme } = await searchParams;
  const o = await prisma.order.findUnique({ where: { id } });
  if (!o || (o.userId !== u.id && u.role !== 'ADMIN')) notFound();
  const contacts = o.userId === u.id ? await prisma.contact.findMany({ where: { userId: u.id }, orderBy: { updatedAt: 'desc' }, select: { id: true, name: true } }) : [];
  const t = templateById(o.template);
  const area = o.areaM2 ? `${Math.round(o.areaM2).toLocaleString('tr-TR')} m²` : null;
  const rows: [string, string | null | undefined][] = [
    ['Konum', `${o.mahalle}, ${o.ilce} / ${o.il}`], ['Satılan', saleSummary(o)], ['Yüzölçümü', area], ['Nitelik', o.nitelik], ['Şablon', t.name], ['Ses', `${voiceById(o.voice).name}${o.lang !== 'tr' ? ` · ${langName(o.lang)}` : ''}`], ...(o.price ? [['İlan fiyatı', '₺' + o.price.toLocaleString('tr-TR')] as [string, string]] : []),
    ['İmar', [o.imarDurum, o.emsal && `E ${o.emsal}`, o.taks && `TAKS ${o.taks}`, o.gabari && `H ${o.gabari}`].filter(Boolean).join(' · ') || null],
    ['Notlar', o.highlights.join(' · ') || null], ['Kapanış', [o.contactName, o.contactPhone].filter(Boolean).join(' · ') || null], ['Sipariş', o.code],
  ];
  const src = o.videoKey ? `/api/orders/${o.id}/download` : o.videoUrl || '';
  return (
    <>
      {o.geometry ? <DeskFocus parcels={[{ key: o.id, geometry: o.geometry as never, label: area || `${apShort(o.ada, o.parsel)}`, tone: 'main' }]} compare /> : null}
      <div className="flex items-end justify-between gap-3 px-4 pb-3 pt-4">
        <div><div className="tag">{o.createdAt.toLocaleString('tr-TR', { dateStyle: 'medium', timeStyle: 'short', timeZone: 'Europe/Istanbul' })}</div><h1 className="text-[22px] font-extrabold leading-tight">{apLong(o.ada, o.parsel)}</h1></div>
        <StatusBadge s={o.status} />
      </div>
      {odeme === 'tamam' && o.status === 'PENDING_PAYMENT' && <p className="bg-signal-soft px-4 py-2.5 text-[13.5px]">Ödemeniz işleniyor; onay gelince video kendiliğinden üretime girer.</p>}
      {odeme === 'iptal' && <p className="bg-signal-soft px-4 py-2.5 text-[13.5px]">Ödeme tamamlanmadı. Aşağıdan yeniden deneyebilirsiniz.</p>}
      {o.status === 'DELIVERED' ? (
        <div className="grid grid-cols-[minmax(0,200px)_1fr] gap-4 border-t border-ink/15 px-4 py-4">
          <video src={src} poster={o.posterKey ? `/api/orders/${o.id}/download?f=poster` : undefined} controls playsInline className="aspect-[9/16] w-full bg-ink object-cover" />
          <div className="flex flex-col gap-2">
            <a href={o.videoKey ? `/api/orders/${o.id}/download?dl=1` : o.videoUrl || '#'} className="btn-signal">MP4 indir</a>
            <p className="text-[12.5px] text-ink-soft">1080×1920{o.durationSec ? ` · ${o.durationSec.toFixed(0)} sn` : ''}<br />Teslim: {o.deliveredAt?.toLocaleString('tr-TR', { dateStyle: 'short', timeStyle: 'short', timeZone: 'Europe/Istanbul' })}</p>
          </div>
        </div>
      ) : o.status === 'FAILED' ? (
        <div className="border-t border-ink/15 bg-signal-soft px-4 py-4"><b className="text-[15px]">Üretim tamamlanamadı</b><p className="mt-1 text-[13.5px]">Ekibimize bildirim gitti. Krediniz iade edildi; yeni bir sipariş oluşturabilirsiniz.</p></div>
      ) : (
        <OrderProgress id={o.id} initial={{ status: o.status, progress: o.progress, progressMsg: o.progressMsg }} />
      )}
      {o.status === 'PENDING_PAYMENT' && <div className="px-4 pb-4"><RetryPay orderId={o.id} /></div>}
      {['DELIVERED', 'FAILED'].includes(o.status) && o.userId === u.id && (() => {
        // aynı parseli başka şablon ya da sesle üretmek için form önceden doldurulur
        const ids = idsOfMahalle(o.mahalleId);
        const q = new URLSearchParams({ ...(ids || {}), ada: o.ada, parsel: o.parsel });
        return <div className="px-4 pb-3"><Link href={`/panel/yeni?${q}`} className="btn-line btn-sm w-full">Bu parselle yeni video (başka şablon ya da ses)</Link></div>;
      })()}
      {o.status === 'DELIVERED' && o.userId === u.id && <div className="px-4 pb-4"><ShareControl id={o.id} initial={o.shareToken} base={process.env.APP_URL || ''} views={o.views} /></div>}
      {o.photoKeys.length > 0 && <div className="border-t border-ink/15 px-4 py-3"><div className="tag mb-2">Fotoğraflar · videodaki sırayla</div><OrderPhotos id={o.id} count={o.photoKeys.length} /></div>}
      {o.status === 'DELIVERED' && o.userId === u.id && (() => { const l = listingText(o); return <ListingText title={l.title} body={l.body} />; })()}
      {o.userId === u.id && <div className="border-t border-ink/15 px-4 py-3"><LinkContact orderId={o.id} contacts={contacts} current={o.contactId} action={linkOrder} /></div>}
      {o.userId === u.id && <EmsalTool areaM2={o.areaM2} />}
      <dl className="border-t border-ink/15">
        {rows.filter(([, v]) => v).map(([k, v]) => <div key={k} className="grid grid-cols-[96px_1fr] gap-3 border-b border-ink/10 px-4 py-2"><dt className="tag pt-0.5">{k}</dt><dd className="text-[14px]">{v}</dd></div>)}
      </dl>
      {o.geometry ? <p className="px-4 py-3 text-[12.5px] text-ink-soft">Haritadaki “Önce / sonra” ile ham uydu görüntüsünü videodaki sınırla karşılaştırabilirsiniz.</p> : null}
    </>
  );
}