{% extends "core/base.jinja" %}
{% from 'core/macros.jinja' import user_profile_link, select_all_checkbox %}

{% block additional_js %}
  <script type="module" src="{{ static("bundled/core/components/ajax-select-index.ts") }}"></script>
{% endblock %}
{% block additional_css %}
  <link rel="stylesheet" href="{{ static("bundled/core/components/ajax-select-index.css") }}">
  <link rel="stylesheet" href="{{ static("club/members.scss") }}">
{% endblock %}

{% block content %}
  {% block notifications %}
    {# Notifications are moved a little bit below #}
  {% endblock %}

  <h2>{% trans %}Club members{% endtrans %}</h2>

  {% if add_member_fragment %}
    <br />
    {{ add_member_fragment }}
    <br />
  {% endif %}
  {% include "core/base/notifications.jinja" %}
  {% if members %}
    <form action="{{ url('club:club_members', club_id=club.id) }}" id="members_old" method="post">
      {% csrf_token %}
      {% if can_end_membership %}
        {{ select_all_checkbox("members_old") }}
        <br />
      {% endif %}
      <table id="club_members_table">
        <thead>
          <tr>
            <td>{% trans %}User{% endtrans %}</td>
            <td>{% trans %}Role{% endtrans %}</td>
            <td>{% trans %}Description{% endtrans %}</td>
            <td>{% trans %}Since{% endtrans %}</td>
            {% if can_end_membership %}
              <td>{% trans %}Mark as old{% endtrans %}</td>
            {% endif %}
          </tr>
        </thead>
        <tbody>
          {% for m in members %}
            <tr>
              <td>{{ user_profile_link(m.user) }}</td>
              <td>{{ settings.SITH_CLUB_ROLES[m.role] }}</td>
              <td>{{ m.description }}</td>
              <td>{{ m.start_date }}</td>
              {%- if can_end_membership -%}
                <td>
                  {%- if m.is_editable -%}
                    <label for="id_members_old_{{ loop.index }}"></label>
                    <input
                      type="checkbox"
                      name="members_old"
                      value="{{ m.id }}"
                      id="id_members_old_{{ loop.index }}"
                    >
                  {%- endif -%}
                </td>
              {%- endif -%}
            </tr>
          {% endfor %}
        </tbody>
      </table>
      {% if can_end_membership %}
        <p></p>
        <input type="submit" name="submit" value="{% trans %}Mark as old{% endtrans %}">
      {% endif %}
    </form>
  {% else %}
    <p>{% trans %}There are no members in this club.{% endtrans %}</p>
  {% endif %}
{% endblock %}