{{define "content" -}}
<div class="wrap">
  {{with .Data}}
  <h1 class="admin-title">Listings</h1>
  <p class="filter-tabs">
    <a class="btn btn-ghost btn-sm" href="/admin/listings">All</a>
    <a class="btn btn-ghost btn-sm" href="/admin/listings?status=active">Active</a>
    <a class="btn btn-ghost btn-sm" href="/admin/listings?status=pending">Pending</a>
    <a class="btn btn-ghost btn-sm" href="/admin/listings?status=hidden">Hidden</a>
  </p>
  <table class="data">
    <thead><tr><th>Listing</th><th>Type</th><th>Owner</th><th>Status</th><th>Actions</th></tr></thead>
    <tbody>
    {{range .Listings}}
    <tr>
      <td><a href="/listings/{{.ID}}">{{.Title}}</a><br><span class="card-loc">{{.Location}}</span></td>
      <td>{{.TypeIcon}} {{.TypeName}}</td>
      <td>{{.Owner.Name}}</td>
      <td><span class="badge {{statusClass .Status}}">{{.Status}}</span></td>
      <td class="row-actions">
        {{if ne .Status "active"}}<form method="post" action="/admin/listings/{{.ID}}/status"><input type="hidden" name="status" value="active"><button class="btn btn-outline btn-sm">Activate</button></form>{{end}}
        {{if ne .Status "hidden"}}<form method="post" action="/admin/listings/{{.ID}}/status"><input type="hidden" name="status" value="hidden"><button class="btn btn-ghost btn-sm">Hide</button></form>{{end}}
        <a class="btn btn-outline btn-sm" href="/admin/listings/{{.ID}}/edit">Edit</a>
        <form method="post" action="/admin/listings/{{.ID}}/delete" onsubmit="return confirm('Delete this listing permanently?')"><button class="btn btn-danger btn-sm">Delete</button></form>
      </td>
    </tr>
    {{else}}
    <tr><td colspan="5">No listings{{if .Status}} with that status{{end}}.</td></tr>
    {{end}}
    </tbody>
  </table>
  {{end}}
</div>
{{- end}}