{% extends 'generic/_base.html' %}
{% load i18n %}
{% load helpers %}

{% block title %}{% trans "Add Client Credential" %}{% endblock %}

{% block tabs %}
  <ul class="nav nav-tabs" role="presentation">
    <li class="nav-item">
      <a class="nav-link active" href="#">{% trans "Secret" %}</a>
    </li>
  </ul>
{% endblock tabs %}

{% block content %}
<form action="" method="post" class="object-edit mt-5">
    {% csrf_token %}
    <div id="form_fields">
        <div class="field-group mb-5">
            <div class="row mb-3">
                <div class="col-sm-3 text-lg-end">
                    <label class="col-form-label d-inline-block">
                        {% trans "Client Name" %}
                    </label>
                </div>
                <div class="col">
                    <p class="form-control-plaintext">{{ object.client_name }}</p>
                </div>
            </div>

            <div class="row mb-3">
                <div class="col-sm-3 text-lg-end">
                    <label class="col-form-label d-inline-block">
                        {% trans "Client ID" %}
                    </label>
                </div>
                <div class="col">
                    <div class="input-group">
                        <input type="text" class="form-control" value="{{ object.client_id }}" readonly data-clipboard="client-id">
                        <button type="button" title="{% trans 'Copy to clipboard' %}" class="btn copy-content" data-clipboard-target="[data-clipboard='client-id']">
                            <i class="mdi mdi-content-copy"></i>
                        </button>
                    </div>
                </div>
            </div>

            <div class="row mb-3">
                <div class="col-sm-3 text-lg-end">
                    <label class="col-form-label d-inline-block">
                        {% trans "Client Secret" %}
                    </label>
                </div>
                <div class="col">
                    <div class="input-group">
                        <input type="text" class="form-control" value="{{ object.client_secret }}" readonly data-clipboard="client-secret">
                        <button type="button" title="{% trans 'Copy to clipboard' %}" class="btn copy-content" data-clipboard-target="[data-clipboard='client-secret']">
                            <i class="mdi mdi-content-copy"></i>
                        </button>
                    </div>
                    <small class="form-text text-muted">
                        <strong>{% trans "You can only view your secret once. Be sure to save it before leaving." %}</strong>
                    </small>
                </div>
            </div>

            <div class="row mb-3">
                <div class="col text-end">
                    <a href="{% url 'plugins:netbox_diode_plugin:client_credential_list' %}" class="btn btn-primary">
                        {% trans "Return to List" %}
                    </a>
                </div>
            </div>
        </div>
    </div>
</form>
{% endblock %} 