{% macro user_profile_link(user) -%}
  <a href="{{ url("core:user_profile", user_id=user.id) }}">{{ user.get_display_name() }}</a>
{%- endmacro %}

{% macro user_profile_link_short_name(user) -%}
  <a href="{{ url("core:user_profile", user_id=user.id) }}">{{ user.get_short_name() }}</a>
{%- endmacro %}

{% macro user_link_with_pict(user) -%}
  <a href="{{ url("core:user_profile", user_id=user.id) }}" class="mini_profile_link" >
    {{ user.get_mini_item()|safe }}
  </a>
{%- endmacro %}

{% macro link_news_logo(news) -%}
  {%- if news.club.logo -%}
    {{ news.club.logo.url }}
  {%- else -%}
    {{ static("com/img/news.png") }}
  {%- endif -%}
{%- endmacro %}

{% macro user_mini_profile(user) %}
  <div class="user_mini_profile">
    <div class="user_mini_profile_infos">
      <div class="user_mini_profile_infos_text">
        <div class="user_mini_profile_name">{{ user.get_full_name() }}</div>
        {% if user.nick_name %}
          <div class="user_mini_profile_nick">&laquo; {{ user.nick_name }} &raquo;</div>
        {% endif %}
        {% if user.pronouns %}
          <div class="user_mini_profile_pronouns">{{ user.pronouns }}</div>
        {% endif %}
        {% if user.date_of_birth %}
          <div class="user_mini_profile_dob">
            {{ user.date_of_birth|date("d/m/Y") }} ({{ user.age }})
          </div>
        {% endif %}
      </div>
      {% if user.promo and user.promo_has_logo() %}
        <div class="user_mini_profile_promo">
          <img
            src="{{ static('core/img/promo_%02d.png' % user.promo) }}"
            title="Promo {{ user.promo }}"
            alt="Promo {{ user.promo }}"
            class="promo_pict"
          />
        </div>
      {% endif %}
    </div>
    <div class="user_mini_profile_picture">
      {% if user.profile_pict %}
        <img src="{{ user.profile_pict.get_download_url() }}" alt="{% trans %}Profile{% endtrans %}" />
      {% else %}
        <img
          src="{{ static('core/img/unknown.jpg') }}"
          alt="{% trans %}Profile{% endtrans %}"
          title="{% trans %}Profile{% endtrans %}"
        />
      {% endif %}
    </div>
  </div>
{%- endmacro %}

{% macro user_subscription(user) %}
  {% trans subscription_end=user.subscriptions.order_by('subscription_end').last().subscription_end %}Subscribed until {{ subscription_end }}{% endtrans %}<br/>
  {% trans %}Account number: {% endtrans %}{{ user.customer.account_id }}<br/>
{%- endmacro %}

{% macro show_tokens(user) %}
  {% if user.tokens.exists() %}
    <h5>{% trans %}Tokens{% endtrans %}</h5>
    <ul>
      {% for i in user.tokens.all() %}
        <li>{{ i }}</li>
      {% endfor %}
    </ul>
  {% endif %}
{% endmacro %}

{% macro paginate_alpine(page, nb_pages) %}
    {# Add pagination buttons for ajax based content with alpine

    Notes:
        This can only be used in the scope of your alpine datastore

    Notes:
        You might need to listen to the "popstate" event in your code
        to update the current page you are on when the user goes back in
        it's browser history with the back arrow

    Parameters:
        page (str): name of the alpine page variable in your datastore
        nb_page (str): call to a javascript function or variable returning
            the maximum number of pages to paginate
    #}
  <nav class="pagination" x-show="{{ nb_pages }} > 1" x-cloak>
      {# Adding the prevent here is important, because otherwise,
      clicking on the pagination buttons could submit the picture management form
      and reload the page #}
    <button
      @click.prevent="{{ page }}--"
      :disabled="{{ page }} <= 1"
      @keyup.right.window="{{ page }} = Math.min({{ nb_pages }}, {{ page }} + 1)"
    >
      <i class="fa fa-caret-left"></i>
    </button>
    <template x-for="i in {{ nb_pages }}">
      <button x-text="i" @click.prevent="{{ page }} = i" :class="{active: {{ page }} === i}"></button>
    </template>
    <button
      @click.prevent="{{ page }}++"
      :disabled="{{ page }} >= {{ nb_pages }}"
      @keyup.left.window="{{ page }} = Math.max(1, {{ page }} - 1)"
    >
      <i class="fa fa-caret-right"></i>
    </button>
  </nav>
{% endmacro %}

{% macro paginate_jinja(request, current_page, paginator) %}
    {# Add pagination buttons for pages without Alpine.

    This must be coupled with a view that handles pagination
    with the Django Paginator object.

    Parameters:
        request (django.http.request.HttpRequest): the current django request
        current_page (django.core.paginator.Page): the current page object
        paginator (django.core.paginator.Paginator): the paginator object
    #}
  {{ paginate_server_side(request, current_page, paginator, "") }}
{% endmacro %}

{% macro paginate_htmx(request, current_page, paginator, htmx_target="#content") %}
    {# Add pagination buttons for pages without Alpine but supporting fragments.

    This must be coupled with a view that handles pagination
    with the Django Paginator object and supports fragments.

    The replaced fragment will be #content so make sure you are calling this macro inside your content block.

    Parameters:
        request (django.http.request.HttpRequest): the current django request
        current_page (django.core.paginator.Page): the current page object
        paginator (django.core.paginator.Paginator): the paginator object
        htmx_target (string): htmx target selector (default '#content')
    #}
  {{ paginate_server_side(request, current_page, paginator, htmx_target) }}
{% endmacro %}

{% macro paginate_server_side(request, current_page, paginator, htmx_target) %}
  <nav class="pagination">
    {% if current_page.has_previous() %}
      <a
        {% if htmx_target -%}
          hx-get="?{{ querystring(request, page=current_page.previous_page_number()) }}"
          hx-swap="innerHTML"
          hx-target="{{ htmx_target }}"
          hx-push-url="true"
          hx-trigger="click, keyup[key=='ArrowLeft'] from:body"
        {%- else -%}
          href="?{{ querystring(request, page=current_page.previous_page_number()) }}"
        {%- endif -%}
      >
        <button>
          <i class="fa fa-caret-left"></i>
        </button>
      </a>
    {% else %}
      <button disabled="disabled"><i class="fa fa-caret-left"></i></button>
    {% endif %}
    {% for i in paginator.get_elided_page_range(current_page.number) %}
      {% if i == current_page.number %}
        <button class="active">{{ i }}</button>
      {% elif i == paginator.ELLIPSIS %}
        <strong>{{ paginator.ELLIPSIS }}</strong>
      {% else %}
        <a
          {% if htmx_target -%}
            hx-get="?{{ querystring(request, page=i) }}"
            hx-swap="innerHTML"
            hx-target="{{ htmx_target }}"
            hx-push-url="true"
          {%- else -%}
            href="?{{ querystring(request, page=i) }}"
          {%- endif -%}
        >
          <button>{{ i }}</button>
        </a>
      {% endif %}
    {% endfor %}
    {% if current_page.has_next() %}
      <a
        {% if htmx_target -%}
          hx-get="?{{querystring(request, page=current_page.next_page_number())}}"
          hx-swap="innerHTML"
          hx-target="{{ htmx_target }}"
          hx-push-url="true"
          hx-trigger="click, keyup[key=='ArrowRight'] from:body"
        {%- else -%}
          href="?{{querystring(request, page=current_page.next_page_number())}}"
        {%- endif -%}
      ><button>
        <i class="fa fa-caret-right"></i>
      </button>
      </a>
    {% else %}
      <button disabled="disabled"><i class="fa fa-caret-right"></i></button>
    {% endif %}
  </nav>
{% endmacro %}

{% macro select_all_checkbox(form_id) %}
  <script type="text/javascript">
    function checkbox_{{form_id}}(value) {
      const inputs = document.getElementById("{{ form_id }}").getElementsByTagName("input");
      for (let element of inputs){
        if (element.type === "checkbox"){
          element.checked = value;
        }
      }
    }
  </script>
  <button type="button" onclick="checkbox_{{form_id}}(true);">{% trans %}Select All{% endtrans %}</button>
  <button type="button" onclick="checkbox_{{form_id}}(false);">{% trans %}Unselect All{% endtrans %}</button>
{% endmacro %}

{% macro update_notifications(messages, clear = True) %}
  {# Update notification area from new messages sent by django backend
     This is useful when performing fragment swaps to keep messages up to date
     Without this, the fragment would need to take control of the notification area and
     this would be an issue when having more than one fragment

     Parameters:
      messages: messages from django.contrib
      clear   : optional boolean that controls if notifications should be cleared first. True is the default
  #}
  {% if messages %}
    <div x-init='() => {
                 {%- if clear -%}
                   $notifications.clear();
                 {%- endif -%}
                 $notifications.addMany([
                 {%- for message in messages -%}
                   {%- if not message.extra_tags -%}
                     { tag: "{{ message.tags }}", text: {{ message|string|tojson }} },
                   {%- endif -%}
                 {%- endfor -%}
                 ])
                 }'></div>
  {% endif %}
{% endmacro %}


{% macro querystring(request) %}
  {%- set qs = request.GET.copy() -%}
  {%- do qs.update(kwargs) -%}
  {{- qs | urlencode -}}
{% endmacro %}