check for bounds

Author: Light2Dark

frontend/src/components/data-table/__tests__/utils.test.ts

@@ -58,6 +58,9 @@ describe("getPageIndexForRow", () => {
 
     // Last row of current page
     expect(getPageIndexForRow(19, 1, 10)).toBeNull();
+
+    // Last row of last page
+    expect(getPageIndexForRow(99, 9, 10)).toBeNull();
   });
 
   it("should handle edge case of row 0", () => {

frontend/src/components/data-table/row-viewer-panel/row-viewer.tsx

@@ -145,12 +145,11 @@ export const RowViewerPanel: React.FC<RowViewerPanelProps> = ({
     }
 
     if (rows.length !== 1) {
+      const message = tooManyRows
+        ? "LazyFrame, no data available."
+        : `Expected 1 row, got ${rows.length} rows. Please report the issue.`;
       return (
-        <SimpleBanner
-          kind="warn"
-          Icon={AlertTriangle}
-          message={`Expected 1 row, got ${rows.length} rows. Please report the issue.`}
-        />
+        <SimpleBanner kind="warn" Icon={AlertTriangle} message={message} />
       );
     }
 

frontend/src/plugins/impl/DataTablePlugin.tsx

@@ -852,6 +852,15 @@ const DataTableComponent = ({
 
   const setViewedRow = useEvent((rowIdx: number) => {
     setViewedRowIdx(rowIdx);
+
+    const outOfBounds =
+      rowIdx < 0 ||
+      (typeof totalRows === "number" && rowIdx >= totalRows) ||
+      totalRows === TOO_MANY_ROWS;
+    if (outOfBounds) {
+      return;
+    }
+
     // If the rowIdx moves to the next / previous page, update the pagination state
     const newPageIndex = getPageIndexForRow(
       rowIdx,