{% extends "usersessions/base_manage.html" %}
{% load i18n humanize %}

{% block title %}
  {% trans "Sessions" %}
{% endblock title %}

{% block breadcrumbs %}
  {{ block.super }}
  <c-breadcrumbs.item text="{% trans "Sessions" %}" />
{% endblock breadcrumbs %}

{% block page.content %}
  <style>
    .shrink {
      width: 1%;
    }

    td,
    th {
      white-space: nowrap;
    }

    .grow {
      width: 100%;
      white-space: normal;
    }
  </style>
  {% if session_count > 1 %}
    {% url 'usersessions_list' as action_url %}
  {% else %}
    {% url 'account_logout' as action_url %}
  {% endif %}
  <c-form.card title="{% trans "Your active sessions" %}"
               method="post"
               action="{{ action_url }}"
               tight
               icon="sessions">
    <table class="table table-responsive table-striped">
      <thead>
        <tr>
          <th>{% trans "Started At" %}</th>
          <th>{% trans "IP Address" %}</th>
          <th>{% trans "Browser" %}</th>
          {% if show_last_seen_at %}
            <th>{% trans "Last seen at" %}</th>
          {% endif %}
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for session in sessions %}
          <tr>
            <td>
              <span title="{{ session.created_at }}">{{ session.created_at|naturaltime }}</span>
            </td>
            <td>{{ session.ip }}</td>
            <td class="grow">
              <span class="text-truncate d-inline-block"
                    style="max-width: 100ch">{{ session.user_agent }}</span>
            </td>
            {% if show_last_seen_at %}
              <td>
                <span title="{{ session.last_seen_at }}">{{ session.last_seen_at|naturaltime }}</span>
              </td>
            {% endif %}
            <td>
              {% if session.is_current %}
                <c-badge variant="success" text="{% trans "Current" %}" />
              {% endif %}
            </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
    <c-slot name="actions">
      {% if session_count > 1 %}
        <c-button type="submit"
                  variant="primary"
                  text="{% trans "Sign out other sessions" %}" />
      {% else %}
        <c-button type="submit"
                  variant="primary"
                  text="{% trans "Sign Out" %}" />
      {% endif %}
    </c-slot>
  </c-form.card>
{% endblock page.content %}