Split the model admin into a list and a page per model

/admin/models rendered a full edit form for every model. With eight that
was merely long; with a hundred it was unusable, which is the report.

The list is now compact rows only -- avatar, name, badges, position,
reorder buttons, Edit link -- with search across id and display name,
filter tabs (All / Enabled / Disabled / Pinned / Restricted, each with a
count), a connection filter, and pagination at 40. Filters are links, so
a filtered view is a real URL you can keep. Editing moved to
/admin/models/{id}/edit, one model per page, with Previous/Next links so
a freshly imported connection can be tidied without returning to the
list each time.

Measured with 128 models: the list is 73 KB showing 40 rows over 4
pages, and a detail page is 17 KB. The old page would have rendered all
128 forms into one response.

Reordering needed rethinking at that size too. Up/down is fine for
nudging a model one place but hopeless for moving it sixty, so the
detail page has a position field you type into; the value is clamped and
a non-numeric one is ignored rather than throwing. The move buttons take
a `back` field so they return to whatever filtered, paginated view they
were pressed on instead of dumping you at page 1.

Also adds a select-all checkbox for the bulk bar, scoped to a container
selector rather than the page so a future list can carry more than one.

212 tests, ruff clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/lembas/web/templates/admin/model_detail.html

@@ -0,0 +1,196 @@
+{% extends "admin/_layout.html" %}
+{% from "_macros.html" import icon, model_avatar %}
+{% set section = "models" %}
+
+{% block title %}{{ model.label }} - Models - LLeMbas{% endblock %}
+{% block heading %}{{ model.label }}{% endblock %}
+
+{% block admin_content %}
+<nav class="crumbs">
+  <a href="/admin/models">{{ icon("chevron-right", "icon--sm crumbs__back") }} All models</a>
+  <span class="spacer"></span>
+  {# Walking the list without going back to it, which is what you want when
+     tidying up a freshly imported connection. #}
+  {% if previous %}
+  <a class="btn btn--sm" href="/admin/models/{{ previous.id }}/edit"
+     title="{{ previous.label }}">{{ icon("arrow-up", "icon--sm") }} Previous</a>
+  {% endif %}
+  <span class="text-xs faint">{{ position_of }} of {{ total }}</span>
+  {% if next %}
+  <a class="btn btn--sm" href="/admin/models/{{ next.id }}/edit"
+     title="{{ next.label }}">Next {{ icon("arrow-down", "icon--sm") }}</a>
+  {% endif %}
+</nav>
+
+{% if saved %}
+<div class="alert alert--success">{{ icon("check", "icon--sm") }} <span>{{ saved }}</span></div>
+{% endif %}
+
+<section class="card">
+  <div class="card__header">
+    <div class="row" style="gap: var(--sp-3); min-width: 0">
+      {{ model_avatar(model, cls="model-detail__avatar") }}
+      <div style="min-width: 0">
+        <strong>{{ model.label }}</strong>
+        <div><code class="text-xs faint">{{ model.model_id }}</code></div>
+        <div class="text-xs faint">via {{ model.connection.name }}</div>
+      </div>
+    </div>
+    <div class="btn-row">
+      {% if model.model_id == default_model %}
+      <span class="badge badge--gold">{{ icon("star", "icon--sm") }} default model</span>
+      {% else %}
+      <form method="post" action="/admin/models/{{ model.id }}/default">
+        <button class="btn btn--sm" type="submit">
+          {{ icon("star", "icon--sm") }} Make default
+        </button>
+      </form>
+      {% endif %}
+    </div>
+  </div>
+
+  <div class="btn-row">
+    <form method="post" action="/admin/models/{{ model.id }}/image"
+          enctype="multipart/form-data" class="btn-row">
+      <input class="input input--file" type="file" name="image"
+             accept="image/png,image/jpeg,image/webp,image/gif" required
+             aria-label="Model image">
+      <button class="btn btn--sm" type="submit">{{ icon("image", "icon--sm") }} Upload image</button>
+    </form>
+    {% if model.image_path %}
+    <form method="post" action="/admin/models/{{ model.id }}/image/delete">
+      <button class="btn btn--sm btn--danger" type="submit">Remove image</button>
+    </form>
+    {% endif %}
+  </div>
+  <p class="field__hint">
+    PNG, JPEG, WEBP or GIF, under 2 MB. Without one, the model gets a generated
+    badge whose colour is derived from its id.
+  </p>
+</section>
+
+<form method="post" action="/admin/models/{{ model.id }}">
+  <section class="card">
+    <h2 class="card__title">Presentation</h2>
+
+    <div class="grid grid--2">
+      <div class="field">
+        <label class="field__label" for="display-name">Display name</label>
+        <input class="input" id="display-name" name="display_name"
+               value="{{ model.display_name }}" placeholder="{{ model.model_id }}">
+        <p class="field__hint">Shown instead of the raw id. Empty uses the id.</p>
+      </div>
+
+      <div class="field">
+        <label class="field__label" for="position">Position</label>
+        <input class="input" id="position" name="position" type="number" min="1"
+               max="{{ total }}" value="{{ position_of }}">
+        <p class="field__hint">
+          Place in the picker, 1–{{ total }}. Typing a number is the workable way
+          to move a model a long distance.
+        </p>
+      </div>
+    </div>
+
+    <div class="field">
+      <label class="field__label" for="description">Description</label>
+      <textarea class="textarea" id="description" name="description" rows="2"
+                placeholder="What is this model good at?">{{ model.description }}</textarea>
+      <p class="field__hint">Shown in the chat settings panel and your users' settings.</p>
+    </div>
+  </section>
+
+  <section class="card">
+    <h2 class="card__title">System prompt</h2>
+    <p class="card__lede">
+      Used by chats on this model that have no prompt of their own. A chat's own
+      prompt overrides this; this overrides the instance prompt.
+    </p>
+    <div class="field">
+      <label class="field__label visually-hidden" for="system-prompt">System prompt</label>
+      <textarea class="textarea" id="system-prompt" name="system_prompt" rows="5"
+                placeholder="{{ instance_prompt or 'No instance prompt is set.' }}"
+      >{{ model.system_prompt }}</textarea>
+      <p class="field__hint">
+        {% if instance_prompt %}
+          Leave empty to fall back to the instance prompt shown above.
+        {% else %}
+          Leave empty to send no system prompt.
+        {% endif %}
+      </p>
+    </div>
+  </section>
+
+  <section class="card">
+    <h2 class="card__title">Capabilities</h2>
+    <p class="card__lede">
+      Endpoints rarely advertise these reliably, so they are your call.
+      <strong>reasoning</strong> shows the thinking block,
+      <strong>vision</strong> lets images be sent to this model, and
+      <strong>tools</strong> is reserved for a feature not built yet.
+    </p>
+    <div class="checkbox-row">
+      {% for name in capabilities %}
+      <label class="checkbox">
+        <input type="checkbox" name="capability" value="{{ name }}"
+               {{ 'checked' if (model.capabilities_json or {}).get(name) }}>
+        <span>{{ name }}</span>
+      </label>
+      {% endfor %}
+    </div>
+  </section>
+
+  <section class="card">
+    <h2 class="card__title">Availability</h2>
+
+    <div class="field">
+      <div class="checkbox-row">
+        <label class="checkbox">
+          <input type="checkbox" name="enabled" value="true" {{ 'checked' if model.enabled }}>
+          <span>Enabled — offered in chats</span>
+        </label>
+        <label class="checkbox">
+          <input type="checkbox" name="pinned" value="true" {{ 'checked' if model.pinned }}>
+          <span>Pinned — shortcut in the chat sidebar</span>
+        </label>
+      </div>
+    </div>
+
+    <div class="field">
+      <label class="checkbox">
+        <input type="checkbox" name="public" value="true" {{ 'checked' if model.public }}>
+        <span>Available to everyone</span>
+      </label>
+      <p class="field__hint">
+        Uncheck to restrict this model to chosen groups. Administrators always
+        have access.
+      </p>
+    </div>
+
+    <div class="field">
+      <span class="field__label">Groups with access</span>
+      {% if groups %}
+      <div class="checkbox-row">
+        {% for group in groups %}
+        <label class="checkbox">
+          <input type="checkbox" name="group_ids" value="{{ group.id }}"
+                 {{ 'checked' if group in model.groups }}>
+          <span>{{ group.name }}</span>
+        </label>
+        {% endfor %}
+      </div>
+      <p class="field__hint">Ignored while the model is available to everyone.</p>
+      {% else %}
+      <p class="field__hint">
+        No groups yet — <a href="/admin/groups">create one</a> to restrict access.
+      </p>
+      {% endif %}
+    </div>
+  </section>
+
+  <div class="btn-row">
+    <button class="btn btn--primary" type="submit">Save changes</button>
+    <a class="btn btn--ghost" href="/admin/models">Back to all models</a>
+  </div>
+</form>
+{% endblock %}