fix(ocr): fix SSE retry to actually reconnect EventSource
The retry button set status='running' but didn't re-trigger the $effect because jobId hadn't changed. Added retryCount state so the effect re-runs and creates a fresh EventSource on retry. Also added aria-label to the progress bar for accessibility. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -13,10 +13,12 @@ let processed: number = $state(0);
|
||||
let total: number = $state(0);
|
||||
let currentPage: number = $state(0);
|
||||
let totalPages: number = $state(0);
|
||||
let retryCount: number = $state(0);
|
||||
|
||||
let progressPercent = $derived(total > 0 ? Math.round((processed / total) * 100) : 0);
|
||||
|
||||
$effect(() => {
|
||||
void retryCount; // track dependency to re-create EventSource on retry
|
||||
const source = new EventSource(`/api/ocr/jobs/${jobId}/progress`);
|
||||
|
||||
source.addEventListener('document', (e) => {
|
||||
@@ -63,6 +65,7 @@ $effect(() => {
|
||||
class="h-full bg-brand-mint transition-all duration-300"
|
||||
style="width: {progressPercent}%"
|
||||
role="progressbar"
|
||||
aria-label={m.ocr_progress_heading()}
|
||||
aria-valuenow={progressPercent}
|
||||
aria-valuemin={0}
|
||||
aria-valuemax={100}
|
||||
@@ -79,7 +82,7 @@ $effect(() => {
|
||||
</h3>
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => { status = 'running'; }}
|
||||
onclick={() => { retryCount++; status = 'running'; }}
|
||||
class="text-sm font-medium text-brand-navy transition-colors hover:text-brand-navy/80"
|
||||
>
|
||||
{m.ocr_error_retry()}
|
||||
|
||||
Reference in New Issue
Block a user