Fixes pagination when there are no results

When there are no results, always ensure that max pages is 1.

This commit also changes the way pagination buttons are displayed,
removing their border.

Author: aeisenberg

extensions/ql-vscode/CHANGELOG.md

@@ -3,6 +3,8 @@
 ## [Unreleased]
 
 - Fix error with choosing qlpack search path.
+- Add the AST Viewer to inspect the QL AST of a source file in a database. Currently, only available for C/C++ sources.
+- Fix pagination when there are no results.
 
 ## 1.3.1 - 7 July 2020
 

extensions/ql-vscode/src/view/result-tables.tsx

@@ -147,8 +147,8 @@ export class ResultTables
     // on initial load of query results, resultSets.numPages will have the number of *raw* pages available,
     // not interpreted pages, because the extension doesn't know the view will default to showing alerts
     // instead.
-    const numPages = selectedTable == ALERTS_TABLE_NAME ?
-      parsedResultSets.numInterpretedPages : parsedResultSets.numPages;
+    const numPages = Math.max(selectedTable === ALERTS_TABLE_NAME ?
+      parsedResultSets.numInterpretedPages : parsedResultSets.numPages, 1);
 
     const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
       this.setState({ selectedPage: e.target.value });
@@ -188,7 +188,12 @@ export class ResultTables
         value={this.state.selectedPage}
         onChange={onChange}
         onBlur={e => choosePage(e.target.value)}
-        onKeyDown={e => { if (e.keyCode === 13) choosePage((e.target as HTMLInputElement).value); }}
+        onKeyDown={e => {
+          if (e.keyCode === 13) {
+            choosePage((e.target as HTMLInputElement).value);
+          }
+        }
+        }
       />
       <span>
         / {numPages}

extensions/ql-vscode/src/view/resultsView.css

@@ -17,7 +17,8 @@
 .vscode-codeql__table-selection-header button {
   padding: 0.3rem;
   margin: 0.2rem;
-  border-radius: 5px;
+  border: 0;
+  font-size: large;
   color: var(--vscode-editor-foreground);
   background-color: var(--vscode-editorGutter-background);
   cursor: pointer;