ui: fixed showing empty result pages (#1306)

Fixes #1149

This is a more universal fix for #1297

htmlui/src/SnapshotsTable.js

@@ -35,7 +35,6 @@ export class SnapshotsTable extends Component {
             snapshots: [],
             showHidden: false,
             isLoading: false,
-            forceFirstPage: false,
             error: null,
         };
         this.onChange = this.onChange.bind(this);
@@ -95,7 +94,6 @@ export class SnapshotsTable extends Component {
     onChange(x) {
         this.setState({
             showHidden: x.target.checked,
-            forceFirstPage: true,
         });
     }
 
@@ -109,14 +107,6 @@ export class SnapshotsTable extends Component {
             return <Spinner animation="border" variant="primary" />;
         }
 
-        const willForceFirstPage = this.state.forceFirstPage;
-
-        if (this.state.forceFirstPage) {
-            this.setState({
-                forceFirstPage: false,
-            })
-        }
-
         snapshots.sort((a, b) => -compare(a.startTime, b.startTime));
 
         let { filteredSnapshots, hiddenCount } = this.coalesceSnapshots(snapshots);
@@ -171,7 +161,7 @@ export class SnapshotsTable extends Component {
             </Row>
             <hr />
             <Row>
-                <MyTable data={filteredSnapshots} columns={columns} forceFirstPage={willForceFirstPage} />
+                <MyTable data={filteredSnapshots} columns={columns} />
             </Row>
         </div>;
     }

htmlui/src/Table.js

@@ -44,7 +44,7 @@ function paginationItems(count, active, gotoPage) {
   return items;
 }
 
-export default function MyTable({ columns, data, forceFirstPage }) {
+export default function MyTable({ columns, data }) {
   // Use the state and functions returned from useTable to build your UI
   const {
     getTableProps,
@@ -71,8 +71,8 @@ export default function MyTable({ columns, data, forceFirstPage }) {
     usePagination,
   )
 
-  if (forceFirstPage && pageIndex !== 0) {
-    gotoPage(0);
+  if (pageIndex >= pageCount && pageIndex !== 0 && pageCount > 0) {
+    gotoPage(pageCount - 1);
   }
 
   const paginationUI = pageOptions.length > 1 &&