{# Guided agent setup (ADR-0018's onboarding half, ticket 20). Every fact is the
   service's own (`clear_record.service.setup`): the resolved endpoint and model,
   the config problems, and what a probe found. The console only renders and
   translates — it never recomputes the service's answer.

   A credential is never shown and never written: `api_key_env` is a variable
   NAME, and a local endpoint has none at all. #}
<div class="agent-setup" id="agent-setup">
  <div class="row agent-setup-head">
    {% if setup.state == 'ready' %}
    <span class="badge status-ok">{{ tr("agent ready") }}</span>
    {% elif setup.state == 'problem' %}
    <span class="badge status-error">{{ tr("agent config problem") }}</span>
    {% else %}
    <span class="badge status-missing">{{ tr("no endpoint configured") }}</span>
    {% endif %}
    <button class="btn btn-sm btn-ghost" type="button"
            hx-get="/ui/agent-setup/detect" hx-target="#agent-setup" hx-swap="innerHTML"
            title="{{ tr('Look for a local OpenAI-compatible server and test it') }}">{{ tr("Detect") }}</button>
  </div>

  {% if error %}<div class="run-error" role="alert">{{ error }}</div>{% endif %}
  {% if notice %}<p class="muted agent-setup-notice">{{ notice }}</p>{% endif %}

  {% if setup.state == 'ready' %}
  <p class="muted">{{ tr("Endpoint: {endpoint}", endpoint=setup.endpoint or tr("the configured command template")) }}</p>
  {% if setup.model %}<p class="muted">{{ tr("Model: {model}", model=setup.model) }}</p>{% endif %}
  {% if setup.api_key_env %}<p class="muted">{{ tr("Key read from the environment variable {name}; never stored.", name=setup.api_key_env) }}</p>{% endif %}
  {% if setup.commands %}<p class="muted">{{ tr("Command templates: {kinds}", kinds=setup.commands | join(', ')) }}</p>{% endif %}
  {% else %}
  <p class="muted agent-setup-note">{{ tr("No agent endpoint is configured yet, so agent tasks cannot run. Start a local OpenAI-compatible server (Ollama, LM Studio or llama.cpp) and detect it, or enter an address below.") }}</p>
  {% endif %}

  {% for problem in setup.problems %}
  {# The service's own wording, translated for display; the console never
     restates the rule that raised it. #}
  <div class="webhooks-problem" role="alert">{{ tr(problem) }}</div>
  {% endfor %}

  {% if setup.detection %}
  <ul class="agent-setup-probes">
    {% for probe in setup.detection.probes %}
    <li class="agent-probe">
      <div class="row">
        <strong>{{ probe.candidate.label }}</strong>
        <code class="muted">{{ probe.candidate.base_url }}</code>
        {% if probe.verified %}
        <span class="badge status-ok">{{ tr("verified") }}</span>
        {% elif probe.reachable %}
        <span class="badge status-queued">{{ tr("reachable") }}</span>
        {% else %}
        <span class="badge status-missing">{{ tr("not running") }}</span>
        {% endif %}
      </div>
      {% if probe.verified %}
      <div class="muted">{{ tr("Verified with a test call to {model}.", model=probe.verified_model or tr("the server's model")) }}</div>
      {% elif probe.reachable %}
      {% if probe.verify_detail %}<div class="run-error" role="alert">{{ probe.verify_detail.render(tr) }}</div>{% endif %}
      {% if probe.models %}
      <div class="muted">{{ tr("Models:") }} {{ probe.models | join(', ') }}</div>
      {% else %}
      <div class="muted">{{ tr("The server answers but serves no model yet.") }}</div>
      {% endif %}
      {% else %}
      {% if probe.detail %}<div class="muted">{{ probe.detail.render(tr) }}</div>{% endif %}
      {# The hint is the plain "what to install or run" this rung owes the user. #}
      <div class="muted">{{ tr(probe.candidate.install_hint) }}</div>
      {% endif %}

      {% if not setup.configured and probe.reachable %}
      {# ``hx-vals`` carries the probed endpoint, so the form stays exactly the
         user's editable model field — and no field markup the CSS scanner would
         read as a utility class. #}
      <form class="stack" hx-post="/ui/agent-setup/use" hx-target="#agent-setup"
            hx-swap="innerHTML" hx-vals='{"endpoint": "{{ probe.candidate.base_url }}"}'>
        <input name="model" value="{{ probe.models[0] if probe.models else '' }}"
               placeholder="{{ tr('model (optional)') }}">
        <button class="primary" type="submit">{{ tr("Verify and use") }}</button>
      </form>
      {% endif %}
      {% if not setup.configured and probe.pull_supported %}
      <form class="stack" hx-post="/ui/agent-setup/pull" hx-target="#agent-setup"
            hx-swap="innerHTML" hx-vals='{"endpoint": "{{ probe.candidate.base_url }}"}'>
        <input name="model" value="{{ default_model }}" placeholder="{{ tr('model to pull') }}">
        <button type="submit">{{ tr("Pull a small model") }}</button>
      </form>
      {% endif %}
    </li>
    {% endfor %}
  </ul>
  {% else %}
  <p><button class="btn btn-sm" type="button"
             hx-get="/ui/agent-setup/detect" hx-target="#agent-setup" hx-swap="innerHTML">{{ tr("Look for Ollama, LM Studio or a llama.cpp server") }}</button></p>
  {% endif %}

  {% if not setup.configured %}
  <form class="stack agent-setup-manual"
        hx-post="/ui/agent-setup/use" hx-target="#agent-setup" hx-swap="innerHTML">
    <input name="endpoint" placeholder="http://127.0.0.1:11434/v1" required>
    <input name="model" placeholder="{{ tr('model (optional)') }}">
    <input name="api_key_env" placeholder="{{ tr('key environment variable name (optional)') }}">
    <button class="primary" type="submit">{{ tr("Verify and record") }}</button>
  </form>
  <p class="muted agent-setup-secret">{{ tr("clear-record never stores a key: a hosted endpoint names the environment variable that holds it, and a local endpoint needs none.") }}</p>
  {% endif %}

  {# --- the MCP rung: point at a harness, then at its client config --------
     Both locations are the **user's choice**, and the console asks for each
     rather than inventing one: an external harness's own config path is defined
     nowhere in this repo. The entry the second form writes is a command and its
     args, so there is no field here a credential could occupy. #}
  <h3>{{ tr("Agent harness (MCP)") }}</h3>

  {% if setup.mcp_config %}
  <p class="muted">{{ tr("Client config: {path}", path=setup.mcp_config) }}</p>
  {% else %}
  <p class="muted agent-setup-note">{{ tr("No MCP client config has been pointed at yet, so no agent can launch clear-record's tools.") }}</p>
  {% endif %}
  {% if setup.harness %}
  <p class="muted">{{ tr("Harness: {path}", path=setup.harness) }}</p>
  {% endif %}

  {% for harness in harnesses %}
  <div class="row">
    <code class="muted">{{ harness.name }}</code>
    {% if harness.found %}
    {# ``hx-vals`` carries the path ``find_harness`` found — the same shape the
       endpoint forms use, so no input markup the CSS scanner would read as a
       utility class. ``tojson`` escapes the path into valid JSON, and the JSON's
       own quotes are safe inside the single-quoted attribute. The path is still
       the user's to accept: this only saves typing it. #}
    <form hx-post="/ui/agent-setup/mcp/harness" hx-target="#agent-setup"
          hx-swap="innerHTML" hx-vals='{{ {"harness": harness.path} | tojson }}'>
      <button class="btn btn-sm" type="submit">{{ tr("Point at this") }}</button>
    </form>
    {% else %}
    <span class="badge status-missing">{{ tr("not on PATH") }}</span>
    {% endif %}
  </div>
  {% endfor %}

  <form class="stack" hx-post="/ui/agent-setup/mcp/harness" hx-target="#agent-setup"
        hx-swap="innerHTML">
    <input name="harness" value="" placeholder="{{ tr('path to pi-agent or another MCP-capable harness') }}">
    <button type="submit">{{ tr("Point at this path") }}</button>
  </form>

  {# The download rung, told honestly: installing a harness is a human action,
     and this setup neither bundles one nor performs a download. #}
  <p class="muted agent-setup-note">{{ tr("{name} is not bundled, and this setup will not download one for you: get {name} (or any other MCP-capable client) the way you get software yourself, then point at it above.", name=pi_agent) }}</p>

  <h3>{{ tr("MCP client config") }}</h3>
  <form class="stack" hx-post="/ui/agent-setup/mcp/config" hx-target="#agent-setup"
        hx-swap="innerHTML">
    {# The only pre-filled value is a path a previous run recorded — never a
       guessed default. An empty field means the user must choose. #}
    <input name="config" value="{{ setup.mcp_config or '' }}" placeholder="{{ tr('path to your MCP client config (.json)') }}">
    <button type="submit">{{ tr("Register clear-record here") }}</button>
  </form>
  <p class="muted agent-setup-secret">{{ tr("The path is yours to choose: a client's config location is not something clear-record can know. clear-record adds one entry to that file and leaves the rest of it alone — the command {command} with args {args}.", command=mcp_entry.command, args=mcp_entry.args | join(' ')) }}</p>
</div>