marcel/familienarchiv
1
0
Fork 0
Code Issues 119 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

feat(frontend): wire personNames to TrainingHistory in OcrTrainingCard

Browse Source 
Extends Run interface with personId and QUEUED status, TrainingInfo with
personNames map, and passes it through to TrainingHistory for per-sender
model column display.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-17 18:25:59 +02:00
committed by marcel
parent add799c57f
commit cd31bf63c1
2 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/lib/components/OcrTrainingCard.svelte
View File

@@ -4,7 +4,8 @@ import { m } from '$lib/paraglide/messages.js';
interface Run {
id: string;
status: 'RUNNING' | 'DONE' | 'FAILED';
personId?: string;
status: 'RUNNING' | 'DONE' | 'FAILED' | 'QUEUED';
blockCount: number;
documentCount: number;
modelName: string;
@@ -21,6 +22,7 @@ interface TrainingInfo {
ocrServiceAvailable?: boolean;
lastRun?: Run | null;
runs?: Run[];
personNames?: Record<string, string>;
}
interface Props {
@@ -88,5 +90,8 @@ async function startTraining() {
<h3 class="mt-6 mb-3 text-xs font-bold tracking-widest text-ink-3 uppercase">
{m.training_history_heading()}
</h3>
<TrainingHistory runs={(trainingInfo?.runs ?? []).filter((r) => r.modelName !== 'blla')} />
<TrainingHistory
runs={(trainingInfo?.runs ?? []).filter((r) => r.modelName !== 'blla')}
personNames={trainingInfo?.personNames ?? {}}
/>
</div>

25
frontend/src/lib/components/TrainingHistory.svelte
View File

@@ -3,7 +3,7 @@ import { m } from '$lib/paraglide/messages.js';
interface Run {
id: string;
status: 'RUNNING' | 'DONE' | 'FAILED';
status: 'QUEUED' | 'RUNNING' | 'DONE' | 'FAILED';
blockCount: number;
documentCount: number;
modelName: string;
@@ -12,13 +12,15 @@ interface Run {
createdAt: string;
completedAt?: string;
cer?: number;
personId?: string;
}
interface Props {
runs: Run[];
personNames?: Record<string, string>;
}
let { runs }: Props = $props();
let { runs, personNames }: Props = $props();
const COLLAPSED_COUNT = 3;
let expanded = $state(false);
@@ -47,6 +49,8 @@ function formatCer(cer: number | undefined | null): string {
<tr class="border-b border-line text-xs font-bold tracking-widest text-ink-3 uppercase">
<th class="pb-2 text-left">{m.training_history_col_date()}</th>
<th class="pb-2 text-left">{m.training_history_col_status()}</th>
<th class="hidden pb-2 text-left md:table-cell">{m.training_col_type()}</th>
<th class="hidden pb-2 text-left md:table-cell">{m.training_col_person()}</th>
<th class="pb-2 text-right">{m.training_history_col_blocks()}</th>
<th class="hidden pb-2 text-right md:table-cell">{m.training_history_col_docs()}</th>
<th class="hidden pb-2 text-right md:table-cell">{m.training_history_col_cer()}</th>
@@ -55,7 +59,7 @@ function formatCer(cer: number | undefined | null): string {
<tbody id="training-history-rows">
{#if runs.length === 0}
<tr>
<td colspan="5" class="py-4 text-center text-sm text-ink-2">
<td colspan="7" class="py-4 text-center text-sm text-ink-2">
{m.training_history_empty()}
</td>
</tr>
@@ -64,7 +68,14 @@ function formatCer(cer: number | undefined | null): string {
<tr class="border-b border-line/50 last:border-0">
<td class="py-2 text-ink-2">{formatDate(run.createdAt)}</td>
<td class="py-2">
{#if run.status === 'DONE'}
{#if run.status === 'QUEUED'}
<span
class="inline-flex items-center gap-1 rounded-sm bg-amber-100 px-1.5 py-0.5 text-xs font-medium text-amber-700"
>
<span aria-hidden="true" class="h-1.5 w-1.5 rounded-full bg-amber-500"></span>
{m.training_status_queued()}
</span>
{:else if run.status === 'DONE'}
<span
class="inline-flex items-center gap-1 rounded-sm bg-green-100 px-1.5 py-0.5 text-xs font-medium text-green-700"
>
@@ -120,6 +131,12 @@ function formatCer(cer: number | undefined | null): string {
</span>
{/if}
</td>
<td class="hidden py-2 text-left text-ink-2 md:table-cell">
{run.personId ? m.training_type_personalized() : m.training_type_base()}
</td>
<td class="hidden py-2 text-left text-ink-2 md:table-cell">
{run.personId && personNames?.[run.personId] ? personNames[run.personId] : '—'}
</td>
<td class="py-2 text-right text-ink-2">{run.blockCount}</td>
<td class="hidden py-2 text-right text-ink-2 md:table-cell">{run.documentCount}</td>
<td class="hidden py-2 text-right md:table-cell"