{% extends "agents/_layout.html" %}
{% from "_macros.html" import icon %}

{% block title %}Connections - {{ brand.name }}{% endblock %}
{% block heading %}Connections{% endblock %}
{% block actions %}
<a class="btn btn--primary btn--sm" href="/agents/new">
  {{ icon("plus", "icon--sm") }} Add a connection
</a>
{% endblock %}

{% block agents_content %}
<p class="admin-lede">
  Machines an <strong>Agent</strong> chat can work on. A model with one of these
  can read files, write files and run commands <em>there</em> — never here.
  Which of those it may do without asking you first is the chat's mode.
</p>

<div class="alert">
  {{ icon("shield", "icon--sm") }}
  <span>
    Whatever this connection can reach, a model in an agent chat can reach. A
    container built for the job, with one project mounted into it, is a very
    different thing from a key to a machine you care about — and {{ brand.name }} cannot
    tell them apart.
  </span>
</div>

{% if problem %}
<div class="alert alert--error">
  {{ icon("warning", "icon--sm") }} <span>{{ problem }}</span>
</div>
{% elif not enabled %}
<div class="alert alert--error">
  {{ icon("warning", "icon--sm") }}
  <span>
    Agent chats are switched off for this instance. You can still add
    connections here, but nothing will use them until an administrator turns
    them on.
  </span>
</div>
{% endif %}

{% if saved %}
<div class="alert alert--success">{{ icon("check", "icon--sm") }} <span>{{ saved }}</span></div>
{% endif %}

{% if not profiles %}
<div class="empty">
  {{ icon("server", "empty__mark") }}
  <h2 class="empty__title">No connections yet</h2>
  <p class="empty__text">
    Add the host, the user to log in as, and a key or password. Then press
    <strong>Check</strong> — you will be shown its fingerprint to confirm before
    anything is sent to it.
  </p>
  <a class="btn btn--primary" href="/agents/new">
    {{ icon("plus", "icon--sm") }} Add a connection
  </a>
</div>
{% else %}

<div class="model-rows">
  {% for profile in profiles %}
  {# `refused` is why this connection cannot be used at all, which is a stronger
     statement than `disabled` -- that one is the owner's own choice and this one
     is not theirs to make. Greyed out with the same class, because "you cannot
     use this" is one visual idea however it came about. #}
  {% set refused = refusals.get(profile.id, "") %}
  <div class="model-row {{ 'is-off' if not profile.enabled or refused }}">
    <div class="model-row__main">
      <div class="model-row__title">
        <a class="model-row__name" href="/agents/{{ profile.id }}">{{ profile.name }}</a>
        {% if refused %}
        <span class="badge badge--danger">not allowed</span>
        {% elif profile.verified %}
        <span class="badge badge--leaf">key confirmed</span>
        {% else %}
        <span class="badge badge--danger">not checked</span>
        {% endif %}
        {% if not profile.enabled %}<span class="badge">disabled</span>{% endif %}
        {% if profile.auth == "password" %}<span class="badge">password</span>{% endif %}
      </div>
      <code class="model-row__id">
        {{ profile.address }}{% if profile.default_dir %} · {{ profile.default_dir }}{% endif %}
      </code>
      {% if refused %}
      <p class="text-xs danger">{{ refused }}</p>
      {% elif profile.last_error %}
      <p class="text-xs danger">{{ profile.last_error }}</p>
      {% elif profile.server_info.system %}
      <p class="text-xs faint">{{ profile.server_info.system }}</p>
      {% endif %}
    </div>

    <div class="model-row__actions">
      <a class="btn btn--sm" href="/agents/{{ profile.id }}">Open</a>
    </div>
  </div>
  {% endfor %}
</div>
{% endif %}
{% endblock %}