<table class="table table-striped table-hover">
  <thead>
    <tr>
      <th style="width: 40px;"></th>
      <th><%- @T('From') %></th>
      <th><%- @T('To') %></th>
      <!--<th style="width: 100px;"><%- @T('Queue') %></th>-->
      <th style="width: 130px;"><%- @T('Status') %></th>
      <th style="width: 80px;"><%- @T('Waiting') %></th>
      <th style="width: 80px;"><%- @T('Duration') %></th>
      <th style="width: 170px;"><%- @T('Time') %></th>
    </tr>
  </thead>
  <tbody>
    <% for item in @list: %>
    <tr <% if item.done: %>class="is-grayed-out"<% end %> data-id="<%- item.id %>">
      <td class="table-checkbox" style="vertical-align: middle">
        <label class="checkbox-replacement<% if item.disabled is true: %> is-disabled<% end %>">
          <input type="checkbox" class="js-check"<% if item.done: %> checked<% end %><% if item.disabled is true: %> disabled<% end %>>
          <%- @Icon('checkbox', 'icon-unchecked') %>
          <%- @Icon('checkbox-checked', 'icon-checked') %>
        </label>
      </td>
      <td>
        <% shown = false %>
        <% if item.preferences.from && !_.isEmpty(item.preferences.from): %>
          <% for caller_id in item.preferences.from: %>
            <% if caller_id.user_id && App.User.exists(caller_id.user_id): %>
              <% shown = true %>
              <% user = App.User.fullLocal(caller_id.user_id) %>
              <% classes = ['user-popover'] %>
              <% classes.push('is-inactive') if !user.active %>
              <% if caller_id.level isnt 'known': %><%- @T('maybe') %> <% end %>
              <span class="<%= classes.join(' ') %>" data-id="<%- user.id %>"><%= user.displayNameLong() %></span><br>
            <% else if !_.isEmpty(caller_id.comment): %>
              <% shown = true %>
              <%- @T('maybe') %> <%= caller_id.comment %><br>
            <% end %>
          <% end %>
        <% end %>
        <% if !shown && !_.isEmpty(item.from_comment): %>
          <% shown = true %>
          <%= item.from_comment %>
          <br>
        <% end %>
        <% if shown: %>
          <small><%= item.from_pretty %></small>
        <% else: %>
          <% if !_.isEmpty(item.from_pretty): %>
            <span class="js-userNew u-clickable" href="#"><%= item.from_pretty %></span>
          <% else: %>
            <span><%= item.from %></span>
          <% end %>
        <% end %>
      </td>
      <td>
        <% shown = false %>
        <% if item.preferences.to && !_.isEmpty(item.preferences.to): %>
          <% for caller_id in item.preferences.to: %>
            <% if caller_id.user_id && App.User.exists(caller_id.user_id): %>
              <% shown = true %>
              <% user = App.User.fullLocal(caller_id.user_id) %>
              <% classes = ['user-popover'] %>
              <% classes.push('is-inactive') if !user.active %>
              <% if caller_id.level isnt 'known': %><%- @T('maybe') %> <% end %>
              <span class="<%= classes.join(' ') %>" data-id="<%- user.id %>"><%= user.displayNameLong() %></span><br>
            <% else if !_.isEmpty(caller_id.comment): %>
              <% shown = true %>
              <%- @T('maybe') %> <%= caller_id.comment %><br>
            <% end %>
          <% end %>
        <% end %>
        <% if !shown && !_.isEmpty(item.to_comment): %>
          <% shown = true %>
          <%= item.to_comment %>
          <br>
        <% end %>
        <% if shown: %>
          <small><%= item.to_pretty %></small>
        <% else: %>
          <% if !_.isEmpty(item.to_pretty): %>
            <%= item.to_pretty %>
          <% else: %>
            <%= item.to %>
          <% end %>
        <% end %>
      </td>
      <!--<td style="vertical-align: middle"><%= item.queue %></td>-->
      <td style="vertical-align: middle">
        <% if item.state_human: %>
        <%- @Icon('status', "#{item.status_class} inline") %> <%- @T(item.state_human) %>
        <% end %>
      </td>
      <td style="vertical-align: middle"><%= @time_duration(item.duration_waiting_time) %></td>
      <td style="vertical-align: middle"><%= @time_duration(item.duration_talking_time) %></td>
      <td style="vertical-align: middle"><%- @humanTime(item.created_at) %></td>
    </tr>
    <% end %>
  </tbody>
</table>
