{# The Configuration page (spec §7.1, task 104).

   Two forms and a table, in that order: the things that can be changed while
   the gateway runs, then everything that cannot. The table is last because it
   is read once, when something is not behaving the way the file says it should.

   The username and password boxes sit in a reveal panel governed by the switch,
   so a gateway meant to stay open does not show two boxes nobody will fill in.
   With no script the panel is simply visible and the form submits the same
   fields — see static/js/forms.js. #}
{% extends "base.html" %}
{% from "partials/field.html" import choice, field, generate, secret, switch %}

{% block title %}Configuration · mcp-api-gateway{% endblock %}

{% block scripts %}
<script src="{{ static_url('js/forms.js') }}" defer></script>
{% endblock %}

{% block content %}
<div class="toolbar">
  <h1 class="toolbar__title">Configuration</h1>
</div>

<form class="card form form--wide" method="post" action="{{ admin.path }}">
  <h2 class="card__title">Admin login</h2>
  <p class="form__lead">{{ admin.lead }}</p>
  {{ switch(admin.enabled_field, "Require a login for the configuration and monitoring pages",
            checked=admin.enabled, reveal=admin.group) }}
  <div class="reveal" data-reveal-for="{{ admin.group }}" data-reveal-when="on">
    {{ field(admin.username_field, "Username", value=admin.username,
             error=admin.errors.get(admin.username_field)) }}
    {{ secret(admin.password_field, "Password", hint=admin.password_hint,
              error=admin.errors.get(admin.password_field)) }}
  </div>
  <div class="form-actions">
    <button class="button" type="submit">Save</button>
  </div>
</form>

{# The bearer token on /mcp (task 126). Second rather than last: this and the
   card above it are the gateway's two doors, and a page with one of them at the
   top and the other below the metrics export would make them look unrelated.

   Two nested reveal panels, as on the export card: the switch governs the whole
   thing, and "Replace the token" governs the box holding one — which is only
   offered when there is a token to replace. The Generate button is hidden until
   forms.js unhides it, because a button that fills a box needs a script to fill
   it with; without one the hint says how to make a token at a shell. #}
<form class="card card--below form form--wide" method="post" action="{{ mcp.form_path }}">
  <h2 class="card__title">MCP endpoint</h2>
  <p class="form__lead">{{ mcp.lead }}</p>
  {{ switch(mcp.enabled_field, "Require a bearer token on " ~ mcp.path,
            checked=mcp.enabled, reveal=mcp.group) }}
  <div class="reveal" data-reveal-for="{{ mcp.group }}" data-reveal-when="on">
    {% if mcp.has_token %}
    {{ switch(mcp.replace_field, "Replace the token", reveal=mcp.token_group,
              hint=mcp.token_hint) }}
    <div class="reveal" data-reveal-for="{{ mcp.token_group }}" data-reveal-when="on">
      {{ field(mcp.token_field, "Bearer token", hint=mcp.replace_hint,
               error=mcp.errors.get(mcp.token_field)) }}
      {{ generate(mcp.token_field) }}
    </div>
    {% else %}
    {{ field(mcp.token_field, "Bearer token", hint=mcp.token_hint,
             error=mcp.errors.get(mcp.token_field)) }}
    {{ generate(mcp.token_field) }}
    {% endif %}
    <p class="form__note">{{ mcp.guards }}</p>
  </div>
  <div class="form-actions">
    <button class="button" type="submit">Save</button>
  </div>
</form>

<form class="card card--below form form--wide" method="post" action="{{ auto_refresh.path }}">
  <h2 class="card__title">Automatic refresh</h2>
  {{ field(auto_refresh.field, "Minutes between refreshes", value=auto_refresh.typed,
           type="number", placeholder=auto_refresh.configured, hint=auto_refresh.hint,
           error=auto_refresh.error) }}
  <div class="form-actions">
    <button class="button" type="submit">Save</button>
  </div>
</form>

{# The metrics export (task 125). Two nested reveal panels: the switch governs
   the whole thing, and inside it "Replace the licence key" governs the box
   holding one — which is only offered when there is a key to replace. With no
   script both panels are simply visible and the form submits the same fields. #}
<form class="card card--below form form--wide" method="post" action="{{ export.path }}">
  <h2 class="card__title">Metrics export</h2>
  <p class="form__lead">{{ export.lead }}</p>
  {{ switch(export.enabled_field, "Send the usage counters to New Relic",
            checked=export.enabled, reveal=export.group) }}
  <div class="reveal" data-reveal-for="{{ export.group }}" data-reveal-when="on">
    {{ choice(export.region_field, "Region", export.regions, export.region,
              error=export.errors.get(export.region_field)) }}
    {{ field(export.service_field, "Service name", value=export.service_name,
             hint=export.service_hint,
             error=export.errors.get(export.service_field)) }}
    {% if export.has_key %}
    {{ switch(export.replace_field, "Replace the licence key", reveal=export.key_group,
              hint=export.key_hint) }}
    <div class="reveal" data-reveal-for="{{ export.key_group }}" data-reveal-when="on">
      {{ secret(export.key_field, "Licence key",
                error=export.errors.get(export.key_field)) }}
    </div>
    {% else %}
    {{ secret(export.key_field, "Licence key", hint=export.key_hint,
              error=export.errors.get(export.key_field)) }}
    {% endif %}
    <p class="form__note">{{ export.what_is_sent }}</p>
  </div>
  {% if export.status %}
  <p class="form__note{% if export.failing %} form__note--warning{% endif %}">{{ export.status }}</p>
  {% endif %}
  <div class="form-actions">
    <button class="button" type="submit">Save</button>
  </div>
</form>

{# Its own form, because it is its own decision: everywhere else on this page an
   empty box means "leave this alone", so taking a secret away has to be asked
   for rather than done by clearing a field. #}
{% if export.has_key %}
<form class="card-aside" method="post" action="{{ export.key_path }}">
  <button class="button button--quiet" type="submit">Forget the stored licence key</button>
</form>
{% endif %}

<section class="card card--below">
  <h2 class="card__title">Everything else in force</h2>
  <p class="form__lead">{{ config_note }} These take a restart to change.</p>
  <table class="table">
    <thead>
      <tr>
        <th scope="col">Setting</th>
        <th scope="col">Value</th>
        <th scope="col">Where it came from</th>
      </tr>
    </thead>
    <tbody>
      {% for fact in facts %}
      <tr>
        <th scope="row"><code>{{ fact.key }}</code></th>
        <td>{{ fact.value }}</td>
        <td>{{ fact.source }}</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</section>
{% endblock %}