{% extends "profile_base.html" %}

{% set profile_security_active = "tokens" %}
{% block profile_content %}
      <div class="d-flex flex-wrap align-items-center justify-content-between gap-2 mb-3">
        <div>
          {% set breadcrumbs = [
            {"name": current_user.name | display_name(current_user.username), "href": "/profile"},
            {"name": "API tokens", "href": "/profile/tokens"},
            {"name": "Create"}
          ] %}
          {% include "partials/breadcrumbs.html" %}
          <h1 class="h3 mb-0">Create token</h1>
        </div>
      </div>
  {% include "partials/flash.html" %}
      <div class="card shadow-sm">
        <div class="card-body">
          <p class="text-muted mb-3">
            API tokens let you authenticate API requests and Git smart-HTTP operations from scripts and tools. You can have up to 5 active tokens at a time. Learn more in the
            <a href="/docs/api">docs</a>.
          </p>
          <form method="post" action="/profile/tokens" autocomplete="off">
            <input type="hidden" name="csrf_token" value="{{ form.csrf_token }}">
            <div class="mb-3">
              <label class="form-label" for="name">Token name</label>
              <div class="row g-2">
                <div class="col-12 col-md-6">
                  <div class="input-group">
                    <input
                      class="form-control"
                      id="name"
                      name="name"
                      type="text"
                      value="{{ form.name }}"
                      placeholder="e.g. Laptop"
                      required
                      {% if token_limit_reached %}disabled{% endif %}
                    >
                  </div>
                  <div class="form-text">A label to help you recognize the token later.</div>
                </div>
              </div>
              <div class="row g-2 mt-2">
                <div class="col-12 col-md-6">
                  <label class="form-label" for="expires-in">Expires</label>
                  <select
                    class="form-select"
                    id="expires-in"
                    name="expires_in"
                    {% if token_limit_reached %}disabled{% endif %}
                  >
                    {% set expires_in_value = form.expires_in | default('1m', true) %}
                    <option value="1h" {% if expires_in_value == "1h" %}selected{% endif %}>1 hour</option>
                    <option value="1d" {% if expires_in_value == "1d" %}selected{% endif %}>1 day</option>
                    <option value="3d" {% if expires_in_value == "3d" %}selected{% endif %}>3 days</option>
                    <option value="1w" {% if expires_in_value == "1w" %}selected{% endif %}>1 week</option>
                    <option value="1m" {% if expires_in_value == "1m" %}selected{% endif %}>1 month</option>
                    <option value="1y" {% if expires_in_value == "1y" %}selected{% endif %}>1 year</option>
                  </select>
                  <div class="form-text">Defaults to 1 month.</div>
                </div>
              </div>
              {% if token_limit_reached %}
                <div class="form-text text-danger">You already have 5 active API tokens. Revoke one to create another.</div>
              {% endif %}
            </div>
            <div class="mt-4">
              {% with
                primary_label="Create token",
                primary_disabled=token_limit_reached,
                cancel_href="/profile/tokens"
              %}
                {% include "partials/form_actions.html" %}
              {% endwith %}
            </div>
          </form>
        </div>
      </div>
{% endblock %}