{% extends "musician/base.html" %}
{% load i18n %}

{% block content %}
{% if active_domain %}
<a class="btn-arrow-left" href="{% url 'musician:mails' %}">{% trans "Go to global" %}</a>
{% endif %}

<h1 class="service-name">{{ service.verbose_name }}{% if active_domain %} <span class="font-weight-light">{% trans "for" %} {{ active_domain.name }}</span>{% endif %}</h1>
<p class="service-description">{{ service.description }}</p>
<table class="table service-list">
    <colgroup>
        <col span="1" style="width: 25%;">
        <col span="1" style="width: 50%;">
        <col span="1" style="width: 5%;">
        <col span="1" style="width: 20%;">
    </colgroup>
    <thead class="thead-dark">
        <tr>
            <th scope="col">{% trans "Mail address" %}</th>
            <th scope="col">{% trans "Aliases" %}</th>
            <th scope="col">{% trans "Type" %}</th>
            <th scope="col">{% trans "Type details" %}</th>
        </tr>
    </thead>
    <tbody>
        {% for obj in object_list %}
        <tr>
            <td>{{ obj.mail_address }}</td>
            <td>{{ obj.aliases|join:" , " }}</td>
            <td>{{ obj.type|capfirst }}</td>
            <td>
                {% if obj.type == 'mailbox' %}
                {% include "musician/components/usage_progress_bar.html" with detail=obj.type_detail %}
                {% else %}
                {{ obj.type_detail }}
                {% endif %}
            </td>
        </tr>
        {% endfor %}
    </tbody>
    {% include "musician/components/table_paginator.html" %}
</table>
{% endblock %}
