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

feat(transcribe): wire coach into TranscriptionEditView, hide training footer when empty

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-24 21:06:50 +02:00
parent 86584a53a8
commit dff203d526
2 changed files with 18 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/src/lib/components/TranscriptionEditView.svelte
View File

@@ -2,6 +2,7 @@
import { m } from '$lib/paraglide/messages.js'; import { m } from '$lib/paraglide/messages.js';
import TranscriptionBlock from './TranscriptionBlock.svelte'; import TranscriptionBlock from './TranscriptionBlock.svelte';
import OcrTrigger from './OcrTrigger.svelte'; import OcrTrigger from './OcrTrigger.svelte';
import TranscribeCoachEmptyState from './TranscribeCoachEmptyState.svelte';
import type { TranscriptionBlockData } from '$lib/types'; import type { TranscriptionBlockData } from '$lib/types';
import { createBlockAutoSave } from '$lib/hooks/useBlockAutoSave.svelte'; import { createBlockAutoSave } from '$lib/hooks/useBlockAutoSave.svelte';
import { createBlockDragDrop } from '$lib/hooks/useBlockDragDrop.svelte'; import { createBlockDragDrop } from '$lib/hooks/useBlockDragDrop.svelte';
@@ -231,28 +232,12 @@ async function handleLabelToggle(label: string) {
</div> </div>
</div> </div>
{:else} {:else}
<div class="flex flex-1 flex-col items-center justify-center px-6 py-12 text-center"> <div class="p-4">
<svg <TranscribeCoachEmptyState />
class="mb-4 h-16 w-16 text-ink-3"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
stroke-width="1"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z"
/>
</svg>
<p class="max-w-xs text-sm leading-relaxed text-ink-3">
{m.transcription_empty_draw_hint()}
</p>
</div> </div>
{/if} {/if}
{#if canWrite} {#if canWrite && hasBlocks}
<div class="border-t border-line px-4 py-3"> <div class="border-t border-line px-4 py-3">
<p class="mb-2 font-sans text-xs font-medium text-ink-2">Für Training vormerken</p> <p class="mb-2 font-sans text-xs font-medium text-ink-2">Für Training vormerken</p>
<div class="flex flex-wrap gap-2"> <div class="flex flex-wrap gap-2">

16
frontend/src/lib/components/TranscriptionEditView.svelte.spec.ts
View File

@@ -61,9 +61,21 @@ describe('TranscriptionEditView — rendering', () => {
await expect.element(page.getByText(/Block 3/)).toBeInTheDocument(); await expect.element(page.getByText(/Block 3/)).toBeInTheDocument();
}); });
it('shows empty state when no blocks', async () => { it('shows coach card when no blocks', async () => {
renderView({ blocks: [] }); renderView({ blocks: [] });
await expect.element(page.getByText(/Zeichnen Sie Bereiche/)).toBeInTheDocument(); await expect
.element(page.getByRole('heading', { level: 2 }))
.toHaveTextContent('Erste Transkription?');
});
it('hides training footer when no blocks', async () => {
renderView({ blocks: [], canWrite: true });
await expect.element(page.getByText('Für Training vormerken')).not.toBeInTheDocument();
});
it('shows training footer when blocks exist', async () => {
renderView({ blocks: [block1], canWrite: true });
await expect.element(page.getByText('Für Training vormerken')).toBeInTheDocument();
}); });
}); });