{{define "admin-users"}}
{{template "header" .}}
<main id="main" class="wrap">
  <p class="eyebrow">Admin</p>
  <h1>Users</h1>
  {{if .Error}}<p class="banner error" role="alert">{{.Error}}</p>{{end}}
  <form class="ask" method="get" action="/admin/users" style="margin-bottom:1.5rem">
    <label for="q">Search</label>
    <input id="q" name="q" type="search" value="{{.Search}}" placeholder="username or name">
    <button type="submit" class="btn btn-primary">Search</button>
  </form>
  <div class="admin-users">
    <table class="user-table">
      <thead>
        <tr>
          <th scope="col">Username</th>
          <th scope="col">Role</th>
          <th scope="col">Actions</th>
        </tr>
      </thead>
      <tbody>
        {{range .Users}}
        <tr>
          <td><span class="mono">{{.Username}}</span></td>
          <td>{{.Role}}</td>
          <td class="user-actions">
            {{if eq .Role "admin"}}
            <form method="post" action="/admin/users/{{.ID}}/role">
              <input type="hidden" name="_csrf" value="{{$.CSRF}}">
              <input type="hidden" name="role" value="user">
              <button type="submit" class="btn btn-ghost">Make user</button>
            </form>
            {{else}}
            <form method="post" action="/admin/users/{{.ID}}/role">
              <input type="hidden" name="_csrf" value="{{$.CSRF}}">
              <input type="hidden" name="role" value="admin">
              <button type="submit" class="btn btn-ghost">Make admin</button>
            </form>
            {{end}}
          </td>
        </tr>
        {{else}}
        <tr><td colspan="3">No users yet.</td></tr>
        {{end}}
      </tbody>
    </table>
  </div>
  {{if .HasMore}}
  <p><a href="{{.NextCursor}}">Next page</a></p>
  {{end}}
</main>
{{template "footer" .}}
{{end}}