From 6226131c165ed5b2ffa2d7014c10f6aea36c25cd Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Wed, 5 Apr 2023 15:39:51 +0800
Subject: [PATCH] Implement scroll to highlight in PDF

---
 .../templates/article/PdfArticleContainer.tsx | 22 ++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/packages/web/components/templates/article/PdfArticleContainer.tsx b/packages/web/components/templates/article/PdfArticleContainer.tsx
index 81c859fc1..32934943a 100644
--- a/packages/web/components/templates/article/PdfArticleContainer.tsx
+++ b/packages/web/components/templates/article/PdfArticleContainer.tsx
@@ -447,6 +447,23 @@ export default function PdfArticleContainer(
       }
     })
 
+    document.addEventListener('scrollToHighlightId', async (event) => {
+      const annotationId = (event as CustomEvent).detail as string
+      for (let pageIdx = 0; pageIdx < instance.totalPageCount; pageIdx++) {
+        const annotations = await instance.getAnnotations(pageIdx)
+        for (let annIdx = 0; annIdx < annotations.size; annIdx++) {
+          const annotation = annotations.get(annIdx)
+          if (!annotation) {
+            continue
+          }
+          const storedId = annotationOmnivoreId(annotation)
+          if (storedId == annotationId) {
+            instance.jumpToRect(pageIdx, annotation.boundingBox)
+          }
+        }
+      }
+    })
+
     return () => {
       PSPDFKit && container && PSPDFKit.unload(container)
     }
@@ -509,7 +526,10 @@ export default function PdfArticleContainer(
             props.setShowHighlightsModal(false)
           }}
           viewHighlightInReader={(highlightId) => {
-            // TODO: scroll to highlight in PDF
+            const event = new CustomEvent('scrollToHighlightId', {
+              detail: highlightId,
+            })
+            document.dispatchEvent(event)
             props.setShowHighlightsModal(false)
           }}
         />