PWA, one send/stop button, audio in and out, web search as a tool

Four pieces of work.

**Installable.** A manifest carrying the instance name, PWA icons rasterised
from the existing mark at design time, a service worker and a themed offline
page. The worker caches the shell only and bails out on /api/, /auth/, /admin/
and anything accepting text/event-stream -- passing a reply stream through a
worker turns it into one delivery at the end, or nothing. It is served from
GET /sw.js rather than the static mount because a worker's scope is the path it
came from.

**Send and Stop are one button.** They were two, and the hidden one was never
hidden: `.btn` is display: inline-flex, which outranks the browser's own
`[hidden] { display: none }`, so Stop sat permanently beside Send. app.css now
forces the attribute to win -- every control toggled with `hidden` depended on
that -- and the composer renders one button carrying both icons, with ui.js
flipping data-composer-action and the type with it.

**Audio.** Speech to text and text to speech against any OpenAI-shaped
/v1/audio/* endpoint: dictate into the composer, have a reply read out.
Instance settings in Admin, per-reader overrides in Settings, with the voice
list discovered from the server where it offers one. Recorded audio is capped
and never written to disk -- it is not an attachment, it has no owner, and
nothing would ever sweep it.

**Web search, as a tool.** This is the tool loop PLAN.md described as the real
work: one reply is now a bounded sequence of requests rather than one. The model
asks, the tool runs, the result goes back and it is asked again, up to three
rounds. Providers are DuckDuckGo (no setup), SearXNG and Firecrawl.

Two decisions worth stating. Tools are only offered to models flagged `tools`,
because an endpoint without support rejects the whole request rather than
ignoring the array -- the same reason images only reach models flagged
`vision`. And tool results are not replayed as context on the next turn, for the
same reasons reasoning is not: the answer already contains what the model made
of them, and replaying stale results into every later request wastes the window
and reliably sends a small model into a search loop. The sources stay visible in
the transcript instead.

Search results are untrusted third-party text and are treated as such: escaped,
and only http/https URLs rendered as links.

338 tests, ruff clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jaroslav Beneš
2026-07-21 17:56:50 +02:00
co-authored by Claude Opus 4.8
parent ca3e4fd04f
commit 436226370a
61 changed files with 4481 additions and 116 deletions
+107
View File
@@ -35,6 +35,11 @@
<input class="visually-hidden" type="radio" name="settings-tab" id="tab-appearance">
<label class="tabs__tab" for="tab-appearance">{{ icon("sun", "icon--sm") }} Appearance</label>
{% if audio.stt_enabled or audio.tts_enabled %}
<input class="visually-hidden" type="radio" name="settings-tab" id="tab-audio">
<label class="tabs__tab" for="tab-audio">{{ icon("speaker", "icon--sm") }} Audio</label>
{% endif %}
<input class="visually-hidden" type="radio" name="settings-tab" id="tab-security">
<label class="tabs__tab" for="tab-security">{{ icon("key", "icon--sm") }} Security</label>
</div>
@@ -166,8 +171,110 @@
</button>
</div>
</div>
<div class="card">
<h2 class="card__title">Install as an app</h2>
<p class="card__lede">
Runs in its own window, without browser chrome. Everything still
comes from your server — there is no offline mode beyond a page
saying so.
</p>
{# Revealed by app.js only when the browser actually offers an
install. Firefox and desktop Safari never do, and a button that
does nothing is worse than no button. #}
<div class="btn-row" data-install-app hidden>
<button class="btn btn--primary" type="button"
onclick="window.lembas.promptInstall()">
{{ icon("plus", "icon--sm") }} Install
</button>
</div>
<p class="field__hint">
Only offered over HTTPS or on localhost, and not at all in some
browsers. On iOS, use Share → Add to Home Screen.
</p>
</div>
</section>
{# --- Audio --- #}
{% if audio.stt_enabled or audio.tts_enabled %}
<section class="tabs__panel" data-tab="tab-audio">
<form method="post" action="/api/preferences/audio">
{% if audio.tts_enabled %}
<div class="card">
<h2 class="card__title">Reading replies aloud</h2>
<p class="card__lede">
Overrides what the administrator chose, for you only.
</p>
<div class="grid grid--2">
<div class="field">
<label class="field__label" for="audio-voice">Voice</label>
{# Options are fetched from the speech endpoint rather than
stored, so the list follows the server. #}
<select class="select" id="audio-voice" name="voice">
{% with selected = user_audio.get('voice', ''),
instance_voice = audio.tts_voice %}
{% include "partials/_voice_options.html" %}
{% endwith %}
</select>
<p class="field__hint">
{% if voice_error %}
The voice list could not be read: {{ voice_error }}
{% else %}
{{ voices | length }} available.
{% endif %}
</p>
</div>
<div class="field">
<label class="field__label" for="audio-speed">Speed</label>
<input class="input" id="audio-speed" name="speed" type="number"
min="0.25" max="4" step="0.05"
value="{{ user_audio.get('speed', '') }}"
placeholder="{{ audio.tts_speed }}">
<p class="field__hint">Leave empty to use the instance default.</p>
</div>
</div>
<div class="field">
<label class="checkbox">
<input type="checkbox" name="autoplay" value="true"
{{ 'checked' if user_audio.get('autoplay', audio.tts_autoplay) }}>
<span>Read each reply aloud as it finishes</span>
</label>
<p class="field__hint">
Only replies that arrive while you are looking at the chat.
</p>
</div>
</div>
{% endif %}
{% if audio.stt_enabled %}
<div class="card">
<h2 class="card__title">Dictation</h2>
<div class="field">
<label class="field__label" for="audio-language">Language</label>
<input class="input" id="audio-language" name="language" maxlength="16"
value="{{ user_audio.get('language', '') }}"
placeholder="{{ audio.stt_language or 'detect' }}">
<p class="field__hint">
An ISO code such as <code>en</code> or <code>sk</code>. Empty
lets the server work it out, which is usually best.
</p>
</div>
<p class="field__hint">
The microphone needs HTTPS or localhost — browsers do not grant
it over plain HTTP.
</p>
</div>
{% endif %}
<div class="btn-row">
<button class="btn btn--primary" type="submit">Save audio preferences</button>
</div>
</form>
</section>
{% endif %}
{# --- Security --- #}
<section class="tabs__panel" data-tab="tab-security">
<div class="card">