frontend/src/components/custom-tools/pdf-viewer/PdfViewer.jsx (7)

41-53: Harden index checks in currentHighlightData.

Guard against undefined/NaN/negative indices to prevent out-of-bounds access.

Apply this diff:

   const currentHighlightData = useMemo(() => {
     if (
       RenderHighlights &&
       Array.isArray(processedHighlightData) &&
       processedHighlightData?.length > 0
     ) {
-      return currentHighlightIndex !== null &&
-        currentHighlightIndex < processedHighlightData.length
-        ? [processedHighlightData[currentHighlightIndex]]
-        : processedHighlightData;
+      const hasValidIndex =
+        Number.isInteger(currentHighlightIndex) &&
+        currentHighlightIndex >= 0 &&
+        currentHighlightIndex < processedHighlightData.length;
+      return hasValidIndex
+        ? [processedHighlightData[currentHighlightIndex]]
+        : processedHighlightData;
     }
     return null;
   }, [processedHighlightData, currentHighlightIndex]);

---

19-22: Memoize plugin instances to stop effect churn and re-init costs.

pageNavigationPlugin() and defaultLayoutPlugin() are recreated every render, changing jumpToPage identity and re-running the effect unnecessarily.

Apply these diffs:

-  const newPlugin = defaultLayoutPlugin();
-  const pageNavigationPluginInstance = pageNavigationPlugin();
+  const defaultLayoutPluginInstance = useMemo(() => defaultLayoutPlugin(), []);
+  const pageNavigationPluginInstance = useMemo(() => pageNavigationPlugin(), []);
   const { jumpToPage } = pageNavigationPluginInstance;

           plugins={[
-            newPlugin,
+            defaultLayoutPluginInstance,
             pageNavigationPluginInstance,
             highlightPluginInstance,
           ]}

Also applies to: 97-100

---

55-65: Only recreate highlight plugins when needed.

Re-instantiating on every render can reset plugin internal state. Memoize; keep custom plugin reactive to data.

Apply this diff:

-  const baseHighlightPlugin = highlightPlugin();
-  const customHighlightPlugin = highlightPlugin({
-    renderHighlights:
-      currentHighlightData && RenderHighlights
-        ? (props) => (
-            <RenderHighlights {...props} highlightData={currentHighlightData} />
-          )
-        : undefined,
-  });
+  const baseHighlightPlugin = useMemo(() => highlightPlugin(), []);
+  const customHighlightPlugin = useMemo(
+    () =>
+      highlightPlugin({
+        renderHighlights:
+          currentHighlightData && RenderHighlights
+            ? (props) => (
+                <RenderHighlights
+                  {...props}
+                  highlightData={currentHighlightData}
+                />
+              )
+            : undefined,
+      }),
+    [RenderHighlights, currentHighlightData]
+  );

---

76-87: Clamp index and clean up the timer.

Prevents negative/NaN index and eliminates dangling timeout on rapid re-renders/unmount.

Apply this diff:

-      const index =
-        currentHighlightIndex !== null &&
-        currentHighlightIndex < cleanedHighlightData.length
-          ? currentHighlightIndex
-          : 0;
+      const index =
+        Number.isInteger(currentHighlightIndex) &&
+        currentHighlightIndex >= 0 &&
+        currentHighlightIndex < cleanedHighlightData.length
+          ? currentHighlightIndex
+          : 0;
       const pageNumber = cleanedHighlightData[index][0]; // Get page number from current highlight

       if (pageNumber !== null && pageNumber !== undefined && jumpToPage) {
-        setTimeout(() => {
-          jumpToPage(pageNumber); // jumpToPage is 0-indexed
-        }, 100); // Add a slight delay to ensure proper page rendering
+        const t = setTimeout(() => {
+          jumpToPage(pageNumber); // jumpToPage is 0-indexed
+        }, 100); // Slight delay to ensure proper page rendering
+        return () => clearTimeout(t);
       }

---

108-111: Tighten PropTypes for clarity.

Clarifies accepted shapes and helps catch bad inputs early.

Apply this diff:

-PdfViewer.propTypes = {
-  fileUrl: PropTypes.any,
-  highlightData: PropTypes.array,
-  currentHighlightIndex: PropTypes.number,
-};
+PdfViewer.propTypes = {
+  fileUrl: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+  // Expect array of [page, x, y, h] (or similar numeric tuples)
+  highlightData: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.number)),
+  currentHighlightIndex: PropTypes.number, // pass undefined/null when not focusing a single highlight
+};

---

19-19: Naming nit: prefer descriptive variable name.

Rename newPlugin → defaultLayoutPluginInstance for clarity.

(Handled by the memoization diff above.)

---

10-16: Optional: avoid require in ESM setups.

If the app uses ESM/Vite, require may be undefined. Consider a static import with feature flag, or a guarded dynamic import with state.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Cache: Disabled due to Reviews > Disable Cache setting

Knowledge base: Disabled due to Reviews -> Disable Knowledge Base setting