{{define "title"}}Source health — {{.SiteTitle}}{{end}}

{{define "main"}}
{{$admin := .Admin}}
<section class="mt-2 mb-8">
  <div class="rounded-3xl bg-[color:var(--card)] border-2 border-[color:var(--ink)]/10 p-6 sm:p-8 shadow-pete">
    <p class="text-sm uppercase tracking-[0.2em] text-[color:var(--ink)]/50">{{if $admin}}owner view{{else}}live status{{end}}</p>
    <h1 class="font-display text-3xl sm:text-4xl font-bold mt-1">Source health</h1>
    <p class="mt-2 max-w-2xl text-[color:var(--ink)]/70">
      {{if $admin}}Per-feed poll status and content stats. Rows that are currently failing float to the top.
      {{else}}Every feed Pete follows and whether it's still updating. This runs on a best-effort basis, so a source going quiet for a bit is normal.{{end}}
    </p>
    <div class="mt-4 flex flex-wrap gap-2">
      <span class="inline-flex items-center gap-1.5 rounded-full bg-[color:var(--ink)]/5 px-3 py-1 text-sm font-semibold tabular-nums">
        {{len .Sources}} sources
      </span>
      {{if .DegradedCnt}}
      <span class="inline-flex items-center gap-1.5 rounded-full bg-red-500/15 text-red-700 dark:text-red-300 px-3 py-1 text-sm font-semibold tabular-nums">
        ⚠ {{.DegradedCnt}} {{if $admin}}degraded{{else}}delayed{{end}}
      </span>
      {{else}}
      <span class="inline-flex items-center gap-1.5 rounded-full bg-emerald-500/15 text-emerald-700 dark:text-emerald-300 px-3 py-1 text-sm font-semibold">
        ✓ all updating
      </span>
      {{end}}
    </div>
  </div>
</section>

<div class="overflow-x-auto rounded-3xl bg-[color:var(--card)] border-2 border-[color:var(--ink)]/10 shadow-pete">
  <table class="w-full {{if $admin}}min-w-[52rem]{{else}}min-w-[28rem]{{end}} text-sm">
    <thead>
      <tr class="text-left text-[color:var(--ink)]/50 uppercase text-xs tracking-wider border-b-2 border-[color:var(--ink)]/10">
        <th class="px-4 py-3 font-semibold">Source</th>
        <th class="px-4 py-3 font-semibold">Channel</th>
        <th class="px-4 py-3 font-semibold">Status</th>
        <th class="px-4 py-3 font-semibold">Last update</th>
        {{if $admin}}
        <th class="px-4 py-3 font-semibold">Last poll</th>
        <th class="px-4 py-3 font-semibold text-right">Items</th>
        <th class="px-4 py-3 font-semibold text-right">Stories</th>
        <th class="px-4 py-3 font-semibold text-right">Paywall</th>
        <th class="px-4 py-3 font-semibold">Last story</th>
        <th class="px-4 py-3 font-semibold">Last posted</th>
        {{end}}
      </tr>
    </thead>
    <tbody>
      {{range .Sources}}
      <tr class="border-b border-[color:var(--ink)]/5 last:border-0 align-top">
        <td class="px-4 py-3 font-semibold whitespace-nowrap">{{.Name}}</td>
        <td class="px-4 py-3 text-[color:var(--ink)]/70 whitespace-nowrap">{{.Channel}}</td>
        <td class="px-4 py-3 whitespace-nowrap">
          {{if .NeverRun}}
            <span class="inline-flex items-center gap-1.5 rounded-full bg-[color:var(--ink)]/10 px-2.5 py-1 text-xs font-semibold">◌ idle</span>
          {{else if .Healthy}}
            <span class="inline-flex items-center gap-1.5 rounded-full bg-emerald-500/15 text-emerald-700 dark:text-emerald-300 px-2.5 py-1 text-xs font-semibold">● live</span>
          {{else if $admin}}
            <span class="inline-flex items-center gap-1.5 rounded-full bg-red-500/15 text-red-700 dark:text-red-300 px-2.5 py-1 text-xs font-semibold"
                  title="{{.LastError}}">✕ {{.Failures}} fail{{if ne .Failures 1}}s{{end}}</span>
          {{else}}
            <span class="inline-flex items-center gap-1.5 rounded-full bg-red-500/15 text-red-700 dark:text-red-300 px-2.5 py-1 text-xs font-semibold">✕ delayed</span>
          {{end}}
        </td>
        <td class="px-4 py-3 text-[color:var(--ink)]/70 whitespace-nowrap">{{if .LastSuccessAt.IsZero}}never{{else}}{{timeAgo .LastSuccessAt}}{{end}}</td>
        {{if $admin}}
        <td class="px-4 py-3 text-[color:var(--ink)]/70 whitespace-nowrap">{{if .LastPollAt.IsZero}}never{{else}}{{timeAgo .LastPollAt}}{{end}}</td>
        <td class="px-4 py-3 text-right tabular-nums">{{.LastItemCount}}</td>
        <td class="px-4 py-3 text-right tabular-nums" title="{{.Classified}} classified of {{.Total}}">{{.Total}}</td>
        <td class="px-4 py-3 text-right tabular-nums {{if gt .PaywallRate 50}}text-amber-600 dark:text-amber-400 font-semibold{{end}}">
          {{if .Total}}{{.PaywallRate}}%{{else}}—{{end}}
        </td>
        <td class="px-4 py-3 text-[color:var(--ink)]/70 whitespace-nowrap">{{if .LastSeenAt.IsZero}}—{{else}}{{timeAgo .LastSeenAt}}{{end}}</td>
        <td class="px-4 py-3 text-[color:var(--ink)]/70 whitespace-nowrap">{{if .LastPostedAt.IsZero}}—{{else}}{{timeAgo .LastPostedAt}}{{end}}</td>
        {{end}}
      </tr>
      {{if $admin}}{{if .LastError}}{{if not .Healthy}}
      <tr class="border-b border-[color:var(--ink)]/5">
        <td colspan="10" class="px-4 pb-3 -mt-1 text-xs text-red-600 dark:text-red-400 font-mono break-all">{{.LastError}}</td>
      </tr>
      {{end}}{{end}}{{end}}
      {{else}}
      <tr><td colspan="{{if $admin}}10{{else}}4{{end}}" class="px-4 py-8 text-center text-[color:var(--ink)]/50">No sources configured.</td></tr>
      {{end}}
    </tbody>
  </table>
</div>
{{end}}
