Files
Skald-Circle/web/mobile.html
T
dguiducci daaceff6ba
Nightly Build / build (push) Successful in 7m34s
feat: show a conversation its own background tasks, and give it back every outcome
An `execute_task mode="async"` was invisible from the chat that started it.
The only trace was the receipt in the transcript and a row on the Tasks page
— which does not say *which* of those rows the assistant just spawned — so
"is it still going?" had no answer where the question is asked.

Worse, a task that did not simply succeed never came back at all. `run_job`
branched on `Ok`/`Err` first and routed by `job.kind` only inside the `Ok`
arm, so a failure or a kill left through the `Err` arm's unconditional
`hub.notify` — the home source (`/sethome`), worded "Cron job … failed" —
while the parent conversation sat waiting for a `task_completed` that would
never arrive. The wrong chat, and a wedged one.

The fix is a shape, not a branch: one `JobOutcome` classification, then one
`match job.kind` delivery site for every ending. An async task now ends in
its parent conversation whatever happened to it. The sink has a single
channel deliberately — to the model reading it, "it broke" is a result like
any other and must not be overlookable — so a failure is delivered as prose,
carrying whatever partial output the run produced, which is usually the only
clue about why. A cron job keeps the home notification: it belongs to nobody's
conversation. Cancellation becomes a third outcome rather than a flavour of
failure (`job_runs.status` has always had `'cancelled'` in its CHECK and
nothing ever wrote it), classified off the new typed `TurnCancelled` error so
nothing keys on a message string.

The strip above the composer is the visible half. `ServerEvent::TaskUpdate`
announces state to the source of the parent conversation only; the list is
`renderTaskStrip` (shared by the desktop copilot and the mobile chat), fed by
state on `ChatSession`. Each row links to `#session/{id}` — the page that
already shows, live, what a background agent is doing, and without which
"a task is running" is a fact you can do nothing with. Stopping is the
existing kill endpoint. A finished row clears itself after 20 s (its result
is in the conversation by then); a failed one stays until dismissed, and the
dismissal is remembered across reloads.

`GET /api/{source}/tasks` is what makes the strip survive a browser refresh:
the event is a broadcast with no replay, so without a load-time read a reload
would empty a chat that still has work running under it. It answers with the
running tasks plus failures from the last 30 minutes — the two states a person
can still act on. Successes are absent on purpose. Its window compares through
`datetime()` on both sides: `completed_at` is RFC 3339 and the cutoff is
SQLite-shaped, and `'T' > ' '` would let every same-day row through a window
meant to exclude it.

Not addressed, and worth doing next: a cron job's result should go where its
creator says, not always to the home chat.
2026-08-04 19:13:30 +01:00

96 lines
3.9 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Agent" />
<meta name="theme-color" content="#faf7f2" media="(prefers-color-scheme: light)" />
<meta name="theme-color" content="#1c1814" media="(prefers-color-scheme: dark)" />
<title>Skald</title>
<link rel="icon" href="/assets/icons/favicon.ico" sizes="any" />
<link rel="icon" href="/assets/icons/icon-192.png" type="image/png" />
<link rel="manifest" href="/manifest.json" />
<link rel="apple-touch-icon" href="/assets/icons/apple-touch-icon.png" />
<script>
(function () {
// Same chain as the desktop shell: a saved choice wins over the OS.
const saved = localStorage.getItem('theme');
const dark = saved ? saved === 'dark' : window.matchMedia('(prefers-color-scheme: dark)').matches;
document.documentElement.setAttribute('data-bs-theme', dark ? 'dark' : 'light');
window.matchMedia('(prefers-color-scheme: dark)')
.addEventListener('change', e => {
if (!localStorage.getItem('theme')) {
document.documentElement.setAttribute('data-bs-theme', e.matches ? 'dark' : 'light');
}
});
})();
</script>
<!-- Font -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" />
<!-- Bootstrap -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
<link rel="stylesheet" href="css/variables.css" />
<link rel="stylesheet" href="css/setup-page.css" />
<link rel="stylesheet" href="css/copilot-messages.css" />
<link rel="stylesheet" href="css/agent-tasks.css" />
<link rel="stylesheet" href="css/inbox-cards.css" />
<link rel="stylesheet" href="css/file-viewer.css" />
<link rel="stylesheet" href="css/mobile.css" />
<script type="importmap">
{
"imports": {
"lit": "/vendor/lit-all.min.js",
"lit/directives/unsafe-html.js": "/vendor/lit-all.min.js",
"lit/directives/keyed.js": "/vendor/lit-all.min.js",
"marked": "/vendor/marked.esm.js",
"dompurify": "/vendor/purify.es.mjs"
}
}
</script>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body { font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif; }
mobile-app { display: flex; flex-direction: column; height: 100%; }
</style>
</head>
<body>
<mobile-app id="mobile-app"></mobile-app>
<login-page id="login-page" style="display:none"></login-page>
<script>
(function () {
// Native shell handles auth in background — never gate it.
if (new URLSearchParams(location.search).get('native') === 'true') return;
var app = document.getElementById('mobile-app');
var login = document.getElementById('login-page');
fetch('/api/auth/me').then(function (res) {
if (res.ok) return; // logged in — show app
app.style.display = 'none'; // 401 — show login
login.style.display = '';
}).catch(function () {
app.style.display = 'none'; // network error — show login
login.style.display = '';
});
})();
</script>
<script type="module" src="components/mobile-app.js"></script>
</body>
</html>