.

frontend/src/ui/DataTable.jsx

@@ -75,19 +75,25 @@ export function useDataTable({ columns, rows, pageSize = DEFAULT_PAGE_SIZE }) {
   }
 }
 
-/** Sliding window of ~3 numbers so both arrows fit a narrow Inbox pane. */
+/** 1 2 3 … last, then 2 3 4 … last as you move forward. Arrows sit outside this list. */
 export function pageWindow(cur, pages) {
-  const maxBtns = 3
-  if (pages <= maxBtns) {
-    return Array.from({ length: Math.max(1, pages) }, (_, i) => i + 1)
+  const n = Math.max(1, pages)
+  const windowSize = 3
+  if (n <= windowSize + 1) {
+    return Array.from({ length: n }, (_, i) => i + 1)
   }
-  let start = Math.max(1, cur - 1)
-  let end = start + maxBtns - 1
-  if (end > pages) {
-    end = pages
-    start = Math.max(1, end - maxBtns + 1)
+  let start = Math.max(1, cur)
+  if (start + windowSize - 1 >= n) start = n - windowSize
+  const nums = []
+  for (let i = 0; i < windowSize; i++) nums.push(start + i)
+  const lastInWindow = nums[nums.length - 1]
+  if (lastInWindow < n - 1) {
+    nums.push('…')
+    nums.push(n)
+  } else if (lastInWindow < n) {
+    nums.push(n)
   }
-  return Array.from({ length: end - start + 1 }, (_, i) => start + i)
+  return nums
 }
 
 /** Keep the current page when Per page changes; clamp if it is past the end. */