kristianwindandClaude Opus 5
7e981354c2
Indstillingerne er ti faner med syvogtredive afsnit, og den eneste vej til et bestemt af dem var at huske, hvilken fane det lå under. ⌘K kunne opgaver, projekter og noter — alt det, man selv har skrevet, og intet af det, programmet består af. Ét indeks, to steder det bruges: et felt øverst i indstillingerne og paletten. To lister over de samme afsnit ville være to steder at glemme et nyt et. Overskrifterne står ikke i indekset. Hver post peger på den nøgle, afsnittets egen overskrift allerede bruger, så et afsnit, der bliver omdøbt, følger med af sig selv, og søgningen kan begge sprog uden at kende nogen af dem. `words` er derimod skrevet i indekset, og det er med vilje: det er søgeord, ingen får at se. Det danske afsnit hedder "Tælling af installationer", men det ord, man kender det ved, er "beacon" — og på samme måde 2fa, imap, webcal, webhook. De er de samme på begge sprog, hvilket er hele grunden til, at de virker som søgeord. Ankrene er nye id'er på afsnittene. Tre af dem stødte sammen med et felt inde i afsnittet — to ens id'er gør <label for> tvetydig og getElementById tilfældig — og hedder derfor to-faktor, kalenderfeed og caldav-server. Springet dertil kan ikke overlades til browseren: siden hentes af ruteren, og afsnittet findes først, når dens data er hjemme. Der prøves i to sekunder og gives så op. Blinket bagefter er ikke pynt — man er landet midt i en side med otte afsnit, man ikke selv rullede hen til. Prøverne læser filerne frem for at klikke: halvdelen af afsnittene vises kun under en betingelse, så en prøve, der ledte efter dem i en browser, ville melde fejl på det, der med rette var skjult. Og palettens pladsholder sagde "Søg i opgaver og projekter". Den har kunnet noter længe, og kan nu også indstillinger. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
125 lines
2.5 KiB
Svelte
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" id="fejl">
|
|
<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>
|