<div class="grid">
  <%= render Components::Backend::Card.new(title: "pending verifications (#{@pending_verifications.total_count})") do %>
    <%= render Components::Backend::Item.new(icon: "⭠", href: backend_verifications_path) do %>
      <b>all verifications</b>
    <% end %>
    <hr>
    <% if @average_hangtime.present? %>
      <div class="detail-row">
        <span class="detail-label">avg hangtime</span>
        <span class="detail-value"><%= distance_of_time_in_words(0, @average_hangtime) %></span>
      </div>
    <% end %>
    <% if @pending_verifications.any? %>
      <div data-navigable-list>
        <% @pending_verifications.each do |verification| %>
          <div data-navigable-item>
            <%= render Components::Backend::Item.new(icon: "⭢", href: backend_verification_path(verification)) do %>
              <b><%= verification.document_type %></b>
              &nbsp;·&nbsp;
              <%= verification.identity.first_name %> <%= verification.identity.last_name %>
              &nbsp;·&nbsp;
              <small><%= time_ago_in_words(verification.pending_at || verification.created_at) %> ago</small>
            <% end %>
          </div>
        <% end %>
      </div>
      <%= paginate @pending_verifications %>
    <% else %>
      <div class="empty-state">
        no documents pending verification 🎉
      </div>
    <% end %>
  <% end %>
</div>
