<div class=“client”>

<div class="details">
  <h2 class="name">{{if imageUrl}}<img src="${imageUrl}">{{/if}} ${displayName}</h2>
  <div class="actions">
    <a href="#/client/${id}/edit" rel="edit">Edit</a>
    {{if !revoked}}
      <a href="#/client/${id}/revoke" data-method="post" data-confirm="There is no undo. Are you really really sure?" rel="revoke">Revoke</a>
    {{/if}}
    <a href="#/client/${id}" data-method="delete" data-confirm="There is no undo. Are you really really sure?" rel="delete">Delete</a>
  </div>
  <div class="meta">Site: <a href="${link}">${link}</a></div>
  <div class="meta">
    Created {{html $.shortdate(revoked)}}
    {{if revoked}}Revoked {{html $.shortdate(revoked)}}{{/if}}
  </div>
  {{each notes}}<p class="notes">${this}</p>{{/each}}
</div>
<div class="metrics">
  <div id="fig"></div>
  <ul class="badges">
    <li title="Access tokens granted, lifetime total"><big>${$.thousands(tokens.total)}</big><small>Granted</small></li>
    <li title="Access tokens granted, last 7 days"><big>${$.thousands(tokens.week)}</big><small>This Week</small></li>
    <li title="Access tokens revoked, last 7 days"><big>${$.thousands(tokens.revoked)}</big><small>Revoked (Week)</small></li>
  </ul>
</div>
<table class="tokens">
  <thead>
    <th>Token</th>
    <th>Identity</th>
    <th>Scope</th>
    <th>Created</th>
    <th>Accessed</th>
    <th>Revoked</th>
  </thead>
  <tbody>
    {{each tokens.list}}
    <tr>
      <td class="token">${token}</td>
      <td class="identity">{{if link}}<a href="${link}">${identity}</a>{{else}}${identity}{{/if}}</td>
      <td class="scope">${scope}</td>
      <td class="created">{{html $.shortdate(created)}}</td>
      <td class="accessed">{{if last_access}}{{html $.shortdate(last_access)}}{{/if}}</td>
      <td class="revoke">
        {{if revoked}}
          {{html $.shortdate(revoked)}}
        {{else}}
          <a href="#/token/${token}/revoke" data-method="post" data-confirm="Are you sure?" rel="revoke">Revoke</a>
        {{/if}}
      </td>
    </tr>
    {{/each}}
  </tbody>
</table>
<div class="pagination">
  {{if tokens.previous}}<a href="#/client/${id}/page/${tokens.page - 1}" rel="previous">Previous</a>{{/if}}
  {{if tokens.next}}<a href="#/client/${id}/page/${tokens.page + 1}" rel="next">Next</a>{{/if}}
</div>

</div>