Files
verdande/web/src/routes/indstillinger/fejl/+page.svelte
T
Kristian WindandClaude Opus 5 4d8b70918b feat(i18n): the interface speaks both languages
The account has had a `locale` since the beginning and it only chose which grammar
quick add read a line with — so picking English changed nothing anybody could see,
and the field said so honestly: "Sprog i hurtig tilføjelse". It says "Sprog" now,
because it means it.

Every component goes through `t()`. Danish is the source: a key missing from
English falls through to Danish rather than to the key, because a Danish sentence
in an English screen can be read and `settings.notifications.title` cannot.

`tag()` is the single place `Intl` is asked. Before, `'da-DK'` was written into a
dozen components, and that is the half of a translation that gets left behind — an
English interface still saying "24. aug." is exactly the shape of a job half done.
There is a smoke test that switches to English and refuses to see a Danish month
name in the calendar's heading.

Colour and theme names are keys now. `colors.js` keeps its ids untouched — they
are what the database stores, and `internal/store` reads them out of that file —
but `name` is `'color.tomato'`, resolved where it is drawn.

The Inbox keeps its name. It is a project row the server creates at signup, not a
string in the interface, and it can be renamed like any other project.

Four copies of "3 hours ago" became one, in `web/src/lib/when.js`. They had
already drifted: one said "aldrig logget ind", another "aldrig", and two stopped
at days where the others carried on to a date.

Routes stay Danish. `/indstillinger`, `/projekt`, `/uddelegeret` are bookmarks and
they are in every smoke test; translating them buys nothing and costs both.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-18 09:46:08 +02:00

125 lines
2.5 KiB
Svelte

<script>
/**
* Fejl: what has gone wrong lately, kept where a restart cannot take it.
*
* The panel's watcher already says "HTTP 5xx, twice, at 11:49". That is enough
* to know something broke and nothing at all to act on — the line explaining it
* is in the container's log, and a Rune replaces the container on every
* restart, so it is usually gone before anybody looks. These are the same
* failures written somewhere that survives.
*/
import { api, humanMessage } from '$lib/api.js';
import { app } from '$lib/stores.svelte.js';
import { t } from '$lib/i18n.svelte.js';
import { ago } from '$lib/when.js';
let errors = $state([]);
let loaded = $state(false);
$effect(() => {
api
.listErrors()
.then((r) => {
errors = r.errors;
loaded = true;
})
.catch((e) => app.toast(humanMessage(e)));
});
</script>
<section class="panel">
<header>
<h2>{t('errors.title')}</h2>
<p class="hint">
{t('errors.hint')}
</p>
</header>
{#if errors.length}
<ul class="rows">
{#each errors as error (error.id)}
<li>
<div class="what">
<span class="primary-line">
<span class="status">{error.status}</span>
{error.what}
</span>
<span class="secondary">{error.message}</span>
<span class="secondary mono">
{error.method}
{error.path}{#if error.user_name}{' · '}{error.user_name}{/if}{#if error.request_id}{' · ' +
error.request_id}{/if}
</span>
</div>
<span class="when">{ago(error.at)}</span>
</li>
{/each}
</ul>
{:else if loaded}
<p class="hint">{t('errors.none')}</p>
{/if}
</section>
<style>
.rows {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
}
.rows li {
display: flex;
align-items: flex-start;
gap: var(--s3);
padding: var(--s3) 0;
border-bottom: 1px solid var(--line);
}
.rows li:last-child {
border-bottom: 0;
}
.what {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 2px;
}
.primary-line {
display: flex;
align-items: center;
gap: var(--s2);
font-size: var(--text-sm);
}
.status {
font-size: var(--text-xs);
font-weight: 560;
color: var(--danger);
border: 1px solid var(--danger);
border-radius: var(--radius-sm);
padding: 0 var(--s1);
}
.secondary {
font-size: var(--text-xs);
color: var(--ink-faint);
overflow-wrap: anywhere;
}
.mono {
font-family: var(--font-mono);
}
.when {
font-size: var(--text-xs);
color: var(--ink-faint);
flex: none;
}
</style>