{% extends "_layouts/cp" %}

{% block actionButton %}

    <div class="btngroup">
        <a class="btn submit add icon"
           href="{{ cpUrl(baseCpPath ~ '/new') }}">{{ 'Add New Key Pair'|t('keychain') }}</a>
        <div class="btn submit menubtn"></div>
        <div class="menu">
            <ul>
                <li><a class="formsubmit"
                       href="{{ cpUrl(baseCpPath ~ '/new-openssl') }}">{{ "Create New OpenSSL Key Pair"|t('app') }}</a>
                </li>
            </ul>
        </div>
    </div>
{% endblock %}

{% block content %}
    <div class="elements">
        <div class="tableview">
            <table class="data fullwidth">
                <thead>
                <tr>
                    <td scope="col" data-attribute="description">Description</td>
                    <td scope="col" data-attribute="dateCreated">Date Created</td>
                    <td scope="col" data-attribute="dateUpdated">Date Updated</td>
                </tr>
                </thead>
                <tbody>
                {% for keypair in keypairs %}
                    <tr data-id="">
                        <td data-title="description">
                            <div class="element small hasstatus "
                                 data-status="active" data-url="{{ cpUrl('keychain/' ~ keypair.id) }}"
                                 data-level="" data-editable="">
                                <span class="status {% if keypair.enabled %}active{% else %}inactive{% endif %}"></span>
                                <div class="label">
                                    <span class="title">
                                        <a href="{{ cpUrl(baseCpPath ~'/' ~ keypair.id) }}">{{ keypair.description }}</a>
                                    </span>
                                </div>
                            </div>
                        </td>
                        <td data-title="Date Created">{{ keypair.dateCreated|date }}</td>
                        <td data-title="Date Updated">{{ keypair.dateUpdated|date }}</td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
{% endblock %}