{% extends "projector/project/detail.html" %}

{% load i18n %}
{% load guardian_tags %}
{% load richtemplates_tags %}

{% block col-single-extra %}

{% get_obj_perms request.user for project as "project_perms" %}

<div class="richtemplates-panel">
    <h5>{% trans "Project's components" %}</h5>
    <div class="richtemplates-panel-content">
    {% block components-menu %}
    <ul class="nav-inline">
        <li class="richbuttonset">
            <a class="button-link" href="{{ project.get_components_url }}">{% trans "Components" %}</a>
            {% if "change_project" in project_perms %}
            <a class="button-link" href="{{ project.get_component_add_url }}">{% trans "Add component" %}</a>
            {% endif %}
        </li>
        <li>
            {% if "change_project" in project_perms and component %}
            <a class="button-link richbutton-wrench" href="{{ component.get_edit_url }}">{% trans "Edit" %}</a>
            {% endif %}
        </li>
    </ul>
    {% endblock %}

    {% load pagination_tags %}
    {% load sorting_tags %}

    {% autosort component_list %}
    {% autopaginate component_list %}

    <table class="datatable">
        <thead class="datatable-thead">
            <tr class="datatable-thead-subheader">
                <th>{% anchor name _("Component") %}</th>
                <th>{% anchor task__count _("Tasks") %}</th>
            </tr>
        </thead>
        <tbody class="datatable-tbody">
            {% for component in component_list %}
            <tr class="{% cycle "odd" "even" %} hoverable">
                <td><a class="block-link {% if component.description %}show-tipsy{% endif %}"
                        href="{% url projector_project_component_detail project.author.username project.slug component.slug %}"
                        title="{{ component.description }}">{{ component.name }}</a>
                </td>
                <td><a class="block-link show-tipsy centered"
                        title="{% trans "Show all related tasks" %}"
                        href="{{ project.get_task_list_url }}?component={{ component.id }}"
                        >{{ component.task__count }}</a>
                </td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
    

</div>
</div>

{% endblock %}

