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

feat(transcription): swap plain textarea for PersonMentionEditor and thread mentionedPersons through autosave

Browse Source 
- TranscriptionBlockData now carries mentionedPersons (matches backend
  schema added in PR-A).
- useBlockAutoSave.saveFn signature widens to (blockId, text, mentions);
  pendingMentions is tracked alongside pendingTexts and is preserved on
  failure so a retry resends the in-flight payload (B12).
- TranscriptionBlock.svelte renders <PersonMentionEditor>, exposing the
  textarea node back through a captureTextarea callback so the existing
  quote-selection feature still works.
- saveBlock in routes/documents/[id]/+page.svelte forwards mentions on
  PUT.
- flushOnUnload sends mentions in the keepalive payload too.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-29 00:32:09 +02:00
parent c4ee2c666b
commit 02d3e2ab61
11 changed files with 207 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
frontend/src/lib/hooks/__tests__/useBlockAutoSave.svelte.test.ts
View File

@@ -1,6 +1,10 @@
import { describe, it, expect, vi, beforeEach, afterEach, type Mock } from 'vitest';
import type { PersonMention } from '$lib/types';
const mockSaveFn = vi.fn<(blockId: string, text: string) => Promise<void>>();
const mockSaveFn =
vi.fn<(blockId: string, text: string, mentionedPersons: PersonMention[]) => Promise<void>>();
const NO_MENTIONS: PersonMention[] = [];
const { createBlockAutoSave } = await import('../useBlockAutoSave.svelte');
@@ -22,25 +26,25 @@ describe('createBlockAutoSave', () => {
it('debounce coalesces multiple changes — saves once after 1500ms', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text 1');
as.handleTextChange('block-1', 'text 2');
as.handleTextChange('block-1', 'text 3');
as.handleTextChange('block-1', 'text 1', NO_MENTIONS);
as.handleTextChange('block-1', 'text 2', NO_MENTIONS);
as.handleTextChange('block-1', 'text 3', NO_MENTIONS);
await vi.advanceTimersByTimeAsync(1500);
expect(mockSaveFn).toHaveBeenCalledTimes(1);
expect(mockSaveFn).toHaveBeenCalledWith('block-1', 'text 3');
expect(mockSaveFn).toHaveBeenCalledWith('block-1', 'text 3', NO_MENTIONS);
});
it('handles concurrent blocks independently', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'hello');
as.handleTextChange('block-2', 'world');
as.handleTextChange('block-1', 'hello', NO_MENTIONS);
as.handleTextChange('block-2', 'world', NO_MENTIONS);
await vi.advanceTimersByTimeAsync(1500);
expect(mockSaveFn).toHaveBeenCalledTimes(2);
});
it('sets save state to saving then saved on success', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
vi.advanceTimersByTime(1500);
expect(as.getSaveState('block-1')).toBe('saving');
await Promise.resolve();
@@ -50,7 +54,7 @@ describe('createBlockAutoSave', () => {
it('sets save state to error on save failure', async () => {
mockSaveFn.mockRejectedValue(new Error('save failed'));
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
await vi.advanceTimersByTimeAsync(1500);
expect(as.getSaveState('block-1')).toBe('error');
});
@@ -59,24 +63,24 @@ describe('createBlockAutoSave', () => {
mockSaveFn.mockRejectedValueOnce(new Error('first fails'));
mockSaveFn.mockResolvedValueOnce(undefined);
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'original');
as.handleTextChange('block-1', 'original', NO_MENTIONS);
await vi.advanceTimersByTimeAsync(1500);
expect(as.getSaveState('block-1')).toBe('error');
await as.handleRetry('block-1', 'original');
await as.handleRetry('block-1', 'original', NO_MENTIONS);
expect(mockSaveFn).toHaveBeenCalledTimes(2);
expect(as.getSaveState('block-1')).toBe('saved');
});
it('clearBlock removes all state for a block', () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
as.clearBlock('block-1');
expect(as.getSaveState('block-1')).toBe('idle');
});
it('destroy clears all pending timers so no save occurs', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
as.destroy();
await vi.advanceTimersByTimeAsync(2000);
expect(mockSaveFn).not.toHaveBeenCalled();
@@ -101,8 +105,8 @@ describe('flushOnUnload', () => {
it('sends a PUT request with keepalive:true for each pending block', () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'hello');
as.handleTextChange('block-2', 'world');
as.handleTextChange('block-1', 'hello', NO_MENTIONS);
as.handleTextChange('block-2', 'world', NO_MENTIONS);
as.flushOnUnload();
expect(mockFetch).toHaveBeenCalledTimes(2);
@@ -111,7 +115,7 @@ describe('flushOnUnload', () => {
expect.objectContaining({
method: 'PUT',
keepalive: true,
body: JSON.stringify({ text: 'hello' })
body: JSON.stringify({ text: 'hello', mentionedPersons: [] })
})
);
expect(mockFetch).toHaveBeenCalledWith(
@@ -119,7 +123,7 @@ describe('flushOnUnload', () => {
expect.objectContaining({
method: 'PUT',
keepalive: true,
body: JSON.stringify({ text: 'world' })
body: JSON.stringify({ text: 'world', mentionedPersons: [] })
})
);
});
@@ -127,7 +131,7 @@ describe('flushOnUnload', () => {
it('does not call navigator.sendBeacon', () => {
const sendBeaconSpy = vi.spyOn(navigator, 'sendBeacon').mockReturnValue(true);
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
as.flushOnUnload();
expect(sendBeaconSpy).not.toHaveBeenCalled();
@@ -142,7 +146,7 @@ describe('flushOnUnload', () => {
it('cancels the debounce timer so saveFn is not also called', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
as.flushOnUnload();
await vi.advanceTimersByTimeAsync(2000);
@@ -151,13 +155,26 @@ describe('flushOnUnload', () => {
it('does not send fetch if debounce already fired and pendingTexts is empty', async () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
as.handleTextChange('block-1', 'text');
as.handleTextChange('block-1', 'text', NO_MENTIONS);
await vi.advanceTimersByTimeAsync(1500);
// debounce has fired; pendingTexts should be empty now
mockFetch.mockClear();
as.flushOnUnload();
expect(mockFetch).not.toHaveBeenCalled();
});
it('flushes the pending mentionedPersons sidecar alongside text', () => {
const as = createBlockAutoSave({ saveFn: mockSaveFn, documentId: 'doc-1' });
const mentions: PersonMention[] = [{ personId: 'p-1', displayName: 'Auguste Raddatz' }];
as.handleTextChange('block-1', '@Auguste Raddatz', mentions);
as.flushOnUnload();
expect(mockFetch).toHaveBeenCalledWith(
'/api/documents/doc-1/transcription-blocks/block-1',
expect.objectContaining({
body: JSON.stringify({ text: '@Auguste Raddatz', mentionedPersons: mentions })
})
);
});
});