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

{% block title %}Connections - LLeMbas{% 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 LLeMbas 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 %}
  <div class="model-row {{ 'is-off' if not profile.enabled }}">
    <div class="model-row__main">
      <div class="model-row__title">
        <a class="model-row__name" href="/agents/{{ profile.id }}">{{ profile.name }}</a>
        {% if 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 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 %}