import type { JSX } from 'react'
import { formatRelativeTime, useDeckTooltip } from '@overdeck/deck-ui'
import { selectRequestDeliveryLineage, type RequestStoryCoverage, type RequestStoryEvidenceLink } from '@overdeck/report-contract'

const DELIVERY_KINDS = new Set<RequestStoryEvidenceLink['kind']>(['branch', 'land_submission', 'commit', 'deployment', 'proof'])

function recordedText(value: unknown): string {
  return typeof value === 'string' && value.trim() ? value : 'Not recorded'
}

function safeOwnerUrl(value: string | undefined): string | undefined {
  return value?.startsWith('/') && !value.startsWith('//') && !value.includes('\\') ? value : undefined
}

function shortCommit(value: unknown): string {
  const text = recordedText(value)
  return /^[0-9a-f]{40}$/.test(text) ? text.slice(0, 12) : text
}

function Stage({ title, link, children }: { title: string; link?: RequestStoryEvidenceLink; children: JSX.Element }): JSX.Element {
  const ownerUrl = safeOwnerUrl(link?.ownerUrl)
  const parsed = link ? Date.parse(link.occurredAt) : Number.NaN
  const recordedAt = link && !Number.isNaN(parsed) ? new Date(parsed).toLocaleString() : link?.occurredAt
  const timestampTooltip = useDeckTooltip(recordedAt ?? 'Recorded time unavailable', 'Recorded at')
  return (
    <li className="requests-delivery-stage">
      <div className="requests-work-heading">
        <div>
          <h4>{title}</h4>
          {children}
        </div>
        {ownerUrl ? <a href={ownerUrl}>Open evidence</a> : null}
      </div>
      {link ? (
        <time className="requests-delivery-time" dateTime={link.occurredAt} {...timestampTooltip}>
          {Number.isNaN(parsed) ? link.occurredAt : formatRelativeTime(parsed)}
        </time>
      ) : null}
    </li>
  )
}

export function RequestDeliveryEvidence({ links, coverage }: {
  links: RequestStoryEvidenceLink[]
  coverage?: RequestStoryCoverage
}): JSX.Element {
  const deliveryLinks = links.filter((link) => DELIVERY_KINDS.has(link.kind))
  const { branch, submission, commit, deployment, proof } = selectRequestDeliveryLineage(deliveryLinks)

  return (
    <section aria-labelledby="request-delivery-evidence">
      <h3 id="request-delivery-evidence">Delivery</h3>
      {deliveryLinks.length === 0 ? <p className="requests-drawer-gap">{coverage?.reason ?? 'Delivery evidence is unavailable.'}</p> : (
        <ol className="requests-delivery-list">
          <Stage title="Branch submitted" link={branch}>
            <p>{branch ? `${branch.targetId} · head ${shortCommit(branch.metadata.submittedHead)}` : 'Branch and submitted head were not recorded.'}</p>
          </Stage>
          <Stage title="Landing" link={submission}>
            <p>{submission ? `Submitted head ${shortCommit(submission.metadata.submittedHead)}` : 'Landing submission was not recorded.'}</p>
          </Stage>
          <Stage title="Commit landed" link={commit}>
            <p>{commit ? `${shortCommit(commit.targetId)} · checks ${recordedText(commit.metadata.gateVerdict)}` : 'Landed commit and check verdict were not recorded.'}</p>
          </Stage>
          <Stage title="Deployment" link={deployment}>
            <p>{deployment ? `${shortCommit(deployment.metadata.release)} · ${recordedText(deployment.metadata.status)} · readiness ${recordedText(deployment.metadata.readiness)}` : 'Release and readiness result were not recorded.'}</p>
          </Stage>
          <Stage title="Installed proof" link={proof}>
            <p>{proof ? `${shortCommit(proof.metadata.release)} · ${recordedText(proof.metadata.result)}` : 'Installed owner proof was not recorded.'}</p>
          </Stage>
        </ol>
      )}
      {deliveryLinks.length > 0 && coverage?.reason ? <p className="requests-drawer-gap">{coverage.reason}</p> : null}
    </section>
  )
}