{{define "host_row"}}
{{$h := .Host}}
<div class="row-hover host-row clickable hairline {{$h.Status}}{{if eq (deref $h.LastBackupStatus) "failed"}} failed{{end}}">
  <a href="/hosts/{{$h.ID}}" class="row-link" aria-label="Open {{$h.Name}}">{{$h.Name}}</a>
  <div>
    {{- if eq $h.Status "online" -}}
      <span class="dot dot-online{{if $h.CurrentJobID}} pulse{{end}}"></span>
    {{- else if eq $h.Status "degraded" -}}
      <span class="dot dot-degraded"></span>
    {{- else if eq $h.Status "offline" -}}
      <span class="dot dot-offline"></span>
    {{- else -}}
      <span class="dot dot-failed"></span>
    {{- end -}}
  </div>
  <div class="mono {{if eq $h.Status "offline"}}text-ink-mid{{else}}text-ink{{end}} font-medium">{{$h.Name}}</div>
  <div class="mono text-ink-mid text-[12px]">{{$h.OS}}/{{$h.Arch}}</div>
  <div class="text-xs text-ink-mid">
    {{- if $h.CurrentJobID -}}
      <span class="text-accent">backup running…</span><br>
      <span class="mono text-ink-fade">started {{relTime $h.LastBackupAt}}</span>
    {{- else if eq (deref $h.LastBackupStatus) "succeeded" -}}
      <span class="text-ok">succeeded</span> · <span class="mono">{{relTime $h.LastBackupAt}}</span>
    {{- else if eq (deref $h.LastBackupStatus) "failed" -}}
      <span class="text-bad font-medium">failed</span> · <span class="mono">{{relTime $h.LastBackupAt}}</span>
    {{- else if eq (deref $h.LastBackupStatus) "cancelled" -}}
      <span class="text-warn">cancelled</span> · <span class="mono">{{relTime $h.LastBackupAt}}</span>
    {{- else if eq $h.Status "offline" -}}
      <span class="text-ink-mute">last seen <span class="mono">{{relTime $h.LastSeenAt}}</span></span>
    {{- else -}}
      <span class="text-ink-fade italic">never run</span>
    {{- end -}}
    {{- if .NextRun -}}
      <br><span class="mono text-[10.5px] text-ink-fade" title="{{.NextRun.Format "2006-01-02 15:04:05 MST"}}">next {{relTime .NextRun}}</span>
    {{- end -}}
  </div>
  <div class="text-right mono {{if eq $h.Status "offline"}}text-ink-mid{{else}}text-ink{{end}}">{{bytes $h.RepoSizeBytes}}</div>
  <div class="text-right mono {{if eq $h.Status "offline"}}text-ink-mute{{else}}text-ink-mid{{end}}">
    {{- if eq $h.SnapshotCount 0 -}}
      <span class="text-ink-fade">—</span>
    {{- else -}}
      {{comma $h.SnapshotCount}}
    {{- end -}}
  </div>
  <div class="text-right mono {{if gt $h.OpenAlertCount 0}}text-bad font-medium{{else}}text-ink-mute{{end}}">
    {{- if eq $h.OpenAlertCount 0 -}}—{{- else -}}{{$h.OpenAlertCount}}{{- end -}}
  </div>
  <div class="flex gap-1.5 flex-wrap">
    {{- range $h.Tags -}}
      <span class="tag">{{.}}</span>
    {{- end -}}
  </div>
  <div class="text-right row-action">
    {{- if eq $h.Status "offline" -}}
      <span class="mono text-xs text-ink-fade">offline</span>
    {{- else if $h.CurrentJobID -}}
      <a href="/jobs/{{deref $h.CurrentJobID}}" class="btn btn-ghost">View job →</a>
    {{- else if .RunAllScheduleID -}}
      <button class="btn btn-primary whitespace-nowrap"
              hx-post="/hosts/{{$h.ID}}/schedules/{{.RunAllScheduleID}}/run"
              hx-swap="none"
              hx-disabled-elt="this"
              title="fire every backup this host knows about">Run all groups</button>
    {{- else -}}
      <a href="/hosts/{{$h.ID}}/sources" class="btn btn-ghost whitespace-nowrap"
         title="multiple schedules — pick a source group from the host detail">Open →</a>
    {{- end -}}
  </div>
</div>
{{end}}