{{template "base" .}}
{{define "content"}}
<div style="max-width:1400px">

  <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:16px">
    <div>
      <div class="page-title">Hub</div>
      <div class="page-sub">Collections, parsers, scenarios, and postoverflows</div>
    </div>
    {{if .CLIAvailable}}
    <form method="POST" action="/hub/update">
      <input type="hidden" name="_csrf" value="{{.CSRFToken}}">
      <button type="submit" class="btn-secondary"
        onclick="return confirm('Run hub update + upgrade? This may take a minute.')">Update All</button>
    </form>
    {{end}}
  </div>

  {{if not .CLIAvailable}}
  <div class="cli-unavail-banner" style="margin-bottom:16px">
    <div>
      <strong style="display:block;margin-bottom:4px">cscli unavailable</strong>
      Hub management requires the cscli binary. Mount it at the CSCLI_PATH configured in your environment.
    </div>
  </div>
  {{end}}

  <div class="panel">
    <div class="tab-bar">
      <a href="/hub?tab=collections"    class="tab-item{{if eq .Tab "collections"}} tab-item--active{{end}}">Collections</a>
      <a href="/hub?tab=parsers"        class="tab-item{{if eq .Tab "parsers"}} tab-item--active{{end}}">Parsers</a>
      <a href="/hub?tab=scenarios"      class="tab-item{{if eq .Tab "scenarios"}} tab-item--active{{end}}">Scenarios</a>
      <a href="/hub?tab=postoverflows"  class="tab-item{{if eq .Tab "postoverflows"}} tab-item--active{{end}}">Postoverflows</a>
    </div>

    {{if .CLIAvailable}}
    {{if .Items}}
    <div style="overflow-x:auto">
      <table class="data-table">
        <thead>
          <tr>
            <th>Name</th>
            <th>Status</th>
            <th>Version</th>
            <th>State</th>
            <th>Action</th>
          </tr>
        </thead>
        <tbody>
          {{$tab := .Tab}}
          {{range .Items}}
          <tr>
            <td>
              <div style="font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:600">{{.Name}}</div>
              {{if .Description}}<div style="font-size:11px;color:var(--muted);margin-top:2px">{{truncate .Description 64}}</div>{{end}}
            </td>
            <td><span class="badge {{hubStatusClass .Status}}">{{.Status}}</span></td>
            <td style="font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted)">{{.Version}}</td>
            <td>
              {{if .Tainted}}
                <span class="badge badge-amber">tainted</span>
              {{else if .UpToDate}}
                <span class="badge badge-green">up to date</span>
              {{else if .Installed}}
                <span class="badge badge-amber">update avail</span>
              {{else}}
                <span class="badge badge-gray">not installed</span>
              {{end}}
            </td>
            <td>
              {{if .Installed}}
              <form method="POST" action="/hub/remove" style="display:inline">
                <input type="hidden" name="_csrf" value="{{$.CSRFToken}}">
                <input type="hidden" name="kind" value="{{$tab}}">
                <input type="hidden" name="tab"  value="{{$tab}}">
                <input type="hidden" name="name" value="{{.Name}}">
                <button type="submit" class="btn-danger-sm" onclick="return confirm('Remove {{.Name}}?')">Remove</button>
              </form>
              {{else}}
              <form method="POST" action="/hub/install" style="display:inline">
                <input type="hidden" name="_csrf" value="{{$.CSRFToken}}">
                <input type="hidden" name="kind" value="{{$tab}}">
                <input type="hidden" name="tab"  value="{{$tab}}">
                <input type="hidden" name="name" value="{{.Name}}">
                <button type="submit" class="btn-safe-sm">Install</button>
              </form>
              {{end}}
            </td>
          </tr>
          {{end}}
        </tbody>
      </table>
    </div>
    {{else}}
    <div class="empty-state">
      <div class="empty-text">No {{.Tab}} found</div>
      <div class="empty-sub">Run "Update All" to refresh the hub index</div>
    </div>
    {{end}}
    {{end}}
  </div>
</div>
{{end}}