fix(transcription): auto-expand comment thread when block has comments
Some checks failed
CI / Unit & Component Tests (push) Has been cancelled
CI / Backend Unit Tests (push) Has been cancelled
CI / E2E Tests (push) Has been cancelled
CI / Unit & Component Tests (pull_request) Failing after 1m20s
CI / Backend Unit Tests (pull_request) Failing after 2m38s
CI / E2E Tests (pull_request) Has been cancelled

Comments were only shown after clicking "Kommentieren". Now:
- Load comment counts per block when blocks are loaded
- Pass commentCount prop to TranscriptionBlock
- If commentCount > 0, the comment thread is expanded by default
- If commentCount is 0, thread stays collapsed behind the button

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-05 21:50:37 +02:00
parent d8830b5a8e
commit 6475ebcc60
3 changed files with 29 additions and 1 deletions

View File

@@ -30,10 +30,34 @@ let activeBlockId: string | null = $state(null);
let saveStates = new SvelteMap<string, SaveState>();
let debounceTimers = new SvelteMap<string, ReturnType<typeof setTimeout>>();
let pendingTexts = new SvelteMap<string, string>();
let commentCounts = new SvelteMap<string, number>();
let sortedBlocks = $derived([...blocks].sort((a, b) => a.sortOrder - b.sortOrder));
let hasBlocks = $derived(blocks.length > 0);
async function loadCommentCounts() {
for (const block of blocks) {
try {
const res = await fetch(
`/api/documents/${documentId}/transcription-blocks/${block.id}/comments`
);
if (res.ok) {
const comments = (await res.json()) as Array<{ replies: unknown[] }>;
const total = comments.reduce((s, c) => s + 1 + (c.replies?.length ?? 0), 0);
commentCounts.set(block.id, total);
}
} catch {
// ignore
}
}
}
$effect(() => {
if (blocks.length > 0) {
loadCommentCounts();
}
});
function getSaveState(blockId: string): SaveState {
return saveStates.get(blockId) ?? 'idle';
}
@@ -167,6 +191,7 @@ $effect(() => {
saveState={getSaveState(block.id)}
canComment={canComment}
currentUserId={currentUserId}
commentCount={commentCounts.get(block.id) ?? 0}
onTextChange={(text) => handleTextChange(block.id, text)}
onFocus={() => handleFocus(block.id)}
onDeleteClick={() => handleDelete(block.id)}