{% load i18n %}
{% load bootstrap_icons %}
{% if request.user.is_superuser %}
    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#AddSecret">
        <span aria-hidden="true">{% bs_icon 'plus-lg' %}</span> {% trans "New secret" %}
    </button>

    <div class="modal fade" id="AddSecret" tabindex="-1" aria-labelledby="AddSecretLabel" aria-hidden="true">
        <div class="modal-dialog">
            <form method="post" class="modal-content">{% csrf_token %}
                <div class="modal-header">
                    <div>
                        <h5 class="modal-title" id="AddSecretLabel">{% trans "New secret" %}</h5>
                        <div class="small text-body-secondary">{% blocktrans with host=compute.name %}On {{ host }}{% endblocktrans %}</div>
                    </div>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans "Close" %}"></button>
                </div>
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="secret_usage_type" class="form-label">{% trans "Used for" %}</label>
                        <select id="secret_usage_type" name="usage_type" class="form-select">
                            {% for value, label in usage_choices %}<option value="{{ value }}">{{ label }}</option>{% endfor %}
                        </select>
                    </div>
                    {# the usage's label and help, and the value's, follow the type: see the script below #}
                    <div class="mb-3">
                        <label for="secret_usage" class="form-label" id="secret_usage_label">{% trans "Usage" %}</label>
                        <input id="secret_usage" name="usage" class="form-control font-monospace" required aria-describedby="secret_usage_help">
                        <div class="form-text" id="secret_usage_help"></div>
                    </div>
                    <div class="mb-3">
                        <label for="secret_value" class="form-label" id="secret_value_label">{% trans "Value" %}</label>
                        <input id="secret_value" type="password" name="value" class="form-control" autocomplete="new-password" aria-describedby="secret_value_help">
                        <div class="form-text" id="secret_value_help"></div>
                    </div>
                    <div class="form-check form-switch">
                        <input id="secret_private" type="checkbox" name="private" class="form-check-input" role="switch" aria-describedby="secret_private_help">
                        <label for="secret_private" class="form-check-label">{% trans "Private" %}</label>
                        <div class="form-text mt-0" id="secret_private_help">{% trans "Its value cannot be read back through libvirt." %}</div>
                    </div>
                    <div class="form-check form-switch">
                        <input id="secret_ephemeral" type="checkbox" name="ephemeral" class="form-check-input" role="switch" aria-describedby="secret_ephemeral_help">
                        <label for="secret_ephemeral" class="form-check-label">{% trans "Ephemeral" %}</label>
                        <div class="form-text mt-0" id="secret_ephemeral_help">{% trans "Kept in memory only: gone when libvirtd restarts." %}</div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
                    <button type="submit" class="btn btn-primary" name="create">{% trans "Create secret" %}</button>
                </div>
            </form>
        </div>
    </div>
{% endif %}