fix(pdf): prevent scroll-sync effect from hijacking page navigation
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 / Backend Unit Tests (pull_request) Has been cancelled
CI / E2E Tests (pull_request) Has been cancelled
CI / Unit & Component Tests (pull_request) Has been cancelled
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 / Backend Unit Tests (pull_request) Has been cancelled
CI / E2E Tests (pull_request) Has been cancelled
CI / Unit & Component Tests (pull_request) Has been cancelled
The scroll-sync $effect was re-triggering on every dependency change (including currentPage), forcing the PDF back to the annotation's page when the user clicked next/prev. Fix: track prevActiveAnnotationId and only scroll when the active annotation actually changes. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -218,9 +218,16 @@ $effect(() => {
|
||||
});
|
||||
|
||||
// Scroll-sync: when activeAnnotationId changes, navigate to its page
|
||||
let prevActiveAnnotationId: string | null = null;
|
||||
$effect(() => {
|
||||
if (!activeAnnotationId || !pdfDoc) return;
|
||||
const ann = annotations.find((a) => a.id === activeAnnotationId);
|
||||
const id = activeAnnotationId;
|
||||
if (!id || id === prevActiveAnnotationId || !pdfDoc) {
|
||||
prevActiveAnnotationId = id;
|
||||
return;
|
||||
}
|
||||
prevActiveAnnotationId = id;
|
||||
|
||||
const ann = annotations.find((a) => a.id === id);
|
||||
if (!ann) return;
|
||||
|
||||
if (ann.pageNumber !== currentPage) {
|
||||
@@ -228,10 +235,9 @@ $effect(() => {
|
||||
}
|
||||
|
||||
// After page renders, scroll the annotation into view (double-rAF for async render)
|
||||
const targetId = activeAnnotationId;
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(() => {
|
||||
const el = document.querySelector(`[data-testid="annotation-${targetId}"]`);
|
||||
const el = document.querySelector(`[data-testid="annotation-${id}"]`);
|
||||
el?.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user