{% from "_macros.html" import icon %}
{#
  The chat's settings, as a side panel: everything about this chat that
  is not what you reach for while writing.

  It gathers what was in three places: the composer's tools menu (the switches
  for this chat), the header's overflow menu (Keep this chat, Chat settings,
  Compact) and the strip of prompt and sampling fields that menu
  opened under the header. Reached from the composer's settings -- "More
  settings" -- and, on a phone, from the window switch while it is open. A side
  panel like the inspector, in its slot and their toggle group,
  so only one of them is open at a time.

  On the new-chat screen it holds only the switches, and they post nothing:
  they are fields of the composer's form by `form="composer-form"`, carried by
  the first message -- the harness puts a tool's guidance in front of the model
  the moment the tool is offered, so this has to be decidable before the first
  turn. Checked means ON; every gate also has a hidden input naming it, always
  submitted, and `start_chat` subtracts one list from the other.

  On a chat that exists every control saves on change, so there is no
  half-applied state. The verb is on the control, never on a wrapper: the
  element carrying `name` has to be the element carrying the request
  (tests/conftest.py:control_named).
#}
<aside class="chat-settings" id="chat-settings" hidden aria-label="{{ t('Chat settings') }}">
  <div class="panel-head">
    <h2 class="panel-head__title">{{ icon("sliders", "icon--sm") }} {{ t("Chat settings") }}</h2>
    <button class="btn btn--icon btn--sm" type="button" data-toggle="#chat-settings"
            aria-label="{{ t('Close chat settings') }}">
      {{ icon("x", "icon--sm") }}
    </button>
  </div>

  <div class="chat-settings__body">
    {% if chat and chat.temporary %}
    <section class="chat-settings__section">
      <p class="field__hint">{{ t("Makes it an ordinary chat that can save. Otherwise it is deleted %(after)s.", after=temporary_after) }}</p>
      <button class="btn btn--sm" type="button" hx-post="/api/chats/{{ chat.id }}/keep" hx-swap="none">
        {{ icon("pin", "icon--sm") }} {{ t("Keep this chat") }}
      </button>
    </section>
    {% endif %}

    {% if chat and current_model and current_model.description %}
    <p class="panel__note">{{ current_model.description }}</p>
    {% endif %}

    {% if scope_families or scope_skills %}
    <section class="chat-settings__section">
      <h3 class="chat-settings__heading">{{ t("Tools") if scope_families else t("Skills") }}</h3>
      <p class="field__hint">{{ t("Switched off here only. What is on to begin with is your default for this model, in Settings → Models.") }}</p>

      {% if scope_families %}
      <div class="chat-settings__checks">
        {% for family in scope_families %}
        <label class="checkbox">
          {% if scope_prospective %}
          <input type="hidden" name="scope_all" value="{{ family.gate }}" form="composer-form">
          <input type="checkbox" name="scope_on" value="{{ family.gate }}" form="composer-form"
                 {{ 'checked' if family.on }}>
          {% else %}
          <input type="checkbox" name="on" value="true"
                 {{ 'checked' if family.on }}
                 hx-post="/api/chats/{{ chat.id }}/scope" hx-swap="none"
                 hx-vals='{"kind": "family", "name": "{{ family.gate }}"}'>
          {% endif %}
          <span>{{ family.label }}</span>
        </label>
        {% endfor %}
      </div>
      {% endif %}

      {% if scope_skills %}
      {% if scope_families %}<h3 class="chat-settings__heading">{{ t("Skills") }}</h3>{% endif %}
      <div class="chat-settings__checks">
        {% for skill in scope_skills %}
        <label class="checkbox" {% if skill.description %}title="{{ skill.description }}"{% endif %}>
          {% if scope_prospective %}
          <input type="hidden" name="scope_skill_all" value="{{ skill.name }}" form="composer-form">
          <input type="checkbox" name="scope_skill_on" value="{{ skill.name }}" form="composer-form"
                 {{ 'checked' if skill.on }}>
          {% else %}
          <input type="checkbox" name="on" value="true"
                 {{ 'checked' if skill.on }}
                 hx-post="/api/chats/{{ chat.id }}/scope" hx-swap="none"
                 hx-vals='{"kind": "skill", "name": "{{ skill.name }}"}'>
          {% endif %}
          <span>{{ skill.name }}</span>
        </label>
        {% endfor %}
      </div>
      {% endif %}
    </section>
    {% endif %}

    {# What this chat has been told to stop asking about, one entry per press of
       "Always allow this" on an approval card. Shown because a standing
       permission nobody can see is one nobody can revoke -- and because the
       entry for a command is the exact command line, which is worth being able
       to read back. Clear swaps the whole block for nothing; htmx does not swap
       on a 204, which is why the route returns an empty body. #}
    {% if scope_allow %}
    <section class="chat-settings__section chat-settings__allow">
      <h3 class="chat-settings__heading">{{ t("Always allowed here") }}</h3>
      {% for entry in scope_allow %}
      <p class="chat-settings__allow-entry">{{ entry }}</p>
      {% endfor %}
      <button class="btn btn--sm" type="button"
              hx-post="/api/chats/{{ chat.id }}/allow/clear"
              hx-target="closest .chat-settings__allow" hx-swap="outerHTML">
        {{ icon("trash", "icon--sm") }} {{ t("Ask me about these again") }}
      </button>
    </section>
    {% endif %}

    {% if chat and can.get("chat.system_prompt") %}
    <section class="chat-settings__section">
      <div class="field">
        <label class="field__label" for="system-prompt">{{ t("System prompt") }}</label>
        <textarea class="textarea" id="system-prompt" name="system_prompt" rows="4"
                  placeholder="{{ inherited_prompt or t('Instructions that apply to every message in this chat.') }}"
                  hx-patch="/api/chats/{{ chat.id }}" hx-swap="none"
                  hx-trigger="change">{{ chat.system_prompt }}</textarea>
        <p class="field__hint">
          {% if inherited_from == "folder" %}
            {{ t("Leave empty to use the folder prompt shown above.") }}
          {% elif inherited_from == "model" %}
            {{ t("Leave empty to use the model prompt shown above.") }}
          {% elif inherited_prompt %}
            {{ t("Leave empty to use the instance prompt shown above.") }}
          {% else %}
            {{ t("Overrides the model and instance prompts for this chat only.") }}
          {% endif %}
        </p>
      </div>
    </section>
    {% endif %}

    {% if chat and can.get("chat.params") %}
    {# One column in a panel 24rem wide: three numbers side by side there are
       three boxes too narrow to read what is in them. #}
    <section class="chat-settings__section">
      <div class="field">
        <label class="field__label" for="temperature">{{ t("Temperature") }}</label>
        <input class="input" id="temperature" name="temperature" type="number"
               min="0" max="2" step="0.05" placeholder="{{ t('default') }}"
               value="{{ chat.params_json.get('temperature') if chat.params_json.get('temperature') is not none else '' }}"
               hx-patch="/api/chats/{{ chat.id }}" hx-swap="none" hx-trigger="change">
      </div>
      <div class="field">
        <label class="field__label" for="top-p">{{ t("Top-p") }}</label>
        <input class="input" id="top-p" name="top_p" type="number"
               min="0" max="1" step="0.05" placeholder="{{ t('default') }}"
               value="{{ chat.params_json.get('top_p') if chat.params_json.get('top_p') is not none else '' }}"
               hx-patch="/api/chats/{{ chat.id }}" hx-swap="none" hx-trigger="change">
      </div>
      <div class="field">
        <label class="field__label" for="max-tokens">{{ t("Max tokens") }}</label>
        <input class="input" id="max-tokens" name="max_tokens" type="number"
               min="1" step="1" placeholder="{{ t('default') }}"
               value="{{ chat.params_json.get('max_tokens') if chat.params_json.get('max_tokens') is not none else '' }}"
               hx-patch="/api/chats/{{ chat.id }}" hx-swap="none" hx-trigger="change">
      </div>
      <p class="field__hint">{{ t("Leave a field empty to let the provider decide. Values outside the allowed range are ignored rather than clamped.") }}</p>
    </section>
    {% endif %}

    {% if chat and messages %}
    {# Runs the same code as /compact rather than posting itself. Two
       implementations meant a spinner on neither and the endpoint's error
       messages reaching nobody. #}
    <section class="chat-settings__section">
      <p class="field__hint">{{ t("Summarise the earlier turns so they stop costing context") }}</p>
      <button class="btn btn--sm" type="button"
              onclick="window.lembasCommands &amp;&amp; window.lembasCommands.run('compact')">
        {{ icon("archive", "icon--sm") }} {{ t("Compact") }}
      </button>
    </section>
    {% endif %}

    {#- What the chat may reach in the file tree, and taking back what it
        changed there (api/access_ui.py, api/tree.py). Not for an agent chat,
        whose files are on its device. -#}
    {% if chat and chat.kind != "agent" %}
    <section class="chat-settings__section">
      <h3 class="chat-settings__heading">{{ t("Files") }}</h3>
      <div class="btn-row">
        <a class="btn btn--sm" href="/chat/{{ chat.id }}/access" data-testid="chat-access">
          {{ icon("shield", "icon--sm") }} {{ t("What it may reach") }}</a>
        <a class="btn btn--sm" href="/chat/{{ chat.id }}/undo" data-testid="chat-undo">
          {{ icon("refresh", "icon--sm") }} {{ t("Undo its file changes") }}</a>
      </div>
    </section>
    {% endif %}

    <p class="field__hint chat-settings__foot">
      <a href="/settings?tab=models#model-defaults">{{ t("Your defaults per model") }}</a>
    </p>
  </div>
</aside>