{% extends "_layouts/cp" %}
{% set title = "Category Groups"|t('app') %}

{% set extraPageHeaderHtml %}
    <div class="buttons right">
        <a href="{{ url('settings/categories/new') }}" class="btn submit add icon">{{ "New category group"|t('app') }}</a>
    </div>
{% endset %}

{% set crumbs = [
    { label: "Settings"|t('app'), url: url('settings') }
] %}

{% set docsUrl = 'http://craftcms.com/docs/categories' %}


{% block content %}
    <div id="nocategorygroups"{% if categoryGroups|length %} class="hidden"{% endif %}>
        <p>{{ "No category groups exist yet."|t('app') }}</p>
    </div>

    {% if categoryGroups|length %}
        <table id="categorygroups" class="data collapsible">
            <thead>
                <th scope="col">{{ "Name"|t('app') }}</th>
                <th scope="col">{{ "Handle"|t('app') }}</th>
                <td></td>
                <td class="thin"></td>
            </thead>
            <tbody>
                {% for group in categoryGroups %}
                    <tr data-id="{{ group.id }}" data-name="{{ group.name|t('site') }}">
                        <th scope="row" data-title="{{ 'Name'|t('app') }}"><a href="{{ url('settings/categories/' ~ group.id) }}">{{ group.name|t('site') }}</a></th>
                        <td data-title="{{ 'Handle'|t('app') }}"><code>{{ group.handle }}</code></td>
                        <td><a href="{{ url('categories/'~group.handle) }}">{{ "Manage categories"|t('app') }}</a></td>
                        <td class="thin"><a class="delete icon" title="{{ 'Delete'|t('app') }}" role="button"></a></td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    {% endif %}
{% endblock %}


{% js %}
    new Craft.AdminTable({
        tableSelector: '#categorygroups',
        noItemsSelector: '#nocategorygroups',
        deleteAction: 'categories/delete-category-group',
        confirmDeleteMessage: '{{ "Are you sure you want to delete “{name}” and all its categories?"|t('app') }}',
    });
{% endjs %}