{% extends "@WallabagCore/layout.html.twig" %}

{% block title %}{{ 'tag.page_title'|trans }}{% endblock %}

{% block content %}
    <div class="results clearfix">
        {{ 'tag.list.number_on_the_page'|transchoice(tags|length) }}
    </div>

    <div class="row">
        <ul class="card-tag-labels">
            <li class="chip">
                <a href="{{ path('untagged') }}">{{ 'tag.list.untagged'|trans }} ({{ nbEntriesUntagged }})</a>
            </li>
            {% for tag in tags %}
                <li title="{{ tag.label }} ({{ tag.nbEntries }})" id="tag-{{ tag.id }}" class="chip">
                    <a href="{{ path('tag_entries', {'slug': tag.slug}) }}" class="card-tag-link" data-handle="tag-link">
                        {{ tag.label }}&nbsp;({{ tag.nbEntries }})
                    </a>
                    {% if renameForms is defined and renameForms[tag.id] is defined %}
                    <form class="card-tag-form hidden" data-handle="tag-rename-form" action="{{ path('tag_rename', {'slug': tag.slug}) }}" method="POST">
                        {{ form_widget(renameForms[tag.id].label, {'attr': {'value': tag.label}}) }}
                        {{ form_rest(renameForms[tag.id]) }}
                    </form>
                    <a class="card-tag-icon card-tag-rename" data-handler="tag-rename" href="javascript:void(0);">
                        <i class="material-icons">mode_edit</i>
                    </a>
                    {% endif %}
                    <a id="delete-{{ tag.slug }}" href="{{ path('tag_delete', {'slug': tag.slug}) }}" class="card-tag-icon card-tag-delete" onclick="return confirm('{{ 'tag.confirm.delete'|trans({'%name%': tag.label})|escape('js') }}')">
                        <i class="material-icons">delete</i>
                    </a>
                    {% if app.user.config.feedToken %}
                        <a rel="alternate" type="application/atom+xml" href="{{ path('tag_feed', {'username': app.user.username, 'token': app.user.config.feedToken, 'slug': tag.slug}) }}" class="card-tag-icon"><i class="material-icons">rss_feed</i></a>
                    {% endif %}
                </li>
            {% endfor %}
        </ul>
    </div>
{% endblock %}