{% macro panel(base, a, csrf, what) %}
<section class="panel" id="assistants">
  <h2>AI assistants</h2>
  <p class="small mute">{{ what }} An assistant reviews a proposal when asked, or drafts its description; its answers are shown as the person who asked, via the assistant. It never approves.</p>
  {% if !a.inherited.is_empty() %}
  <h3>Inherited</h3>
  <ul class="hooks">
  {% for i in a.inherited %}
  <li class="hook">
    <div class="hook-head"><strong>{{ i.assistant.name }}</strong> <span class="tag">{{ i.assistant.model }}</span>
      {% if i.on() %}<span class="tag head">on</span>{% else if i.off_above %}<span class="tag dim">off above</span>{% else %}<span class="tag dim">off</span>{% endif %}
      <span class="small mute">from {{ i.from }}</span></div>
  </li>
  {% endfor %}
  </ul>
  {% endif %}
  {% if a.own.is_empty() %}<p class="mute small">{% if a.inherited.is_empty() %}None.{% else %}None of its own.{% endif %}</p>{% else %}
  <ul class="hooks">
  {% for o in a.own %}{% let r = o.assistant %}
  <li class="hook">
    <div class="hook-head">
      <strong>{{ r.name }}</strong> <span class="tag">{{ r.model }}</span> <span class="tag">{{ r.api }}</span>
      {% if o.on() %}<span class="tag head">on</span>{% else if o.off_above %}<span class="tag dim" title="An assistant of this name is turned off at a level above">off above</span>{% else %}<span class="tag dim">off</span>{% endif %}
    </div>
    <p class="small mute"><code>{{ r.endpoint }}</code> · token {% if r.has_token() %}set{% else %}none{% endif %} · context {{ r.budget }} characters</p>
    <form class="tiny" method="post" action="{{ base }}/assistants"><input type="hidden" name="_csrf" value="{{ csrf }}"><input type="hidden" name="id" value="{{ r.id }}"><button name="action" value="test" title="Send a one-line message and show the answer or the error">TEST CONNECTION</button> <button name="action" value="toggle">{% if r.enabled %}turn off{% else %}turn on{% endif %}</button> <button name="action" value="delete" class="danger-btn" data-confirm="Delete {{ r.name }}?">delete</button></form>
    <details class="hook-edit"><summary class="small">edit</summary>
      <form class="card" method="post" action="{{ base }}/assistants">
        <input type="hidden" name="_csrf" value="{{ csrf }}"><input type="hidden" name="id" value="{{ r.id }}"><input type="hidden" name="action" value="update">
        <label for="an{{ r.id }}">Name</label><input type="text" id="an{{ r.id }}" name="name" value="{{ r.name }}">
        <label for="ae{{ r.id }}">Endpoint</label><input type="text" id="ae{{ r.id }}" name="endpoint" value="{{ r.endpoint }}" autocomplete="off">
        <label for="aa{{ r.id }}">API</label>
        <select id="aa{{ r.id }}" name="api">{% for api in a.apis %}<option value="{{ api }}"{% if r.api == *api %} selected{% endif %}>{{ api }}</option>{% endfor %}</select>
        <label for="am{{ r.id }}">Model</label>
        <div class="model-row"><input type="text" id="am{{ r.id }}" name="model" value="{{ r.model }}" list="am{{ r.id }}-list" autocomplete="off"><button type="button" class="small" data-list-models="{{ base }}/assistants/models" data-for="am{{ r.id }}" data-id="{{ r.id }}" data-csrf="{{ csrf }}">LIST MODELS</button></div>
        <datalist id="am{{ r.id }}-list"></datalist>
        <p class="small mute" data-models-note="am{{ r.id }}"></p>
        <label for="at{{ r.id }}">Token</label><input type="password" id="at{{ r.id }}" name="token" placeholder="{% if r.has_token() %}unchanged{% else %}none{% endif %}" autocomplete="new-password">
        <label for="ah{{ r.id }}">Extra headers</label><textarea id="ah{{ r.id }}" name="headers" rows="2" placeholder="Name: value">{{ r.headers }}</textarea>
        <label for="ab{{ r.id }}">Context budget (characters)</label><input type="text" id="ab{{ r.id }}" name="budget" value="{{ r.budget }}">
        <div class="choice"><label><input type="checkbox" name="enabled" value="1"{% if r.enabled %} checked{% endif %}> on</label></div>
        <button type="submit">SAVE</button>
      </form>
    </details>
  </li>
  {% endfor %}
  </ul>{% endif %}
  <form class="card" method="post" action="{{ base }}/assistants">
    <input type="hidden" name="_csrf" value="{{ csrf }}"><input type="hidden" name="action" value="add">
    <h3>Add an assistant</h3>
    <label for="apreset">Provider</label>
    <select id="apreset" name="preset" data-preset-select>
      {% for p in a.presets %}<option value="{{ p.0 }}" data-name="{{ p.2 }}" data-endpoint="{{ p.3 }}" data-api="{{ p.4 }}">{{ p.1 }}</option>{% endfor %}
      <option value="">Other (enter the endpoint)</option>
    </select>
    <label for="aname">Name</label><input type="text" id="aname" name="name" placeholder="Claude">
    <p class="small mute">How it shows on reviews ("you via Claude"); the provider's name when left empty.</p>
    <label for="aendpoint">Endpoint</label><input type="text" id="aendpoint" name="endpoint" placeholder="https://api.anthropic.com/v1/messages" autocomplete="off">
    <label for="aapi">API</label>
    <select id="aapi" name="api">{% for api in a.apis %}<option value="{{ api }}">{{ api }}{% if *api == "chat-completions" %} (OpenAI, Gemini, DeepSeek, Mistral, Ollama, most others){% else %} (Anthropic){% endif %}</option>{% endfor %}</select>
    <label for="atoken">Token</label><input type="password" id="atoken" name="token" autocomplete="new-password">
    <p class="small mute">Sent as a bearer token, or as the API key for Anthropic; kept sealed on the server and never shown again. Leave it empty for an endpoint that needs none.</p>
    <label for="amodel">Model</label>
    <div class="model-row"><input type="text" id="amodel" name="model" list="amodel-list" placeholder="pick from List models" required autocomplete="off"><button type="button" class="small" data-list-models="{{ base }}/assistants/models" data-for="amodel" data-csrf="{{ csrf }}">LIST MODELS</button></div>
    <datalist id="amodel-list"></datalist>
    <p class="small mute" data-models-note="amodel">The endpoint's own list, once the provider and token are set. A model it does not list is refused on save.</p>
    <label for="aheaders">Extra headers</label><textarea id="aheaders" name="headers" rows="2" placeholder="Name: value"></textarea>
    <label for="abudget">Context budget (characters)</label><input type="text" id="abudget" name="budget" value="{{ a.default_budget }}">
    <div class="choice"><label><input type="checkbox" name="enabled" value="1" checked> on</label></div>
    <button type="submit">ADD AND TEST</button>
  </form>
  <form class="card" method="post" action="{{ base }}/assistants">
    <input type="hidden" name="_csrf" value="{{ csrf }}"><input type="hidden" name="action" value="prompt">
    <h3>Prompt</h3>
    {% for (from, text) in a.inherited_prompts %}<details><summary class="small mute">From {{ from }}</summary><pre class="snippet">{{ text }}</pre></details>{% endfor %}
    <label for="aprompt">What every assistant is told here{% if !a.inherited_prompts.is_empty() %}, after the prompts above{% endif %}</label>
    <textarea id="aprompt" name="prompt" rows="6" placeholder="Review for correctness first. This project is written in Rust; the style guide is in docs/style.md.">{{ a.prompt }}</textarea>
    <button type="submit">SAVE PROMPT</button>
  </form>
</section>
{% endmacro %}