Fix my bad paging logic

blacksmithgu · Jun 27, 2024 · 0378cf1 · 0378cf1
1 parent 7dc2a4d
commit 0378cf1
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/src/api/ui/views/paging.tsx b/src/api/ui/views/paging.tsx
@@ -36,7 +36,7 @@ function RawControlledPager({
                             className={`dc-paging-control-page ${
                                 p === realPage ? " dc-paging-control-page-active" : ""
                             }`}
-                            onClick={() => setPage(p)}
+                            onClick={(event: any) => setPage(p)}
                         >
                             {p + 1}
                         </button>

diff --git a/src/api/ui/views/vanilla-table.tsx b/src/api/ui/views/vanilla-table.tsx
@@ -4,9 +4,9 @@ import { CURRENT_FILE_CONTEXT, Lit } from "ui/markdown";
 import { useInterning } from "ui/hooks";
 import { Fragment } from "preact/jsx-runtime";
 import { VNode, isValidElement } from "preact";
+import { ControlledPager, useDatacorePaging } from "./paging";
 
 import "./table.css";
-import { ControlledPager, useDatacorePaging } from "./paging";
 
 /** A simple column definition which allows for custom renderers and titles. */
 export interface VanillaColumn<T, V = Literal> {
@@ -71,21 +71,21 @@ export function VanillaTable<T>(props: VanillaTableProps<T>) {
         scrollOnPageChange: props.scrollOnPaging,
         elements: totalElements,
     });
-    const tableRef = useRef<HTMLTableElement>(null);
+    const tableRef = useRef<HTMLDivElement>(null);
 
     const setPage = useCallback(
         (page: number) => {
-            paging.setPage(page);
-
             if (page != paging.page && paging.scroll) {
                 tableRef.current?.scrollIntoView({
                     behavior: "smooth",
                     block: "start",
                     inline: "nearest",
                 });
             }
+
+            paging.setPage(page);
         },
-        [paging.setPage, paging.scroll, tableRef.current]
+        [paging.page, paging.setPage, paging.scroll, tableRef]
     );
 
     const pagedRows = useMemo(() => {
@@ -103,8 +103,8 @@ export function VanillaTable<T>(props: VanillaTableProps<T>) {
     }, [props.groupings]);
 
     return (
-        <div>
-            <table ref={tableRef} className="datacore-table">
+        <div ref={tableRef}>
+            <table className="datacore-table">
                 <thead>
                     <tr className="datacore-table-header-row">
                         {columns.map((col) => (