Merge pull request #1778 from github/v1.7.6

v1.7.6

.gitattributes

@@ -18,4 +18,11 @@ yarn.lock                    merge=binary
 # https://mirrors.edge.kernel.org/pub/software/scm/git/docs/gitattributes.html
 # suggests that this might interleave lines arbitrarily, but empirically
 # it keeps added chunks contiguous
-CHANGELOG.md                merge=union
+CHANGELOG.md                merge=union
+
+# Mark some JSON files containing test data as generated so they are not included
+# as part of diffs or language statistics.
+extensions/ql-vscode/src/stories/remote-queries/data/*.json     linguist-generated
+
+# Always use LF line endings, also on Windows
+* text=auto eol=lf

.github/dependabot.yml

@@ -0,0 +1,22 @@
+version: 2
+updates:
+  - package-ecosystem: "npm"
+    directory: "extensions/ql-vscode"
+    schedule:
+      interval: "weekly"
+      day: "thursday" # Thursday is arbitrary
+    labels:
+      - "Update dependencies"
+    ignore:
+      - dependency-name: "*"
+        update-types: ["version-update:semver-minor", "version-update:semver-patch"]
+  - package-ecosystem: "github-actions"
+    directory: ".github"
+    schedule:
+      interval: "weekly"
+      day: "thursday" # Thursday is arbitrary
+    labels:
+      - "Update dependencies"
+    ignore:
+      - dependency-name: "*"
+        update-types: ["version-update:semver-minor", "version-update:semver-patch"]

.github/pull_request_template.md

@@ -9,4 +9,4 @@ Replace this with a description of the changes your pull request makes.
 
 - [ ] [CHANGELOG.md](https://github.com/github/vscode-codeql/blob/main/extensions/ql-vscode/CHANGELOG.md) has been updated to incorporate all user visible changes made by this pull request.
 - [ ] Issues have been created for any UI or other user-facing changes made by this pull request.
-- [ ] `@github/docs-content-codeql` has been cc'd in all issues for UI or other user-facing changes made by this pull request.
+- [ ] _[Maintainers only]_ If this pull request makes user-facing changes that require documentation changes, open a corresponding docs pull request in the [github/codeql](https://github.com/github/codeql/tree/main/docs/codeql/codeql-for-visual-studio-code) repo and add the `ready-for-doc-review` label there.

.github/workflows/codeql.yml

@@ -19,13 +19,14 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Initialize CodeQL
         uses: github/codeql-action/init@main
         with:
             languages: javascript
             config-file: ./.github/codeql/codeql-config.yml
+            tools: latest
 
       - name: Perform CodeQL Analysis
         uses: github/codeql-action/analyze@main

.github/workflows/dependency-review.yml

@@ -0,0 +1,16 @@
+name: 'Dependency Review'
+on:
+  - pull_request
+  - workflow_dispatch
+
+permissions:
+  contents: read
+
+jobs:
+  dependency-review:
+    runs-on: ubuntu-latest
+    steps:
+      - name: 'Checkout Repository'
+        uses: actions/checkout@v3
+      - name: 'Dependency Review'
+        uses: actions/dependency-review-action@v1

.github/workflows/main.yml

@@ -16,13 +16,13 @@ jobs:
         os: [ubuntu-latest, windows-latest]
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
           fetch-depth: 1
 
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: '14.14.0'
+          node-version: '16.14.2'
 
       - name: Install dependencies
         working-directory: extensions/ql-vscode
@@ -65,7 +65,7 @@ jobs:
         # This workflow step gets an unstable testing version of the CodeQL CLI. It should not be used outside of these tests.
         run: |
           LATEST=`gh api repos/dsp-testing/codeql-cli-nightlies/releases --jq '.[].tag_name' --method GET --raw-field 'per_page=1'`
-          echo "::set-output name=nightly-url::https://github.com/dsp-testing/codeql-cli-nightlies/releases/download/$LATEST"
+          echo "nightly-url=https://github.com/dsp-testing/codeql-cli-nightlies/releases/download/$LATEST" >> "$GITHUB_OUTPUT"
 
   test:
     name: Test
@@ -76,13 +76,13 @@ jobs:
         os: [ubuntu-latest, windows-latest]
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
           fetch-depth: 1
 
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: '14.14.0'
+          node-version: '16.14.2'
 
       - name: Install dependencies
         working-directory: extensions/ql-vscode
@@ -103,6 +103,11 @@ jobs:
         run: |
           npm run lint
 
+      - name: Lint scenarios
+        working-directory: extensions/ql-vscode
+        run: |
+          npm run lint:scenarios
+
       - name: Run unit tests (Linux)
         working-directory: extensions/ql-vscode
         if: matrix.os == 'ubuntu-latest'
@@ -118,13 +123,17 @@ jobs:
       - name: Run integration tests (Linux)
         if: matrix.os == 'ubuntu-latest'
         working-directory: extensions/ql-vscode
+        env:
+          VSCODE_CODEQL_GITHUB_TOKEN: '${{ secrets.GITHUB_TOKEN }}'
         run: |
-          sudo apt-get install xvfb
+          unset DBUS_SESSION_BUS_ADDRESS
           /usr/bin/xvfb-run npm run integration
 
       - name: Run integration tests (Windows)
         if: matrix.os == 'windows-latest'
         working-directory: extensions/ql-vscode
+        env:
+          VSCODE_CODEQL_GITHUB_TOKEN: '${{ secrets.GITHUB_TOKEN }}'
         run: |
           npm run integration
 
@@ -135,7 +144,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest, windows-latest]
-        version: ['v2.3.3', 'v2.4.6', 'v2.5.9', 'v2.6.3', 'v2.7.2', 'nightly']
+        version: ['v2.7.6', 'v2.8.5', 'v2.9.4', 'v2.10.5', 'v2.11.3', 'nightly']
     env:
       CLI_VERSION: ${{ matrix.version }}
       NIGHTLY_URL: ${{ needs.find-nightly.outputs.url }}
@@ -143,11 +152,11 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: '14.14.0'
+          node-version: '16.14.2'
 
       - name: Install dependencies
         working-directory: extensions/ql-vscode
@@ -168,16 +177,13 @@ jobs:
           if [[ "${{ matrix.version }}" == "nightly" ]]
           then
             REF="codeql-cli/latest"
-          elif [[ "${{ matrix.version }}" == "v2.2.6" || "${{ matrix.version }}" == "v2.3.3" ]]
-          then
-            REF="codeql-cli/v2.4.5"
           else
             REF="codeql-cli/${{ matrix.version }}"
           fi
-          echo "::set-output name=ref::$REF"
+          echo "ref=$REF" >> "$GITHUB_OUTPUT"
 
       - name: Checkout QL
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
           repository: github/codeql
           ref: ${{ steps.choose-ref.outputs.ref }}
@@ -187,6 +193,7 @@ jobs:
         working-directory: extensions/ql-vscode
         if: matrix.os == 'ubuntu-latest'
         run: |
+          unset DBUS_SESSION_BUS_ADDRESS
           /usr/bin/xvfb-run npm run cli-integration
 
       - name: Run CLI tests (Windows)

.github/workflows/release.yml

@@ -18,11 +18,11 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v3
         with:
-          node-version: '10.18.1'
+          node-version: '16.14.2'
 
       - name: Install dependencies
         run: |
@@ -47,11 +47,11 @@ jobs:
           # Record the VSIX path as an output of this step.
           # This will be used later when uploading a release asset.
           VSIX_PATH="$(ls dist/*.vsix)"
-          echo "::set-output name=vsix_path::$VSIX_PATH"
+          echo "vsix_path=$VSIX_PATH" >> "$GITHUB_OUTPUT"
           # Transform the GitHub ref so it can be used in a filename.
           # The last sed invocation is used for testing branches that modify this workflow.
           REF_NAME="$(echo ${{ github.ref }} | sed -e 's:^refs/tags/::' | sed -e 's:/:-:g')"
-          echo "::set-output name=ref_name::$REF_NAME"
+          echo "ref_name=$REF_NAME" >> "$GITHUB_OUTPUT"
 
       - name: Upload artifacts
         uses: actions/upload-artifact@v2
@@ -107,7 +107,7 @@ jobs:
           # Bump to the next patch version. Major or minor version bumps will have to be done manually.
           # Record the next version number as an output of this step.
           NEXT_VERSION="$(npm version patch)"
-          echo "::set-output name=next_version::$NEXT_VERSION"
+          echo "next_version=$NEXT_VERSION" >> "$GITHUB_OUTPUT"
 
       - name: Add changelog for next release
         if: success()
@@ -136,7 +136,7 @@ jobs:
       VSCE_TOKEN: ${{ secrets.VSCE_TOKEN }}
     steps:
       - name: Download artifact
-        uses: actions/download-artifact@v2
+        uses: actions/download-artifact@v3
         with:
           name: vscode-codeql-extension
 
@@ -156,7 +156,7 @@ jobs:
       OPEN_VSX_TOKEN: ${{ secrets.OPEN_VSX_TOKEN }}
     steps:
       - name: Download artifact
-        uses: actions/download-artifact@v2
+        uses: actions/download-artifact@v3
         with:
           name: vscode-codeql-extension
 

.gitignore

@@ -16,7 +16,6 @@ artifacts/
 # Visual Studio workspace state
 .vs/
 
-# Rush files
-/common/temp/**
-package-deps.json
-**/.rush/temp
+# CodeQL metadata
+.cache/
+.codeql/

.vscode/extensions.json

@@ -5,7 +5,7 @@
   "recommendations": [
     "amodio.tsl-problem-matcher",
     "dbaeumer.vscode-eslint",
-    "eternalphane.tsfmt-vscode"
+    "esbenp.prettier-vscode"
   ],
   // List of extensions recommended by VS Code that should not be recommended for users of this workspace.
   "unwantedRecommendations": []

.vscode/launch.json

@@ -12,7 +12,6 @@
         // Add a reference to a workspace to open. Eg-
         // "${workspaceRoot}/../vscode-codeql-starter/vscode-codeql-starter.code-workspace"
       ],
-      "stopOnEntry": false,
       "sourceMaps": true,
       "outFiles": [
         "${workspaceRoot}/extensions/ql-vscode/out/**/*.js",
@@ -36,17 +35,31 @@
       "runtimeArgs": [
         "--inspect=9229"
       ],
+      "env": {
+        "LANG": "en-US"
+      },
       "args": [
         "--exit",
         "-u",
         "bdd",
         "--colors",
         "--diff",
-        "-r",
-        "ts-node/register",
+        "--config",
+        ".mocharc.json",
         "test/pure-tests/**/*.ts"
       ],
-      "port": 9229,
+      "stopOnEntry": false,
+      "sourceMaps": true,
+      "console": "integratedTerminal",
+      "internalConsoleOptions": "neverOpen"
+    },
+    {
+      "name": "Launch Unit Tests - React (vscode-codeql)",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceFolder}/extensions/ql-vscode/node_modules/jest/bin/jest.js",
+      "showAsyncStacks": true,
+      "cwd": "${workspaceFolder}/extensions/ql-vscode",
       "stopOnEntry": false,
       "sourceMaps": true,
       "console": "integratedTerminal",
@@ -59,9 +72,11 @@
       "runtimeExecutable": "${execPath}",
       "args": [
         "--extensionDevelopmentPath=${workspaceRoot}/extensions/ql-vscode",
-        "--extensionTestsPath=${workspaceRoot}/extensions/ql-vscode/out/vscode-tests/no-workspace/index"
+        "--extensionTestsPath=${workspaceRoot}/extensions/ql-vscode/out/vscode-tests/no-workspace/index",
+        "--disable-workspace-trust",
+        "--disable-extensions",
+        "--disable-gpu"
       ],
-      "stopOnEntry": false,
       "sourceMaps": true,
       "outFiles": [
         "${workspaceRoot}/extensions/ql-vscode/out/**/*.js",
@@ -75,9 +90,11 @@
       "args": [
         "--extensionDevelopmentPath=${workspaceRoot}/extensions/ql-vscode",
         "--extensionTestsPath=${workspaceRoot}/extensions/ql-vscode/out/vscode-tests/minimal-workspace/index",
+        "--disable-workspace-trust",
+        "--disable-extensions",
+        "--disable-gpu",
         "${workspaceRoot}/extensions/ql-vscode/test/data"
       ],
-      "stopOnEntry": false,
       "sourceMaps": true,
       "outFiles": [
         "${workspaceRoot}/extensions/ql-vscode/out/**/*.js",
@@ -91,8 +108,17 @@
       "args": [
         "--extensionDevelopmentPath=${workspaceRoot}/extensions/ql-vscode",
         "--extensionTestsPath=${workspaceRoot}/extensions/ql-vscode/out/vscode-tests/cli-integration/index",
+        "--disable-workspace-trust",
+        "--disable-gpu",
+        "--disable-extension",
+        "eamodio.gitlens",
+        "--disable-extension",
+        "github.codespaces",
+        "--disable-extension",
+        "github.copilot",
         "${workspaceRoot}/extensions/ql-vscode/src/vscode-tests/cli-integration/data",
-        // Add a path to a checked out instance of the codeql repository so the libraries are
+        // Uncomment the last line and modify the path to a checked out 
+        // instance of the codeql repository so the libraries are
         // available in the workspace for the tests.
         // "${workspaceRoot}/../codeql"
       ],
@@ -109,11 +135,18 @@
         // This option overrides the CLI_VERSION option.
         // "CLI_PATH": "${workspaceRoot}/../semmle-code/target/intree/codeql/codeql",
       },
-      "stopOnEntry": false,
       "sourceMaps": true,
       "outFiles": [
         "${workspaceRoot}/extensions/ql-vscode/out/**/*.js",
       ],
+    },
+    {
+      "name": "Launch Storybook",
+      "type": "node",
+      "request": "launch",
+      "cwd": "${workspaceFolder}/extensions/ql-vscode",
+      "runtimeExecutable": "npm",
+      "runtimeArgs": ["run-script", "storybook"]
     }
   ]
 }

.vscode/settings.json

@@ -30,12 +30,19 @@
     "typescript",
     "typescriptreact"
   ],
-  "eslint.options": {
-    // This is necessary so that eslint can properly resolve its plugins
-    "resolvePluginsRelativeTo": "./extensions/ql-vscode"
-  },
+  // This is necessary to ensure that ESLint can find the correct configuration files and plugins.
+  "eslint.workingDirectories": ["./extensions/ql-vscode"],
   "editor.formatOnSave": false,
   "typescript.preferences.quoteStyle": "single",
   "javascript.preferences.quoteStyle": "single",
-  "editor.wordWrapColumn": 100
+  "editor.wordWrapColumn": 100,
+  "jest.rootPath": "./extensions/ql-vscode",
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true,
+  },
 }

CODEOWNERS

@@ -1 +1,4 @@
 **/* @github/codeql-vscode-reviewers
+**/remote-queries/ @github/code-scanning-secexp-reviewers
+**/variant-analysis/ @github/code-scanning-secexp-reviewers
+**/databases/ @github/code-scanning-secexp-reviewers

CONTRIBUTING.md

@@ -29,7 +29,9 @@ Here are a few things you can do that will increase the likelihood of your pull
 
 ## Setting up a local build
 
-Make sure you have installed recent versions of vscode (>= v1.52), node (>=12.16), and npm (>= 7.5.2). Earlier versions will probably work, but we no longer test against them.
+Make sure you have installed recent versions of vscode, node, and npm. Check the `engines` block in [`package.json`](https://github.com/github/vscode-codeql/blob/main/extensions/ql-vscode/package.json) file for compatible versions. Earlier versions may work, but we no longer test against them.
+
+To automatically switch to the correct version of node, we recommend using [nvm](https://github.com/nvm-sh/nvm), which will pick-up the node version from `.nvmrc`.
 
 ### Installing all packages
 
@@ -52,12 +54,10 @@ Alternatively, you can build the extension within VS Code via `Terminal > Run Bu
 
 Before running any of the launch commands, be sure to have run the `build` command to ensure that the JavaScript is compiled and the resources are copied to the proper location.
 
-We recommend that you keep `npm run watch` running in the backgound and you only need to re-run `npm run build` in the following situations:
+We recommend that you keep `npm run watch` running in the background and you only need to re-run `npm run build` in the following situations:
 
 1. on first checkout
 2. whenever any of the non-TypeScript resources have changed
-3. on any change to files included in one of the webviews
-   - **Important**: This is easy to forget. You must explicitly run `npm run build` whenever one of the files in the webview is changed. These are the files in the `src/view` and `src/compare/view` folders.
 
 ### Installing the extension
 
@@ -77,33 +77,131 @@ $ vscode/scripts/code-cli.sh --install-extension dist/vscode-codeql-*.vsix # if
 
 You can use VS Code to debug the extension without explicitly installing it. Just open this directory as a workspace in VS Code, and hit `F5` to start a debugging session.
 
-### Running the unit tests and integration tests that do not require a CLI instance
+### Storybook
 
-Unit tests and many integration tests do not require a copy of the CodeQL CLI.
-
-Outside of vscode, run:
+You can use [Storybook](https://storybook.js.org/) to preview React components outside VSCode. Inside the `extensions/ql-vscode` directory, run:
 
 ```shell
-npm run test && npm run integration
+npm run storybook
 ```
 
-Alternatively, you can run the tests inside of vscode. There are several vscode launch configurations defined that run the unit and integration tests. They can all be found in the debug view.
+Your browser should automatically open to the Storybook UI. Stories live in the `src/stories` directory.
 
-Only the _With CLI_ tests require a CLI instance to run. See below on how to do that.
+Alternatively, you can start Storybook inside of VSCode. There is a VSCode launch configuration for starting Storybook. It can be found in the debug view.
 
-Running from a terminal, you _must_ set the `TEST_CODEQL_PATH` variable to point to a checkout of the `github/codeql` repository. The appropriate CLI version will be downloaded as part of the test.
+More information about Storybook can be found inside the **Overview** page once you have launched Storybook.
 
-### Running the integration tests
+### Testing
 
-The _Launch Integration Tests - With CLI_ tests require a CLI instance in order to run. There are several environment variables you can use to configure this.
+We have several types of tests:
 
-From inside of VSCode, open the `launch.json` file and in the _Launch Integration Tests - With CLI_ uncomment and change the environment variables appropriate for your purpose.
+* Unit tests: these live in the `tests/pure-tests/` directory
+* View tests: these live in `src/view/variant-analysis/__tests__/`
+* VSCode integration tests: these live in `src/vscode-tests/no-workspace` and `src/vscode-tests/minimal-workspace`
+* CLI integration tests: these live in `src/vscode-tests/cli-integration`
+
+The CLI integration tests require an instance of the CodeQL CLI to run so they will require some extra setup steps. When adding new tests to our test suite, please be mindful of whether they need to be in the cli-integration folder. If the tests don't depend on the CLI, they are better suited to being a VSCode integration test.
+
+Any test data you're using (sample projects, config files, etc.) must go in a `src/vscode-tests/*/data` directory. When you run the tests, the test runner will copy the data directory to `out/vscode-tests/*/data`.
+
+#### Running the tests
+
+Pre-requisites:
+1. Run `npm run build`.
+2. You will need to have `npm run watch` running in the background.
+
+##### 1. From the terminal
+
+Then, from the `extensions/ql-vscode` directory, use the appropriate command to run the tests:
+
+* Unit tests: `npm run test:unit`
+* View Tests: `npm test:view`
+* VSCode integration tests: `npm run integration`
+
+###### CLI integration tests
+
+The CLI integration tests require the CodeQL standard libraries in order to run so you will need to clone a local copy of the `github/codeql` repository.
+
+1. Set the `TEST_CODEQL_PATH` environment variable: running from a terminal, you _must_ set the `TEST_CODEQL_PATH` variable to point to a checkout of the `github/codeql` repository. The appropriate CLI version will be downloaded as part of the test.
+
+2. Run your test command:
+
+```shell
+cd extensions/ql-vscode && npm run cli-integration
+```
+
+##### 2. From VSCode
+
+Alternatively, you can run the tests inside of VSCode. There are several VSCode launch configurations defined that run the unit and integration tests.
+
+You will need to run tests using a task from inside of VS Code, under the "Run and Debug" view:
+
+* Unit tests: run the _Launch Unit Tests - React_ task
+* View Tests: run the _Launch Unit Tests_ task
+* VSCode integration tests: run the _Launch Unit Tests - No Workspace_ and _Launch Unit Tests - Minimal Workspace_ tasks
+
+###### CLI integration tests
+
+The CLI integration tests require the CodeQL standard libraries in order to run so you will need to clone a local copy of the `github/codeql` repository.
+
+1. Set the `TEST_CODEQL_PATH` environment variable: running from a terminal, you _must_ set the `TEST_CODEQL_PATH` variable to point to a checkout of the `github/codeql` repository. The appropriate CLI version will be downloaded as part of the test.
+
+2. Set the codeql path in VSCode's launch configuration: open `launch.json` and under the _Launch Integration Tests - With CLI_ section, uncomment the `"${workspaceRoot}/../codeql"` line. If you've cloned the `github/codeql` repo to a different path, replace the value with the correct path.
+
+3. Run the VSCode task from the "Run and Debug" view called _Launch Integration Tests - With CLI_.
+
+#### Using a mock GitHub API server
+
+Multi-Repo Variant Analyses (MRVA) rely on the GitHub API. In order to make development and testing easy, we have functionality that allows us to intercept requests to the GitHub API and provide mock responses.
+
+##### Using a pre-recorded test scenario
+
+To run a mock MRVA scenario, follow these steps:
+1. Enable the mock GitHub API server by adding the following in your VS Code user settings (which can be found by running the `Preferences: Open User Settings (JSON)` VS Code command):
+```json
+"codeQL.mockGitHubApiServer": {
+  "enabled": true
+}
+```
+
+1. Run the `CodeQL: Mock GitHub API Server: Load Scenario` command from the command pallet, and choose one of the scenarios to load.
+1. Execute a normal MRVA. At this point you should see the scenario being played out, rather than an actual MRVA running.
+1. Once you're done, you can stop using the mock scenario with `CodeQL: Mock GitHub API Server: Unload Scenario`
+
+If you want to replay the same scenario you should unload and reload it so requests are replayed from the start.
+
+##### Recording a new test scenario
+To record a new mock MRVA scenario, follow these steps:
+
+1. Enable the mock GitHub API server by adding the following in your VS Code user settings (which can be found by running the `Preferences: Open User Settings (JSON)` VS Code command):
+```json
+"codeQL.mockGitHubApiServer": {
+  "enabled": true
+}
+```
+
+1. Run the `CodeQL: Mock GitHub API Server: Start Scenario Recording` VS Code command from the command pallet.
+1. Execute a normal MRVA.
+1. Once what you wanted to record is done (e.g. the MRVA has finished), then run the `CodeQL: Mock GitHub API Server: Save Scenario` command from the command pallet.
+1. The scenario should then be available for replaying.
+
+If you want to cancel recording, run the `CodeQL: Mock GitHub API Server: Cancel Scenario Recording` command.
+
+Once the scenario has been recorded, it's often useful to remove some of the requests to speed up the replay, particularly ones that fetch the variant analysis status. Once some of the request files have manually been removed, the [fix-scenario-file-numbering script](./extensions/ql-vscode/scripts/fix-scenario-file-numbering.ts) can be used to update the number of the files. See the script file for details on how to use.
+
+#### Scenario data location
+
+Pre-recorded scenarios are stored in `./src/mocks/scenarios`. However, it's possible to configure the location, by setting the `codeQL.mockGitHubApiServer.scenariosPath` configuration property in the VS Code user settings.
 
 ## Releasing (write access required)
 
 1. Double-check the `CHANGELOG.md` contains all desired change comments and has the version to be released with date at the top.
     * Go through all recent PRs and make sure they are properly accounted for.
     * Make sure all changelog entries have links back to their PR(s) if appropriate.
+1. Double-check that the node version we're using matches the one used for VS Code. If it doesn't, you will then need to update the node version in the following files:
+    * `.nvmrc` - this will enable `nvm` to automatically switch to the correct node version when you're in the project folder
+    * `.github/workflows/main.yml` - all the "node-version: <version>" settings
+    * `.github/workflows/release.yml` - the "node-version: <version>" setting
 1. Double-check that the extension `package.json` and `package-lock.json` have the version you intend to release. If you are doing a patch release (as opposed to minor or major version) this should already be correct.
 1. Create a PR for this release:
     * This PR will contain any missing bits from steps 1 and 2. Most of the time, this will just be updating `CHANGELOG.md` with today's date.
@@ -111,19 +209,40 @@ From inside of VSCode, open the `launch.json` file and in the _Launch Integratio
     * Create a new commit with a message the same as the branch name.
     * Create a PR for this branch.
     * Wait for the PR to be merged into `main`
-1. Trigger a release build on Actions by adding a new tag on branch `main` named after the release, as above. Note that when you push to upstream, you will need to fully qualify the ref. A command like this will work:
+1. Switch to `main` and add a new tag on the `main` branch with your new version (named after the release), e.g.
+    ```bash
+    git checkout main
+    git tag v1.3.6
+    ```
+
+   If you've accidentally created a badly named tag, you can delete it via
+    ```bash
+    git tag -d badly-named-tag
+    ```
+1. Push the new tag up:
+
+   a. If you're using a fork of the repo:
 
     ```bash
     git push upstream refs/tags/v1.3.6
     ```
 
+   b. If you're working straight in this repo:
+
+    ```bash
+    git push origin refs/tags/v1.3.6
+    ```
+
+   This will trigger [a release build](https://github.com/github/vscode-codeql/releases) on Actions.
+
     * **IMPORTANT** Make sure you are on the `main` branch and your local checkout is fully updated when you add the tag.
     * If you accidentally add the tag to the wrong ref, you can just force push it to the right one later.
-
 1. Monitor the status of the release build in the `Release` workflow in the Actions tab.
+    * DO NOT approve the "publish" stages of the workflow yet.
 1. Download the VSIX from the draft GitHub release at the top of [the releases page](https://github.com/github/vscode-codeql/releases) that is created when the release build finishes.
 1. Unzip the `.vsix` and inspect its `package.json` to make sure the version is what you expect,
    or look at the source if there's any doubt the right code is being shipped.
+1. Install the `.vsix` file into your vscode IDE and ensure the extension can load properly. Run a single command (like run query, or add database).
 1. Go to the actions tab of the vscode-codeql repository and select the [Release workflow](https://github.com/github/vscode-codeql/actions?query=workflow%3ARelease).
     - If there is an authentication failure when publishing, be sure to check that the authentication keys haven't expired. See below.
 1. Approve the deployments of the correct Release workflow. This will automatically publish to Open VSX and VS Code Marketplace.
@@ -143,12 +262,7 @@ To regenerate the Open VSX token:
 1. Go to the [Access Tokens](https://open-vsx.org/user-settings/tokens) page and generate a new token.
 1. Update the secret in the `publish-open-vsx` environment in the project settings.
 
-To regenerate the VSCode Marketplace token:
-
-1. Follow the instructions on [getting a PAT for Azure DevOps](https://code.visualstudio.com/api/working-with-extensions/publishing-extension#get-a-personal-access-token).
-1. Update the secret in the `publish-vscode-marketplace` environment in the project settings.
-
-Not that Azure DevOps PATs expire yearly and must be regenerated.
+To regenerate the VSCode Marketplace token, please see our internal documentation. Note that Azure DevOps PATs expire every 90 days and must be regenerated.
 
 ## Resources
 

extensions/ql-vscode/.eslintignore

@@ -0,0 +1,6 @@
+.vscode-test/
+node_modules/
+out/
+
+# Include the Storybook config
+!.storybook

extensions/ql-vscode/.eslintrc.js

@@ -3,14 +3,19 @@ module.exports = {
   parserOptions: {
     ecmaVersion: 2018,
     sourceType: "module",
-    project: ["tsconfig.json", "./src/**/tsconfig.json", "./gulpfile.ts/tsconfig.json"],
+    project: ["tsconfig.json", "./src/**/tsconfig.json", "./gulpfile.ts/tsconfig.json", "./scripts/tsconfig.json", "./.storybook/tsconfig.json"],
   },
   plugins: ["@typescript-eslint"],
   env: {
     node: true,
     es6: true,
   },
-  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:jest-dom/recommended",
+    "plugin:prettier/recommended"
+  ],
   rules: {
     "@typescript-eslint/no-use-before-define": 0,
     "@typescript-eslint/no-unused-vars": [
@@ -27,11 +32,7 @@ module.exports = {
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/no-floating-promises": [ "error", { ignoreVoid: true } ],
     "prefer-const": ["warn", { destructuring: "all" }],
-    indent: "off",
-    "@typescript-eslint/indent": "off",
     "@typescript-eslint/no-throw-literal": "error",
     "no-useless-escape": 0,
-    semi: 2,
-    quotes: ["warn", "single"]
   },
 };

extensions/ql-vscode/.git-blame-ignore-revs

@@ -0,0 +1,5 @@
+# Run this command to always ignore formatting commits in `git blame`
+# git config blame.ignoreRevsFile .git-blame-ignore-revs
+
+# Formatted all code using Prettier instead of tsfmt
+ebcdf8ad0bb5bcb3efa679211709671716b892ba

extensions/ql-vscode/.mocharc.json

@@ -0,0 +1,4 @@
+{
+  "exit": true,
+  "require": ["test/mocha.setup.js"]
+}

extensions/ql-vscode/.npmrc

@@ -0,0 +1,2 @@
+# Storybook requires this option to be set. See https://github.com/storybookjs/storybook/issues/18298
+legacy-peer-deps=true

extensions/ql-vscode/.nvmrc

@@ -0,0 +1 @@
+v16.14.2

extensions/ql-vscode/.prettierignore

@@ -0,0 +1,6 @@
+.vscode-test/
+node_modules/
+out/
+
+# Include the Storybook config
+!.storybook

extensions/ql-vscode/.prettierrc

@@ -0,0 +1,3 @@
+{
+  "trailingComma": "all"
+}

extensions/ql-vscode/.storybook/main.ts

@@ -0,0 +1,17 @@
+import type { StorybookConfig } from "@storybook/core-common";
+
+const config: StorybookConfig = {
+  stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
+  addons: [
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@storybook/addon-interactions",
+    "./vscode-theme-addon/preset.ts",
+  ],
+  framework: "@storybook/react",
+  core: {
+    builder: "@storybook/builder-webpack5",
+  },
+};
+
+module.exports = config;

extensions/ql-vscode/.storybook/manager.ts

@@ -0,0 +1,7 @@
+import { addons } from "@storybook/addons";
+import { themes } from "@storybook/theming";
+
+addons.setConfig({
+  theme: themes.dark,
+  enableShortcuts: false,
+});

extensions/ql-vscode/.storybook/preview.ts

@@ -0,0 +1,31 @@
+import { themes } from "@storybook/theming";
+import { action } from "@storybook/addon-actions";
+
+// Allow all stories/components to use Codicons
+import "@vscode/codicons/dist/codicon.css";
+
+// https://storybook.js.org/docs/react/configure/overview#configure-story-rendering
+export const parameters = {
+  // All props starting with `on` will automatically receive an action as a prop
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  // All props matching these names will automatically get the correct control
+  controls: {
+    matchers: {
+      color: /(background|color)$/i,
+      date: /Date$/,
+    },
+  },
+  // Use a dark theme to be aligned with VSCode
+  docs: {
+    theme: themes.dark,
+  },
+  backgrounds: {
+    // The background is injected by our theme CSS files
+    disable: true,
+  },
+};
+
+(window as any).acquireVsCodeApi = () => ({
+  postMessage: action("post-vscode-message"),
+  setState: action("set-vscode-state"),
+});

extensions/ql-vscode/.storybook/tsconfig.json

@@ -4,10 +4,7 @@
     "moduleResolution": "node",
     "target": "es6",
     "outDir": "out",
-    "lib": [
-      "es6",
-      "dom"
-    ],
+    "lib": ["ES2021", "dom"],
     "jsx": "react",
     "sourceMap": true,
     "rootDir": "..",
@@ -15,9 +12,8 @@
     "noUnusedLocals": true,
     "noImplicitReturns": true,
     "noFallthroughCasesInSwitch": true,
-    "experimentalDecorators": true
+    "experimentalDecorators": true,
+    "skipLibCheck": true
   },
-  "exclude": [
-    "node_modules"
-  ]
-}
+  "exclude": ["node_modules"]
+}

extensions/ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx

@@ -0,0 +1,61 @@
+import * as React from "react";
+import { FunctionComponent, useCallback } from "react";
+
+import { useGlobals } from "@storybook/api";
+import {
+  IconButton,
+  Icons,
+  WithTooltip,
+  TooltipLinkList,
+  Link,
+  WithHideFn,
+} from "@storybook/components";
+
+import { themeNames, VSCodeTheme } from "./theme";
+
+export const ThemeSelector: FunctionComponent = () => {
+  const [{ vscodeTheme }, updateGlobals] = useGlobals();
+
+  const changeTheme = useCallback(
+    (theme: VSCodeTheme) => {
+      updateGlobals({
+        vscodeTheme: theme,
+      });
+    },
+    [updateGlobals],
+  );
+
+  const createLinks = useCallback(
+    (onHide: () => void): Link[] =>
+      Object.values(VSCodeTheme).map((theme) => ({
+        id: theme,
+        onClick() {
+          changeTheme(theme);
+          onHide();
+        },
+        title: themeNames[theme],
+        value: theme,
+        active: vscodeTheme === theme,
+      })),
+    [vscodeTheme, changeTheme],
+  );
+
+  return (
+    <WithTooltip
+      placement="top"
+      trigger="click"
+      closeOnClick
+      tooltip={({ onHide }: WithHideFn) => (
+        <TooltipLinkList links={createLinks(onHide)} />
+      )}
+    >
+      <IconButton
+        key="theme"
+        title="Change the theme of the preview"
+        active={vscodeTheme !== VSCodeTheme.Dark}
+      >
+        <Icons icon="dashboard" />
+      </IconButton>
+    </WithTooltip>
+  );
+};

extensions/ql-vscode/.storybook/vscode-theme-addon/manager.tsx

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { addons, types } from "@storybook/addons";
+import { ThemeSelector } from "./ThemeSelector";
+
+const ADDON_ID = "vscode-theme-addon";
+
+addons.register(ADDON_ID, () => {
+  addons.add(ADDON_ID, {
+    title: "VSCode Themes",
+    type: types.TOOL,
+    match: ({ viewMode }) => !!(viewMode && viewMode.match(/^(story|docs)$/)),
+    render: () => <ThemeSelector />,
+  });
+});

extensions/ql-vscode/.storybook/vscode-theme-addon/preset.ts

@@ -0,0 +1,7 @@
+export function config(entry = []) {
+  return [...entry, require.resolve("./preview.ts")];
+}
+
+export function managerEntries(entry = []) {
+  return [...entry, require.resolve("./manager.tsx")];
+}

extensions/ql-vscode/.storybook/vscode-theme-addon/preview.ts

@@ -0,0 +1,8 @@
+import { withTheme } from "./withTheme";
+import { VSCodeTheme } from "./theme";
+
+export const decorators = [withTheme];
+
+export const globals = {
+  vscodeTheme: VSCodeTheme.Dark,
+};

extensions/ql-vscode/.storybook/vscode-theme-addon/theme.ts

@@ -0,0 +1,9 @@
+export enum VSCodeTheme {
+  Dark = "dark",
+  Light = "light",
+}
+
+export const themeNames: { [key in VSCodeTheme]: string } = {
+  [VSCodeTheme.Dark]: "Dark+",
+  [VSCodeTheme.Light]: "Light+",
+};

extensions/ql-vscode/.storybook/vscode-theme-addon/withTheme.ts

@@ -0,0 +1,48 @@
+import { useEffect, useGlobals } from "@storybook/addons";
+import type {
+  AnyFramework,
+  PartialStoryFn as StoryFunction,
+  StoryContext,
+} from "@storybook/csf";
+
+import { VSCodeTheme } from "./theme";
+
+const themeFiles: { [key in VSCodeTheme]: string } = {
+  [VSCodeTheme.Dark]:
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    require("!file-loader?modules!../../src/stories/vscode-theme-dark.css")
+      .default,
+  [VSCodeTheme.Light]:
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    require("!file-loader?modules!../../src/stories/vscode-theme-light.css")
+      .default,
+};
+
+export const withTheme = (
+  StoryFn: StoryFunction<AnyFramework>,
+  context: StoryContext<AnyFramework>,
+) => {
+  const [{ vscodeTheme }] = useGlobals();
+
+  useEffect(() => {
+    const styleSelectorId =
+      context.viewMode === "docs"
+        ? `addon-vscode-theme-docs-${context.id}`
+        : "addon-vscode-theme-theme";
+
+    const theme = Object.values(VSCodeTheme).includes(vscodeTheme)
+      ? (vscodeTheme as VSCodeTheme)
+      : VSCodeTheme.Dark;
+
+    document.getElementById(styleSelectorId)?.remove();
+
+    const link = document.createElement("link");
+    link.id = styleSelectorId;
+    link.href = themeFiles[theme];
+    link.rel = "stylesheet";
+
+    document.head.appendChild(link);
+  }, [vscodeTheme]);
+
+  return StoryFn();
+};

extensions/ql-vscode/.vscodeignore

@@ -12,5 +12,5 @@ src/**
 .gitignore
 gulpfile.js/**
 tsconfig.json
-tsfmt.json
+.prettierrc
 vsc-extension-quickstart.md

extensions/ql-vscode/CHANGELOG.md

@@ -1,5 +1,117 @@
 # CodeQL for Visual Studio Code: Changelog
 
+## 1.7.6 - 21 November 2022
+
+- Warn users when their VS Code version is too old to support all features in the vscode-codeql extension. [#1674](https://github.com/github/vscode-codeql/pull/1674)
+
+## 1.7.5 - 8 November 2022
+
+- Fix a bug where the AST Viewer was not working unless the associated CodeQL library pack is in the workspace. [#1735](https://github.com/github/vscode-codeql/pull/1735)
+
+## 1.7.4 - 29 October 2022
+
+No user facing changes.
+
+## 1.7.3 - 28 October 2022
+
+- Fix a bug where databases may be lost if VS Code is restarted while the extension is being started up. [#1638](https://github.com/github/vscode-codeql/pull/1638)
+- Add commands for navigating up, down, left, or right in the result viewer. Previously there were only commands for moving up and down the currently-selected path. We suggest binding keyboard shortcuts to these commands, for navigating the result viewer using the keyboard. [#1568](https://github.com/github/vscode-codeql/pull/1568)
+
+## 1.7.2 - 14 October 2022
+
+- Fix a bug where results created in older versions were thought to be unsuccessful. [#1605](https://github.com/github/vscode-codeql/pull/1605)
+
+## 1.7.1 - 12 October 2022
+
+- Fix a bug where it was not possible to add a database folder if the folder name starts with `db-`. [#1565](https://github.com/github/vscode-codeql/pull/1565)
+- Ensure the results view opens in an editor column beside the currently active editor. [#1557](https://github.com/github/vscode-codeql/pull/1557)
+
+## 1.7.0 - 20 September 2022
+
+- Remove ability to download databases from LGTM. [#1467](https://github.com/github/vscode-codeql/pull/1467)
+- Remove the ability to manually upgrade databases from the context menu on databases. Databases are non-destructively upgraded automatically so for most users this was not needed. For advanced users this is still available in the Command Palette. [#1501](https://github.com/github/vscode-codeql/pull/1501)
+- Always restart the query server after a manual database upgrade. This avoids a bug in the query server where an invalid dbscheme was being retained in memory after an upgrade. [#1519](https://github.com/github/vscode-codeql/pull/1519)
+
+## 1.6.12 - 1 September 2022
+
+- Add ability for users to download databases directly from GitHub. [#1485](https://github.com/github/vscode-codeql/pull/1485)
+- Fix a race condition that could cause a failure to open the evaluator log when running a query. [#1490](https://github.com/github/vscode-codeql/pull/1490)
+- Fix an error when running a query with an older version of the CodeQL CLI. [#1490](https://github.com/github/vscode-codeql/pull/1490)
+
+## 1.6.11 - 25 August 2022
+
+No user facing changes.
+
+## 1.6.10 - 9 August 2022
+
+No user facing changes.
+
+## 1.6.9 - 20 July 2022
+
+No user facing changes.
+
+## 1.6.8 - 29 June 2022
+
+- Fix a bug where quick queries cannot be compiled if the core libraries are not in the workspace. [#1411](https://github.com/github/vscode-codeql/pull/1411)
+- Fix a bug where quick evaluation of library files would display an error message when using CodeQL CLI v2.10.0. [#1412](https://github.com/github/vscode-codeql/pull/1412)
+
+## 1.6.7 - 15 June 2022
+
+- Prints end-of-query evaluator log summaries to the Query Log. [#1349](https://github.com/github/vscode-codeql/pull/1349)
+- Be consistent about casing in Query History menu. [#1369](https://github.com/github/vscode-codeql/pull/1369)
+- Fix quoting string columns in exported CSV results. [#1379](https://github.com/github/vscode-codeql/pull/1379)
+
+## 1.6.6 - 17 May 2022
+
+No user facing changes.
+
+## 1.6.5 - 25 April 2022
+
+- Re-enable publishing to open-vsx. [#1285](https://github.com/github/vscode-codeql/pull/1285)
+
+## 1.6.4 - 6 April 2022
+
+No user facing changes.
+
+## 1.6.3 - 4 April 2022
+
+- Fix a bug where the AST viewer was not synchronizing its selected node when the editor selection changes. [#1230](https://github.com/github/vscode-codeql/pull/1230)
+- Avoid synchronizing the `codeQL.cli.executablePath` setting. [#1252](https://github.com/github/vscode-codeql/pull/1252)
+- Open the directory in the finder/explorer (instead of just highlighting it) when running the "Open query directory" command from the query history view. [#1235](https://github.com/github/vscode-codeql/pull/1235)
+- Ensure query label in the query history view changes are persisted across restarts. [#1235](https://github.com/github/vscode-codeql/pull/1235)
+- Prints end-of-query evaluator log summaries to the Query Server Console. [#1264](https://github.com/github/vscode-codeql/pull/1264)
+
+## 1.6.1 - 17 March 2022
+
+No user facing changes.
+
+## 1.6.0 - 7 March 2022
+
+- Fix a bug where database upgrades could not be resolved if some of the target pack's dependencies are outside of the workspace. [#1138](https://github.com/github/vscode-codeql/pull/1138)
+- Open the query server logs for query errors (instead of the extension log). This will make it easier to track down query errors. [#1158](https://github.com/github/vscode-codeql/pull/1158)
+- Fix a bug where queries took a long time to run if there are no folders in the workspace. [#1157](https://github.com/github/vscode-codeql/pull/1157)
+- [BREAKING CHANGE] The `codeQL.runningQueries.customLogDirectory` setting is deprecated and no longer has any function. Instead, all query log files will be stored in the query history directory, next to the query results. [#1178](https://github.com/github/vscode-codeql/pull/1178)
+- Add a _Open query directory_ command for query items. This command opens the directory containing all artifacts for a query. [#1179](https://github.com/github/vscode-codeql/pull/1179)
+- Add options to display evaluator logs for a given query run. Some information that was previously found in the query server output may now be found here. [#1186](https://github.com/github/vscode-codeql/pull/1186)
+
+## 1.5.11 - 10 February 2022
+
+- Fix a bug where invoking _View AST_ from the file explorer would not view the selected file. Instead it would view the active editor. Also, prevent the _View AST_ from appearing if the current selection includes a directory or multiple files. [#1113](https://github.com/github/vscode-codeql/pull/1113)
+- Add query history items as soon as a query is run, including new icons for each history item. [#1094](https://github.com/github/vscode-codeql/pull/1094)
+- Save query history items across restarts. Items will be saved for 30 days and can be overwritten by setting the `codeQL.queryHistory.ttl` configuration setting. [#1130](https://github.com/github/vscode-codeql/pull/1130)
+- Allow in-progress query items to be cancelled from the query history view. [#1105](https://github.com/github/vscode-codeql/pull/1105)
+
+## 1.5.10 - 25 January 2022
+
+- Fix a bug where the results view moved column even when it was already visible. [#1070](https://github.com/github/vscode-codeql/pull/1070)
+- Add packaging-related commands. _CodeQL: Download Packs_ downloads query packs from the package registry that can be run locally, and _CodeQL: Install Pack Dependencies_ installs dependencies for packs in your workspace. [#1076](https://github.com/github/vscode-codeql/pull/1076)
+
+## 1.5.9 - 17 December 2021
+
+- Avoid creating a third column when opening the results view. The results view will always open to the right of the active editor, unless the active editor is in the rightmost editor column. In that case open in the leftmost column. [#1037](https://github.com/github/vscode-codeql/pull/1037)
+- Add a CodeLens to make the Quick Evaluation command more accessible. Click the `Quick Evaluation` prompt above a predicate definition in the editor to evaluate that predicate on its own. You can enable/disable this feature in the `codeQL.runningQueries.quickEvalCodelens` setting. [#1035](https://github.com/github/vscode-codeql/pull/1035) & [#1052](https://github.com/github/vscode-codeql/pull/1052)
+- Fix a bug where the _Alerts_ option would show in the results view even if there is no alerts table available. [#1038](https://github.com/github/vscode-codeql/pull/1038)
+
 ## 1.5.8 - 2 December 2021
 
 - Emit a more explicit error message when a user tries to add a database with an unzipped source folder to the workspace. [#1021](https://github.com/github/vscode-codeql/pull/1021)
@@ -13,7 +125,7 @@
 - Fix a bug with importing large databases. Databases over 4GB can now be imported directly from LGTM or from a zip file. This functionality is only available when using CodeQL CLI version 2.6.0 or later. [#971](https://github.com/github/vscode-codeql/pull/971)
 - Replace certain control codes (`U+0000` - `U+001F`) with their corresponding control labels (`U+2400` - `U+241F`) in the results view. [#963](https://github.com/github/vscode-codeql/pull/963)
 - Allow case-insensitive project slugs for GitHub repositories when adding a CodeQL database from LGTM. [#978](https://github.com/github/vscode-codeql/pull/961)
-- Add a _CodeQL: Preview Query Help_ command to generate Markdown previews of `.qhelp` query help files. This command should only be run in trusted workspaces. See https://codeql.github.com/docs/codeql-cli/testing-query-help-files for more information about query help. [#988](https://github.com/github/vscode-codeql/pull/988)
+- Add a _CodeQL: Preview Query Help_ command to generate Markdown previews of `.qhelp` query help files. This command should only be run in trusted workspaces. See [the CodeQL CLI docs](https://codeql.github.com/docs/codeql-cli/testing-query-help-files) for more information about query help. [#988](https://github.com/github/vscode-codeql/pull/988)
 - Make "Open Referenced File" command accessible from the active editor menu. [#989](https://github.com/github/vscode-codeql/pull/989)
 - Fix a bug where result set names in the result set drop-down were disappearing when viewing a sorted table. [#1007](https://github.com/github/vscode-codeql/pull/1007)
 - Allow query result locations with 0 as the end column value. These are treated as the first column in the line. [#1002](https://github.com/github/vscode-codeql/pull/1002)

extensions/ql-vscode/README.md

@@ -22,7 +22,7 @@ For information about other configurations, see the separate [CodeQL help](https
 
 ### Quick start: Using CodeQL
 
-1. [Import a database from LGTM](#importing-a-database-from-lgtm).
+1. [Import a database from GitHub](#importing-a-database-from-github).
 1. [Run a query](#running-a-query).
 
 ---
@@ -73,18 +73,19 @@ If you're using your own clone of the CodeQL standard libraries, you can do a `g
 
 You can find all the commands contributed by the extension in the Command Palette (**Ctrl+Shift+P** or **Cmd+Shift+P**) by typing `CodeQL`, many of them are also accessible through the interface, and via keyboard shortcuts.
 
-### Importing a database from LGTM
+### Importing a database from GitHub
 
-While you can use the [CodeQL CLI to create your own databases](https://codeql.github.com/docs/codeql-cli/creating-codeql-databases/), the simplest way to start is by downloading a database from LGTM.com.
+While you can use the [CodeQL CLI to create your own databases](https://codeql.github.com/docs/codeql-cli/creating-codeql-databases/), the simplest way to start is by downloading a database from GitHub.com.
 
-1. Open [LGTM.com](https://lgtm.com/#explore) in your browser.
-1. Search for a project you're interested in, for example [Apache Kafka](https://lgtm.com/projects/g/apache/kafka).
-1. Copy the link to that project, for example `https://lgtm.com/projects/g/apache/kafka`.
-1. In VS Code, open the Command Palette and choose the **CodeQL: Download Database from LGTM** command.
+1. Find a project that you're interested in on GitHub.com, for example [Apache Kafka](https://github.com/apache/kafka).
+1. Copy the link to that project, for example `https://github.com/apache/kafka`.
+1. In VS Code, open the Command Palette and choose the **CodeQL: Download Database from GitHub** command.
 1. Paste the link you copied earlier.
 1. Select the language for the database you want to download (only required if the project has databases for multiple languages).
 1. Once the CodeQL database has been imported, it is displayed in the Databases view.
 
+For more information, see [Choosing a database](https://codeql.github.com/docs/codeql-for-visual-studio-code/analyzing-your-projects/#choosing-a-database) on codeql.github.com.
+
 ### Running a query
 
 The instructions below assume that you're using the CodeQL starter workspace, or that you've added the CodeQL libraries and queries repository to your workspace.
@@ -98,6 +99,10 @@ When the results are ready, they're displayed in the CodeQL Query Results view.
 
 If there are any problems running a query, a notification is displayed in the bottom right corner of the application. In addition to the error message, the notification includes details of how to fix the problem.
 
+### Keyboard navigation
+
+If you wish to navigate the query results from your keyboard, you can bind shortcuts to the **CodeQL: Navigate Up/Down/Left/Right in Result Viewer** commands.
+
 ## What next?
 
 For more information about the CodeQL extension, [see the documentation](https://codeql.github.com/docs/codeql-for-visual-studio-code/). Otherwise, you could:

extensions/ql-vscode/gulpfile.ts/appInsights.ts

@@ -1,16 +1,20 @@
-import * as gulp from 'gulp';
-import * as replace from 'gulp-replace';
+import * as gulp from "gulp";
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const replace = require("gulp-replace");
 
 /** Inject the application insights key into the telemetry file */
 export function injectAppInsightsKey() {
   if (!process.env.APP_INSIGHTS_KEY) {
     // noop
-    console.log('APP_INSIGHTS_KEY environment variable is not set. So, cannot inject it into the application.');
+    console.log(
+      "APP_INSIGHTS_KEY environment variable is not set. So, cannot inject it into the application.",
+    );
     return Promise.resolve();
   }
 
   // replace the key
-  return gulp.src(['out/telemetry.js'])
+  return gulp
+    .src(["out/telemetry.js"])
     .pipe(replace(/REPLACE-APP-INSIGHTS-KEY/, process.env.APP_INSIGHTS_KEY))
-    .pipe(gulp.dest('out/'));
+    .pipe(gulp.dest("out/"));
 }

extensions/ql-vscode/gulpfile.ts/deploy.ts

@@ -1,6 +1,5 @@
-import * as fs from 'fs-extra';
-import * as jsonc from 'jsonc-parser';
-import * as path from 'path';
+import * as fs from "fs-extra";
+import * as path from "path";
 
 export interface DeployedPackage {
   distPath: string;
@@ -9,44 +8,64 @@ export interface DeployedPackage {
 }
 
 const packageFiles = [
-  '.vscodeignore',
-  'CHANGELOG.md',
-  'README.md',
-  'language-configuration.json',
-  'snippets.json',
-  'media',
-  'node_modules',
-  'out'
+  ".vscodeignore",
+  "CHANGELOG.md",
+  "README.md",
+  "language-configuration.json",
+  "snippets.json",
+  "media",
+  "node_modules",
+  "out",
+  "workspace-databases-schema.json",
 ];
 
-async function copyPackage(sourcePath: string, destPath: string): Promise<void> {
+async function copyPackage(
+  sourcePath: string,
+  destPath: string,
+): Promise<void> {
   for (const file of packageFiles) {
-    console.log(`copying ${path.resolve(sourcePath, file)} to ${path.resolve(destPath, file)}`);
+    console.log(
+      `copying ${path.resolve(sourcePath, file)} to ${path.resolve(
+        destPath,
+        file,
+      )}`,
+    );
     await fs.copy(path.resolve(sourcePath, file), path.resolve(destPath, file));
   }
 }
 
-export async function deployPackage(packageJsonPath: string): Promise<DeployedPackage> {
+export async function deployPackage(
+  packageJsonPath: string,
+): Promise<DeployedPackage> {
   try {
-    const packageJson: any = jsonc.parse(await fs.readFile(packageJsonPath, 'utf8'));
+    const packageJson: any = JSON.parse(
+      await fs.readFile(packageJsonPath, "utf8"),
+    );
 
     // Default to development build; use flag --release to indicate release build.
-    const isDevBuild = !process.argv.includes('--release');
-    const distDir = path.join(__dirname, '../../../dist');
+    const isDevBuild = !process.argv.includes("--release");
+    const distDir = path.join(__dirname, "../../../dist");
     await fs.mkdirs(distDir);
 
     if (isDevBuild) {
       // NOTE: rootPackage.name had better not have any regex metacharacters
-      const oldDevBuildPattern = new RegExp('^' + packageJson.name + '[^/]+-dev[0-9.]+\\.vsix$');
+      const oldDevBuildPattern = new RegExp(
+        "^" + packageJson.name + "[^/]+-dev[0-9.]+\\.vsix$",
+      );
       // Dev package filenames are of the form
       //    vscode-codeql-0.0.1-dev.2019.9.27.19.55.20.vsix
-      (await fs.readdir(distDir)).filter(name => name.match(oldDevBuildPattern)).map(build => {
-        console.log(`Deleting old dev build ${build}...`);
-        fs.unlinkSync(path.join(distDir, build));
-      });
+      (await fs.readdir(distDir))
+        .filter((name) => name.match(oldDevBuildPattern))
+        .map((build) => {
+          console.log(`Deleting old dev build ${build}...`);
+          fs.unlinkSync(path.join(distDir, build));
+        });
       const now = new Date();
-      packageJson.version = packageJson.version +
-        `-dev.${now.getUTCFullYear()}.${now.getUTCMonth() + 1}.${now.getUTCDate()}` +
+      packageJson.version =
+        packageJson.version +
+        `-dev.${now.getUTCFullYear()}.${
+          now.getUTCMonth() + 1
+        }.${now.getUTCDate()}` +
         `.${now.getUTCHours()}.${now.getUTCMinutes()}.${now.getUTCSeconds()}`;
     }
 
@@ -54,19 +73,23 @@ export async function deployPackage(packageJsonPath: string): Promise<DeployedPa
     await fs.remove(distPath);
     await fs.mkdirs(distPath);
 
-    await fs.writeFile(path.join(distPath, 'package.json'), JSON.stringify(packageJson, null, 2));
+    await fs.writeFile(
+      path.join(distPath, "package.json"),
+      JSON.stringify(packageJson, null, 2),
+    );
 
-    const sourcePath = path.join(__dirname, '..');
-    console.log(`Copying package '${packageJson.name}' and its dependencies to '${distPath}'...`);
+    const sourcePath = path.join(__dirname, "..");
+    console.log(
+      `Copying package '${packageJson.name}' and its dependencies to '${distPath}'...`,
+    );
     await copyPackage(sourcePath, distPath);
 
     return {
       distPath: distPath,
       name: packageJson.name,
-      version: packageJson.version
+      version: packageJson.version,
     };
-  }
-  catch (e) {
+  } catch (e) {
     console.error(e);
     throw e;
   }

extensions/ql-vscode/gulpfile.ts/index.ts

@@ -1,15 +1,34 @@
-import * as gulp from 'gulp';
-import { compileTypeScript, watchTypeScript, copyViewCss } from './typescript';
-import { compileTextMateGrammar } from './textmate';
-import { copyTestData } from './tests';
-import { compileView } from './webpack';
-import { packageExtension } from './package';
-import { injectAppInsightsKey } from './appInsights';
+import * as gulp from "gulp";
+import { compileTypeScript, watchTypeScript, cleanOutput } from "./typescript";
+import { compileTextMateGrammar } from "./textmate";
+import { copyTestData, watchTestData } from "./tests";
+import { compileView, watchView } from "./webpack";
+import { packageExtension } from "./package";
+import { injectAppInsightsKey } from "./appInsights";
 
-export const buildWithoutPackage =
+export const buildWithoutPackage = gulp.series(
+  cleanOutput,
   gulp.parallel(
-    compileTypeScript, compileTextMateGrammar, compileView, copyTestData, copyViewCss
-  );
+    compileTypeScript,
+    compileTextMateGrammar,
+    compileView,
+    copyTestData,
+  ),
+);
 
-export { compileTextMateGrammar, watchTypeScript, compileTypeScript, copyTestData, injectAppInsightsKey };
-export default gulp.series(buildWithoutPackage, injectAppInsightsKey, packageExtension);
+export {
+  cleanOutput,
+  compileTextMateGrammar,
+  watchTypeScript,
+  watchView,
+  compileTypeScript,
+  copyTestData,
+  watchTestData,
+  injectAppInsightsKey,
+  compileView,
+};
+export default gulp.series(
+  buildWithoutPackage,
+  injectAppInsightsKey,
+  packageExtension,
+);

extensions/ql-vscode/gulpfile.ts/package.ts

@@ -1,21 +1,28 @@
-import * as path from 'path';
-import { deployPackage } from './deploy';
-import * as childProcess from 'child-process-promise';
+import * as path from "path";
+import { deployPackage } from "./deploy";
+import * as childProcess from "child-process-promise";
 
 export async function packageExtension(): Promise<void> {
-  const deployedPackage = await deployPackage(path.resolve('package.json'));
-  console.log(`Packaging extension '${deployedPackage.name}@${deployedPackage.version}'...`);
+  const deployedPackage = await deployPackage(path.resolve("package.json"));
+  console.log(
+    `Packaging extension '${deployedPackage.name}@${deployedPackage.version}'...`,
+  );
   const args = [
-    'package',
-    '--out', path.resolve(deployedPackage.distPath, '..', `${deployedPackage.name}-${deployedPackage.version}.vsix`)
+    "package",
+    "--out",
+    path.resolve(
+      deployedPackage.distPath,
+      "..",
+      `${deployedPackage.name}-${deployedPackage.version}.vsix`,
+    ),
   ];
-  const proc = childProcess.spawn('./node_modules/.bin/vsce', args, {
-    cwd: deployedPackage.distPath
+  const proc = childProcess.spawn("./node_modules/.bin/vsce", args, {
+    cwd: deployedPackage.distPath,
   });
-  proc.childProcess.stdout!.on('data', (data) => {
+  proc.childProcess.stdout!.on("data", (data) => {
     console.log(data.toString());
   });
-  proc.childProcess.stderr!.on('data', (data) => {
+  proc.childProcess.stderr!.on("data", (data) => {
     console.error(data.toString());
   });
 

extensions/ql-vscode/gulpfile.ts/tests.ts

@@ -1,17 +1,21 @@
-import * as gulp from 'gulp';
+import * as gulp from "gulp";
 
 export function copyTestData() {
-  copyNoWorkspaceData();
-  copyCliIntegrationData();
-  return Promise.resolve();
+  return Promise.all([copyNoWorkspaceData(), copyCliIntegrationData()]);
+}
+
+export function watchTestData() {
+  return gulp.watch(["src/vscode-tests/*/data/**/*"], copyTestData);
 }
 
 function copyNoWorkspaceData() {
-  return gulp.src('src/vscode-tests/no-workspace/data/**/*')
-    .pipe(gulp.dest('out/vscode-tests/no-workspace/data'));
+  return gulp
+    .src("src/vscode-tests/no-workspace/data/**/*")
+    .pipe(gulp.dest("out/vscode-tests/no-workspace/data"));
 }
 
 function copyCliIntegrationData() {
-  return gulp.src('src/vscode-tests/cli-integration/data/**/*')
-    .pipe(gulp.dest('out/vscode-tests/cli-integration/data'));
+  return gulp
+    .src("src/vscode-tests/cli-integration/data/**/*")
+    .pipe(gulp.dest("out/vscode-tests/cli-integration/data"));
 }

extensions/ql-vscode/gulpfile.ts/textmate.ts

@@ -1,8 +1,8 @@
-import * as gulp from 'gulp';
-import * as jsYaml from 'js-yaml';
-import * as through from 'through2';
-import * as PluginError from 'plugin-error';
-import * as Vinyl from 'vinyl';
+import * as gulp from "gulp";
+import * as jsYaml from "js-yaml";
+import * as through from "through2";
+import * as PluginError from "plugin-error";
+import * as Vinyl from "vinyl";
 
 /**
  * Replaces all rule references with the match pattern of the referenced rule.
@@ -11,7 +11,10 @@ import * as Vinyl from 'vinyl';
  * @param replacements Map from rule name to match text.
  * @returns The new regex after replacement.
  */
-function replaceReferencesWithStrings(value: string, replacements: Map<string, string>): string {
+function replaceReferencesWithStrings(
+  value: string,
+  replacements: Map<string, string>,
+): string {
   let result = value;
   // eslint-disable-next-line no-constant-condition
   while (true) {
@@ -52,21 +55,19 @@ function getNodeMatchText(rule: any): string {
   if (rule.match !== undefined) {
     // For a match string, just use that string as the replacement.
     return rule.match;
-  }
-  else if (rule.patterns !== undefined) {
+  } else if (rule.patterns !== undefined) {
     const patterns: string[] = [];
     // For a list of patterns, use the disjunction of those patterns.
     for (const patternIndex in rule.patterns) {
       const pattern = rule.patterns[patternIndex];
       if (pattern.include !== null) {
-        patterns.push('(?' + pattern.include + ')');
+        patterns.push("(?" + pattern.include + ")");
       }
     }
 
-    return '(?:' + patterns.join('|') + ')';
-  }
-  else {
-    return '';
+    return "(?:" + patterns.join("|") + ")";
+  } else {
+    return "";
   }
 }
 
@@ -109,7 +110,7 @@ function visitAllRulesInFile(yaml: any, action: (rule: any) => void) {
 function visitAllRulesInRuleMap(ruleMap: any, action: (rule: any) => void) {
   for (const key in ruleMap) {
     const rule = ruleMap[key];
-    if ((typeof rule) === 'object') {
+    if (typeof rule === "object") {
       action(rule);
       if (rule.patterns !== undefined) {
         visitAllRulesInRuleMap(rule.patterns, action);
@@ -127,10 +128,10 @@ function visitAllRulesInRuleMap(ruleMap: any, action: (rule: any) => void) {
 function visitAllMatchesInRule(rule: any, action: (match: any) => any) {
   for (const key in rule) {
     switch (key) {
-      case 'begin':
-      case 'end':
-      case 'match':
-      case 'while':
+      case "begin":
+      case "end":
+      case "match":
+      case "while":
         rule[key] = action(rule[key]);
         break;
 
@@ -147,21 +148,21 @@ function visitAllMatchesInRule(rule: any, action: (match: any) => any) {
  * @param rule Rule to be transformed.
  * @param key Base key of the property to be transformed.
  */
-function expandPatternMatchProperties(rule: any, key: 'begin' | 'end') {
-  const patternKey = key + 'Pattern';
-  const capturesKey = key + 'Captures';
+function expandPatternMatchProperties(rule: any, key: "begin" | "end") {
+  const patternKey = key + "Pattern";
+  const capturesKey = key + "Captures";
   const pattern = rule[patternKey];
   if (pattern !== undefined) {
     const patterns: string[] = Array.isArray(pattern) ? pattern : [pattern];
-    rule[key] = patterns.map(p => `((?${p}))`).join('|');
+    rule[key] = patterns.map((p) => `((?${p}))`).join("|");
     const captures: { [index: string]: any } = {};
     for (const patternIndex in patterns) {
       captures[(Number(patternIndex) + 1).toString()] = {
         patterns: [
           {
-            include: patterns[patternIndex]
-          }
-        ]
+            include: patterns[patternIndex],
+          },
+        ],
       };
     }
     rule[capturesKey] = captures;
@@ -177,20 +178,19 @@ function expandPatternMatchProperties(rule: any, key: 'begin' | 'end') {
 function transformFile(yaml: any) {
   const macros = gatherMacros(yaml);
   visitAllRulesInFile(yaml, (rule) => {
-    expandPatternMatchProperties(rule, 'begin');
-    expandPatternMatchProperties(rule, 'end');
+    expandPatternMatchProperties(rule, "begin");
+    expandPatternMatchProperties(rule, "end");
   });
 
   // Expand macros in matches.
   visitAllRulesInFile(yaml, (rule) => {
     visitAllMatchesInRule(rule, (match) => {
-      if ((typeof match) === 'object') {
+      if (typeof match === "object") {
         for (const key in match) {
-          return macros.get(key)!.replace('(?#)', `(?:${match[key]})`);
+          return macros.get(key)!.replace("(?#)", `(?:${match[key]})`);
         }
-        throw new Error('No key in macro map.');
-      }
-      else {
+        throw new Error("No key in macro map.");
+      } else {
         return match;
       }
     });
@@ -207,7 +207,7 @@ function transformFile(yaml: any) {
   });
 
   if (yaml.regexOptions !== undefined) {
-    const regexOptions = '(?' + yaml.regexOptions + ')';
+    const regexOptions = "(?" + yaml.regexOptions + ")";
     visitAllRulesInFile(yaml, (rule) => {
       visitAllMatchesInRule(rule, (match) => {
         return regexOptions + match;
@@ -219,28 +219,36 @@ function transformFile(yaml: any) {
 }
 
 export function transpileTextMateGrammar() {
-  return through.obj((file: Vinyl, _encoding: string, callback: Function): void => {
-    if (file.isNull()) {
-      callback(null, file);
-    }
-    else if (file.isBuffer()) {
-      const buf: Buffer = file.contents;
-      const yamlText: string = buf.toString('utf8');
-      const jsonData: any = jsYaml.safeLoad(yamlText);
-      transformFile(jsonData);
+  return through.obj(
+    (
+      file: Vinyl,
+      _encoding: string,
+      callback: (err: string | null, file: Vinyl | PluginError) => void,
+    ): void => {
+      if (file.isNull()) {
+        callback(null, file);
+      } else if (file.isBuffer()) {
+        const buf: Buffer = file.contents;
+        const yamlText: string = buf.toString("utf8");
+        const jsonData: any = jsYaml.load(yamlText);
+        transformFile(jsonData);
 
-      file.contents = Buffer.from(JSON.stringify(jsonData, null, 2), 'utf8');
-      file.extname = '.json';
-      callback(null, file);
-    }
-    else {
-      callback('error', new PluginError('transpileTextMateGrammar', 'Format not supported.'));
-    }
-  });
+        file.contents = Buffer.from(JSON.stringify(jsonData, null, 2), "utf8");
+        file.extname = ".json";
+        callback(null, file);
+      } else {
+        callback(
+          "error",
+          new PluginError("transpileTextMateGrammar", "Format not supported."),
+        );
+      }
+    },
+  );
 }
 
 export function compileTextMateGrammar() {
-  return gulp.src('syntaxes/*.tmLanguage.yml')
+  return gulp
+    .src("syntaxes/*.tmLanguage.yml")
     .pipe(transpileTextMateGrammar())
-    .pipe(gulp.dest('out/syntaxes'));
+    .pipe(gulp.dest("out/syntaxes"));
 }

extensions/ql-vscode/gulpfile.ts/tsconfig.json

@@ -5,7 +5,7 @@
     "strict": true,
     "module": "commonjs",
     "target": "es2017",
-    "lib": ["es6"],
+    "lib": ["ES2021"],
     "moduleResolution": "node",
     "sourceMap": true,
     "rootDir": ".",
@@ -16,7 +16,8 @@
     "noImplicitReturns": true,
     "experimentalDecorators": true,
     "noUnusedLocals": true,
-    "noUnusedParameters": true
+    "noUnusedParameters": true,
+    "esModuleInterop": true
   },
   "include": ["*.ts"]
 }

extensions/ql-vscode/gulpfile.ts/typescript.ts

@@ -1,42 +1,62 @@
-import * as colors from 'ansi-colors';
-import * as gulp from 'gulp';
-import * as sourcemaps from 'gulp-sourcemaps';
-import * as ts from 'gulp-typescript';
+import * as colors from "ansi-colors";
+import * as gulp from "gulp";
+import * as sourcemaps from "gulp-sourcemaps";
+import * as ts from "gulp-typescript";
+import * as del from "del";
 
 function goodReporter(): ts.reporter.Reporter {
   return {
     error: (error, typescript) => {
       if (error.tsFile) {
-        console.log('[' + colors.gray('gulp-typescript') + '] ' + colors.red(error.fullFilename
-          + '(' + (error.startPosition!.line + 1) + ',' + error.startPosition!.character + '): ')
-          + 'error TS' + error.diagnostic.code + ': ' + typescript.flattenDiagnosticMessageText(error.diagnostic.messageText, '\n'));
-      }
-      else {
+        console.log(
+          "[" +
+            colors.gray("gulp-typescript") +
+            "] " +
+            colors.red(
+              error.fullFilename +
+                "(" +
+                (error.startPosition!.line + 1) +
+                "," +
+                error.startPosition!.character +
+                "): ",
+            ) +
+            "error TS" +
+            error.diagnostic.code +
+            ": " +
+            typescript.flattenDiagnosticMessageText(
+              error.diagnostic.messageText,
+              "\n",
+            ),
+        );
+      } else {
         console.log(error.message);
       }
     },
   };
 }
 
-const tsProject = ts.createProject('tsconfig.json');
+const tsProject = ts.createProject("tsconfig.json");
+
+export function cleanOutput() {
+  return tsProject.projectDirectory
+    ? del(tsProject.projectDirectory + "/out/*")
+    : Promise.resolve();
+}
 
 export function compileTypeScript() {
-  return tsProject.src()
+  return tsProject
+    .src()
     .pipe(sourcemaps.init())
     .pipe(tsProject(goodReporter()))
-    .pipe(sourcemaps.write('.', {
-      includeContent: false,
-      sourceRoot: '.',
-    }))
-    .pipe(gulp.dest('out'));
+    .pipe(
+      sourcemaps.write(".", {
+        includeContent: false,
+        sourceRoot: ".",
+      }),
+    )
+    .pipe(gulp.dest("out"));
 }
 
 export function watchTypeScript() {
-  gulp.watch('src/**/*.ts', compileTypeScript);
-}
-
-/** Copy CSS files for the results view into the output directory. */
-export function copyViewCss() {
-  return gulp.src('src/view/*.css')
-    .pipe(gulp.dest('out'));
+  gulp.watch("src/**/*.ts", compileTypeScript);
 }

extensions/ql-vscode/gulpfile.ts/webpack.config.ts

@@ -1,68 +1,80 @@
-import * as path from 'path';
-import * as webpack from 'webpack';
+import * as path from "path";
+import * as webpack from "webpack";
+import * as MiniCssExtractPlugin from "mini-css-extract-plugin";
 
 export const config: webpack.Configuration = {
-  mode: 'development',
+  mode: "development",
   entry: {
-    resultsView: './src/view/results.tsx',
-    compareView: './src/compare/view/Compare.tsx',
+    webview: "./src/view/webview.tsx",
   },
   output: {
-    path: path.resolve(__dirname, '..', 'out'),
-    filename: '[name].js'
+    path: path.resolve(__dirname, "..", "out"),
+    filename: "[name].js",
   },
-  devtool: 'inline-source-map',
+  devtool: "inline-source-map",
   resolve: {
-    extensions: ['.js', '.ts', '.tsx', '.json'],
+    extensions: [".js", ".ts", ".tsx", ".json"],
     fallback: {
-      path: require.resolve('path-browserify')
-    }
+      path: require.resolve("path-browserify"),
+    },
   },
   module: {
     rules: [
       {
         test: /\.(ts|tsx)$/,
-        loader: 'ts-loader',
+        loader: "ts-loader",
         options: {
-          configFile: 'src/view/tsconfig.json',
-        }
+          configFile: "src/view/tsconfig.json",
+        },
       },
       {
         test: /\.less$/,
         use: [
+          MiniCssExtractPlugin.loader,
           {
-            loader: 'style-loader'
-          },
-          {
-            loader: 'css-loader',
+            loader: "css-loader",
             options: {
               importLoaders: 1,
-              sourceMap: true
-            }
+              sourceMap: true,
+            },
           },
           {
-            loader: 'less-loader',
+            loader: "less-loader",
             options: {
               javascriptEnabled: true,
-              sourceMap: true
-            }
-          }
-        ]
+              sourceMap: true,
+            },
+          },
+        ],
       },
       {
         test: /\.css$/,
         use: [
+          MiniCssExtractPlugin.loader,
           {
-            loader: 'style-loader'
+            loader: "css-loader",
           },
+        ],
+      },
+      {
+        test: /\.(woff(2)?|ttf|eot)$/,
+        use: [
           {
-            loader: 'css-loader'
-          }
-        ]
-      }
-    ]
+            loader: "file-loader",
+            options: {
+              name: "[name].[ext]",
+              outputPath: "fonts/",
+              // We need this to make Webpack use the correct path for the fonts.
+              // Without this, the CSS file will use `url([object Module])`
+              esModule: false,
+            },
+          },
+        ],
+      },
+    ],
   },
   performance: {
-    hints: false
-  }
+    hints: false,
+  },
+  plugins: [new MiniCssExtractPlugin()],
 };

extensions/ql-vscode/gulpfile.ts/webpack.ts

@@ -1,30 +1,57 @@
-import * as webpack from 'webpack';
-import { config } from './webpack.config';
+import * as webpack from "webpack";
+import { config } from "./webpack.config";
 
 export function compileView(cb: (err?: Error) => void) {
-  webpack(config).run((error, stats) => {
+  doWebpack(config, true, cb);
+}
+
+export function watchView(cb: (err?: Error) => void) {
+  const watchConfig = {
+    ...config,
+    watch: true,
+    watchOptions: {
+      aggregateTimeout: 200,
+      poll: 1000,
+    },
+  };
+  doWebpack(watchConfig, false, cb);
+}
+
+function doWebpack(
+  internalConfig: webpack.Configuration,
+  failOnError: boolean,
+  cb: (err?: Error) => void,
+) {
+  const resultCb = (error: Error | undefined, stats?: webpack.Stats) => {
     if (error) {
       cb(error);
     }
     if (stats) {
-      console.log(stats.toString({
-        errorDetails: true,
-        colors: true,
-        assets: false,
-        builtAt: false,
-        version: false,
-        hash: false,
-        entrypoints: false,
-        timings: false,
-        modules: false,
-        errors: true
-      }));
+      console.log(
+        stats.toString({
+          errorDetails: true,
+          colors: true,
+          assets: false,
+          builtAt: false,
+          version: false,
+          hash: false,
+          entrypoints: false,
+          timings: false,
+          modules: false,
+          errors: true,
+        }),
+      );
       if (stats.hasErrors()) {
-        cb(new Error('Compilation errors detected.'));
-        return;
+        if (failOnError) {
+          cb(new Error("Compilation errors detected."));
+          return;
+        } else {
+          console.error("Compilation errors detected.");
+        }
       }
+      cb();
     }
+  };
 
-    cb();
-  });
+  webpack(internalConfig, resultCb);
 }

extensions/ql-vscode/jest.config.js

@@ -0,0 +1,214 @@
+/*
+ * For a detailed explanation regarding each configuration property and type check, visit:
+ * https://jestjs.io/docs/configuration
+ */
+
+module.exports = {
+  // All imported modules in your tests should be mocked automatically
+  // automock: false,
+
+  // Stop running tests after `n` failures
+  // bail: 0,
+
+  // The directory where Jest should store its cached dependency information
+  // cacheDirectory: "/private/var/folders/6m/1394pht172qgd7dmw1fwjk100000gn/T/jest_dx",
+
+  // Automatically clear mock calls, instances, contexts and results before every test
+  // clearMocks: true,
+
+  // Indicates whether the coverage information should be collected while executing the test
+  // collectCoverage: false,
+
+  // An array of glob patterns indicating a set of files for which coverage information should be collected
+  // collectCoverageFrom: undefined,
+
+  // The directory where Jest should output its coverage files
+  // coverageDirectory: undefined,
+
+  // An array of regexp pattern strings used to skip coverage collection
+  // coveragePathIgnorePatterns: [
+  //   "/node_modules/"
+  // ],
+
+  // Indicates which provider should be used to instrument code for coverage
+  coverageProvider: 'v8',
+
+  // A list of reporter names that Jest uses when writing coverage reports
+  // coverageReporters: [
+  //   "json",
+  //   "text",
+  //   "lcov",
+  //   "clover"
+  // ],
+
+  // An object that configures minimum threshold enforcement for coverage results
+  // coverageThreshold: undefined,
+
+  // A path to a custom dependency extractor
+  // dependencyExtractor: undefined,
+
+  // Make calling deprecated APIs throw helpful error messages
+  // errorOnDeprecated: false,
+
+  // The default configuration for fake timers
+  // fakeTimers: {
+  //   "enableGlobally": false
+  // },
+
+  // Force coverage collection from ignored files using an array of glob patterns
+  // forceCoverageMatch: [],
+
+  // A path to a module which exports an async function that is triggered once before all test suites
+  // globalSetup: undefined,
+
+  // A path to a module which exports an async function that is triggered once after all test suites
+  // globalTeardown: undefined,
+
+  // A set of global variables that need to be available in all test environments
+  // globals: {},
+
+  // The maximum amount of workers used to run your tests. Can be specified as % or a number. E.g. maxWorkers: 10% will use 10% of your CPU amount + 1 as the maximum worker number. maxWorkers: 2 will use a maximum of 2 workers.
+  // maxWorkers: "50%",
+
+  // An array of directory names to be searched recursively up from the requiring module's location
+  // moduleDirectories: [
+  //   "node_modules"
+  // ],
+
+  // An array of file extensions your modules use
+  moduleFileExtensions: [
+    'js',
+    'mjs',
+    'cjs',
+    'jsx',
+    'ts',
+    'tsx',
+    'json'
+  ],
+
+  // A map from regular expressions to module names or to arrays of module names that allow to stub out resources with a single module
+  'moduleNameMapper': {
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': '<rootDir>/test/__mocks__/fileMock.ts',
+    '\\.(css|less)$': '<rootDir>/test/__mocks__/styleMock.ts'
+  },
+
+  // An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader
+  // modulePathIgnorePatterns: [],
+
+  // Activates notifications for test results
+  // notify: false,
+
+  // An enum that specifies notification mode. Requires { notify: true }
+  // notifyMode: "failure-change",
+
+  // A preset that is used as a base for Jest's configuration
+  preset: 'ts-jest',
+
+  // Run tests from one or more projects
+  // projects: undefined,
+
+  // Use this configuration option to add custom reporters to Jest
+  // reporters: undefined,
+
+  // Automatically reset mock state before every test
+  // resetMocks: false,
+
+  // Reset the module registry before running each individual test
+  // resetModules: false,
+
+  // A path to a custom resolver
+  // resolver: undefined,
+
+  // Automatically restore mock state and implementation before every test
+  // restoreMocks: false,
+
+  // The root directory that Jest should scan for tests and modules within
+  // rootDir: undefined,
+
+  // A list of paths to directories that Jest should use to search for files in
+  // roots: [
+  //   "<rootDir>"
+  // ],
+
+  // Allows you to use a custom runner instead of Jest's default test runner
+  // runner: "jest-runner",
+
+  // The paths to modules that run some code to configure or set up the testing environment before each test
+  // setupFiles: [],
+
+  // A list of paths to modules that run some code to configure or set up the testing framework before each test
+  setupFilesAfterEnv: ['<rootDir>/test/jest.setup.ts'],
+
+  // The number of seconds after which a test is considered as slow and reported as such in the results.
+  // slowTestThreshold: 5,
+
+  // A list of paths to snapshot serializer modules Jest should use for snapshot testing
+  // snapshotSerializers: [],
+
+  // The test environment that will be used for testing
+  testEnvironment: 'jsdom',
+
+  // Options that will be passed to the testEnvironment
+  // testEnvironmentOptions: {},
+
+  // Adds a location field to test results
+  // testLocationInResults: false,
+
+  // The glob patterns Jest uses to detect test files
+  testMatch: [
+    '**/__tests__/**/*.[jt]s?(x)'
+  ],
+
+  // An array of regexp pattern strings that are matched against all test paths, matched tests are skipped
+  // testPathIgnorePatterns: [
+  //   "/node_modules/"
+  // ],
+
+  // The regexp pattern or array of patterns that Jest uses to detect test files
+  // testRegex: [],
+
+  // This option allows the use of a custom results processor
+  // testResultsProcessor: undefined,
+
+  // This option allows use of a custom test runner
+  // testRunner: "jest-circus/runner",
+
+  // A map from regular expressions to paths to transformers
+  transform: {
+    '^.+\\.tsx?$': [
+      'ts-jest',
+      {
+        tsconfig: 'src/view/tsconfig.spec.json',
+      },
+    ],
+    'node_modules': [
+      'babel-jest',
+      {
+        presets: [
+          '@babel/preset-env'
+        ],
+        plugins: [
+          '@babel/plugin-transform-modules-commonjs',
+        ]
+      }
+    ]
+  },
+
+  // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
+  'transformIgnorePatterns': [
+    // These use ES modules, so need to be transformed
+    'node_modules/(?!(?:@vscode/webview-ui-toolkit|@microsoft/.+|exenv-es6)/.*)'
+  ],
+
+  // An array of regexp pattern strings that are matched against all modules before the module loader will automatically return a mock for them
+  // unmockedModulePathPatterns: undefined,
+
+  // Indicates whether each individual test should be reported during the run
+  // verbose: undefined,
+
+  // An array of regexp patterns that are matched against all source file paths before re-running tests in watch mode
+  // watchPathIgnorePatterns: [],
+
+  // Whether to use watchman for file crawling
+  // watchman: true,
+};

extensions/ql-vscode/media/dark/github.svg

@@ -0,0 +1,4 @@
+<!-- From https://github.com/microsoft/vscode-icons -->
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.97553 0C3.57186 0 0 3.57186 0 7.97553C0 11.4985 2.29969 14.4832 5.43119 15.5596C5.82263 15.6086 5.96942 15.3639 5.96942 15.1682C5.96942 14.9725 5.96942 14.4832 5.96942 13.7982C3.76758 14.2875 3.27829 12.7217 3.27829 12.7217C2.93578 11.792 2.39755 11.5474 2.39755 11.5474C1.66361 11.0581 2.44648 11.0581 2.44648 11.0581C3.22936 11.107 3.66972 11.8899 3.66972 11.8899C4.40367 13.1131 5.52905 12.7706 5.96942 12.5749C6.01835 12.0367 6.263 11.6942 6.45872 11.4985C4.69725 11.3028 2.83792 10.6177 2.83792 7.53517C2.83792 6.65443 3.1315 5.96942 3.66972 5.38226C3.62079 5.23547 3.32722 4.40367 3.76758 3.32722C3.76758 3.32722 4.4526 3.1315 5.96942 4.15902C6.6055 3.9633 7.29052 3.91437 7.97553 3.91437C8.66055 3.91437 9.34557 4.01223 9.98165 4.15902C11.4985 3.1315 12.1835 3.32722 12.1835 3.32722C12.6239 4.40367 12.3303 5.23547 12.2813 5.43119C12.7706 5.96942 13.1131 6.70336 13.1131 7.5841C13.1131 10.6667 11.2538 11.3028 9.49235 11.4985C9.78593 11.7431 10.0306 12.2324 10.0306 12.9664C10.0306 14.0428 10.0306 14.8746 10.0306 15.1682C10.0306 15.3639 10.1774 15.6086 10.5688 15.5596C13.7492 14.4832 16 11.4985 16 7.97553C15.9511 3.57186 12.3792 0 7.97553 0Z" fill="#C5C5C5"/>
+</svg>

extensions/ql-vscode/media/drive.svg

@@ -0,0 +1,7 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.5 12.1952C15.5 12.9126 14.9137 13.4996 14.1957 13.4996H1.80435C1.08696 13.4996 0.5 12.9126 0.5 12.1952L0.5 9.80435C0.5 9.08696 1.08696 8.5 1.80435 8.5H14.1956C14.9137 8.5 15.5 9.08696 15.5 9.80435L15.5 12.1952Z" stroke="#959DA5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M2.45654 11.5H13.5435" stroke="#959DA5" stroke-linecap="round" stroke-linejoin="round"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.5 9.5C13.224 9.5 13 9.725 13 10C13 10.275 13.224 10.5 13.5 10.5C13.776 10.5 14 10.275 14 10C14 9.725 13.776 9.5 13.5 9.5" fill="#959DA5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5 9.5C11.224 9.5 11 9.725 11 10C11 10.275 11.224 10.5 11.5 10.5C11.776 10.5 12 10.275 12 10C12 9.725 11.776 9.5 11.5 9.5" fill="#959DA5"/>
+<path d="M15.5 9.81464L13.8728 2.76261C13.6922 2.06804 12.9572 1.5 12.2391 1.5H3.76087C3.04348 1.5 2.30848 2.06804 2.12783 2.76261L0.5 9.8" stroke="#959DA5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

extensions/ql-vscode/media/globe.svg

@@ -0,0 +1,16 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="7.5" cy="7.5" r="7" stroke="#959DA5"/>
+<mask id="mask0_394_2982" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="15" height="15">
+<circle cx="7.5" cy="7.5" r="7.5" fill="#C4C4C4"/>
+</mask>
+<g mask="url(#mask0_394_2982)">
+<path d="M14.5 7.5C14.5 9.42971 13.6822 11.1907 12.5493 12.4721C11.4035 13.7683 10.0054 14.5 8.90625 14.5C7.84644 14.5 6.81131 13.8113 6.01569 12.5383C5.22447 11.2724 4.71875 9.49235 4.71875 7.5C4.71875 5.50765 5.22447 3.72765 6.01569 2.4617C6.81131 1.1887 7.84644 0.5 8.90625 0.5C10.0054 0.5 11.4035 1.23172 12.5493 2.52786C13.6822 3.80934 14.5 5.57029 14.5 7.5Z" stroke="#959DA5"/>
+</g>
+<mask id="mask1_394_2982" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="1" y="0" width="16" height="15">
+<circle cx="9.375" cy="7.5" r="7.5" fill="#C4C4C4"/>
+</mask>
+<g mask="url(#mask1_394_2982)">
+<path d="M10.2812 7.5C10.2812 9.49235 9.77553 11.2724 8.98431 12.5383C8.18869 13.8113 7.15356 14.5 6.09375 14.5C4.99456 14.5 3.5965 13.7683 2.45067 12.4721C1.31781 11.1907 0.5 9.42971 0.5 7.5C0.5 5.57029 1.31781 3.80934 2.45067 2.52786C3.5965 1.23172 4.99456 0.5 6.09375 0.5C7.15356 0.5 8.18869 1.1887 8.98431 2.4617C9.77553 3.72765 10.2812 5.50765 10.2812 7.5Z" stroke="#959DA5"/>
+</g>
+<line y1="7.5" x2="15" y2="7.5" stroke="#959DA5"/>
+</svg>

extensions/ql-vscode/media/light/github.svg

@@ -0,0 +1,11 @@
+<!-- From https://github.com/microsoft/vscode-icons -->
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.97578 0C3.57211 0 0.000244141 3.57186 0.000244141 7.97553C0.000244141 11.4985 2.29994 14.4832 5.43144 15.5596C5.82287 15.6086 5.96966 15.3639 5.96966 15.1682C5.96966 14.9725 5.96966 14.4832 5.96966 13.7982C3.76783 14.2875 3.27853 12.7217 3.27853 12.7217C2.93602 11.792 2.3978 11.5474 2.3978 11.5474C1.66385 11.0581 2.44673 11.0581 2.44673 11.0581C3.2296 11.107 3.66997 11.8899 3.66997 11.8899C4.40391 13.1131 5.5293 12.7706 5.96966 12.5749C6.01859 12.0367 6.26324 11.6942 6.45896 11.4985C4.69749 11.3028 2.83816 10.6177 2.83816 7.53517C2.83816 6.65443 3.13174 5.96942 3.66997 5.38226C3.62104 5.23547 3.32746 4.40367 3.76783 3.32722C3.76783 3.32722 4.45284 3.1315 5.96966 4.15902C6.60575 3.9633 7.29076 3.91437 7.97578 3.91437C8.66079 3.91437 9.34581 4.01223 9.98189 4.15902C11.4987 3.1315 12.1837 3.32722 12.1837 3.32722C12.6241 4.40367 12.3305 5.23547 12.2816 5.43119C12.7709 5.96942 13.1134 6.70336 13.1134 7.5841C13.1134 10.6667 11.2541 11.3028 9.4926 11.4985C9.78618 11.7431 10.0308 12.2324 10.0308 12.9664C10.0308 14.0428 10.0308 14.8746 10.0308 15.1682C10.0308 15.3639 10.1776 15.6086 10.5691 15.5596C13.7495 14.4832 16.0002 11.4985 16.0002 7.97553C15.9513 3.57186 12.3794 0 7.97578 0Z" fill="#424242"/>
+</g>
+<defs>
+<clipPath id="clip0">
+<rect width="16" height="16" fill="white" transform="translate(0.000244141)"/>
+</clipPath>
+</defs>
+</svg>

extensions/ql-vscode/package.json

@@ -4,7 +4,7 @@
   "description": "CodeQL for Visual Studio Code",
   "author": "GitHub",
   "private": true,
-  "version": "1.5.8",
+  "version": "1.7.6",
   "publisher": "GitHub",
   "license": "MIT",
   "icon": "media/VS-marketplace-CodeQL-icon.png",
@@ -13,7 +13,9 @@
     "url": "https://github.com/github/vscode-codeql"
   },
   "engines": {
-    "vscode": "^1.57.0"
+    "vscode": "^1.59.0",
+    "node": "^16.13.0",
+    "npm": ">=7.20.6"
   },
   "categories": [
     "Programming Languages"
@@ -33,29 +35,36 @@
   },
   "activationEvents": [
     "onLanguage:ql",
+    "onLanguage:ql-summary",
     "onView:codeQLDatabases",
+    "onView:codeQLDatabasesExperimental",
     "onView:codeQLQueryHistory",
     "onView:codeQLAstViewer",
+    "onView:codeQLEvalLogViewer",
     "onView:test-explorer",
     "onCommand:codeQL.checkForUpdatesToCLI",
     "onCommand:codeQL.authenticateToGitHub",
     "onCommand:codeQLDatabases.chooseDatabaseFolder",
     "onCommand:codeQLDatabases.chooseDatabaseArchive",
     "onCommand:codeQLDatabases.chooseDatabaseInternet",
+    "onCommand:codeQLDatabases.chooseDatabaseGithub",
     "onCommand:codeQLDatabases.chooseDatabaseLgtm",
     "onCommand:codeQL.setCurrentDatabase",
     "onCommand:codeQL.viewAst",
+    "onCommand:codeQL.viewCfg",
     "onCommand:codeQL.openReferencedFile",
     "onCommand:codeQL.previewQueryHelp",
     "onCommand:codeQL.chooseDatabaseFolder",
     "onCommand:codeQL.chooseDatabaseArchive",
     "onCommand:codeQL.chooseDatabaseInternet",
+    "onCommand:codeQL.chooseDatabaseGithub",
     "onCommand:codeQL.chooseDatabaseLgtm",
     "onCommand:codeQLDatabases.chooseDatabase",
     "onCommand:codeQLDatabases.setCurrentDatabase",
     "onCommand:codeQL.quickQuery",
     "onCommand:codeQL.restartQueryServer",
     "onWebviewPanel:resultsView",
+    "onWebviewPanel:codeQL.variantAnalysis",
     "onFileSystem:codeql-zip-archive"
   ],
   "main": "./out/extension",
@@ -75,6 +84,12 @@
         "editor.wordBasedSuggestions": false
       }
     },
+    "jsonValidation": [
+      {
+        "fileMatch": "workspace-databases.json",
+        "url": "./workspace-databases-schema.json"
+      }
+    ],
     "languages": [
       {
         "id": "ql",
@@ -105,6 +120,12 @@
         "extensions": [
           ".qhelp"
         ]
+      },
+      {
+        "id": "ql-summary",
+        "filenames": [
+          "evaluator-log.summary"
+        ]
       }
     ],
     "grammars": [
@@ -130,7 +151,7 @@
       "title": "CodeQL",
       "properties": {
         "codeQL.cli.executablePath": {
-          "scope": "window",
+          "scope": "machine-overridable",
           "type": "string",
           "default": "",
           "markdownDescription": "Path to the CodeQL executable that should be used by the CodeQL extension. The executable is named `codeql` on Linux/Mac and `codeql.exe` on Windows. If empty, the extension will look for a CodeQL executable on your shell PATH, or if CodeQL is not on your PATH, download and manage its own CodeQL executable."
@@ -204,7 +225,13 @@
             null
           ],
           "default": null,
-          "description": "Path to a directory where the CodeQL extension should store query server logs. If empty, the extension stores logs in a temporary workspace folder and deletes the contents after each run."
+          "description": "Path to a directory where the CodeQL extension should store query server logs. If empty, the extension stores logs in a temporary workspace folder and deletes the contents after each run.",
+          "markdownDeprecationMessage": "This property is deprecated and no longer has any effect. All query logs are stored in the query history folder next to the query results."
+        },
+        "codeQL.runningQueries.quickEvalCodelens": {
+          "type": "boolean",
+          "default": true,
+          "description": "Enable the 'Quick Evaluation' CodeLens."
         },
         "codeQL.resultsDisplay.pageSize": {
           "type": "integer",
@@ -213,9 +240,15 @@
         },
         "codeQL.queryHistory.format": {
           "type": "string",
-          "default": "%q on %d - %s, %r result count [%t]",
+          "default": "%q on %d - %s %r [%t]",
           "markdownDescription": "Default string for how to label query history items.\n* %t is the time of the query\n* %q is the human-readable query name\n* %f is the query file name\n* %d is the database name\n* %r is the number of results\n* %s is a status string"
         },
+        "codeQL.queryHistory.ttl": {
+          "type": "number",
+          "default": 30,
+          "description": "Number of days to retain queries in the query history before being automatically deleted.",
+          "scope": "machine"
+        },
         "codeQL.runningTests.additionalTestArguments": {
           "scope": "window",
           "type": "array",
@@ -242,7 +275,7 @@
           "scope": "application",
           "description": "Specifies whether or not to write telemetry events to the extension log."
         },
-        "codeQL.remoteQueries.repositoryLists": {
+        "codeQL.variantAnalysis.repositoryLists": {
           "type": [
             "object",
             null
@@ -256,14 +289,21 @@
             }
           },
           "default": null,
-          "markdownDescription": "[For internal use only] Lists of GitHub repositories that you want to query remotely. This should be a JSON object where each key is a user-specified name for this repository list, and the value is an array of GitHub repositories (of the form `<owner>/<repo>`)."
+          "markdownDescription": "[For internal use only] Lists of GitHub repositories that you want to run variant analysis against. This should be a JSON object where each key is a user-specified name for this repository list, and the value is an array of GitHub repositories (of the form `<owner>/<repo>`)."
         },
-        "codeQL.remoteQueries.controllerRepo": {
+        "codeQL.variantAnalysis.controllerRepo": {
           "type": "string",
           "default": "",
           "pattern": "^$|^(?:[a-zA-Z0-9]+-)*[a-zA-Z0-9]+/[a-zA-Z0-9-_]+$",
           "patternErrorMessage": "Please enter a valid GitHub repository",
-          "markdownDescription": "[For internal use only] The name of the GitHub repository where you can view the progress and results of the \"Run Remote query\" command. The repository should be of the form `<owner>/<repo>`)."
+          "markdownDescription": "[For internal use only] The name of the GitHub repository in which the GitHub Actions workflow is run when using the \"Run Variant Analysis\" command. The repository should be of the form `<owner>/<repo>`)."
+        },
+        "codeQL.logInsights.joinOrderWarningThreshold": {
+          "type": "number",
+          "default": 50,
+          "scope": "window",
+          "minimum": 0,
+          "description": "Report a warning for any join order whose metric exceeds this value."
         }
       }
     },
@@ -281,8 +321,12 @@
         "title": "CodeQL: Run Query on Multiple Databases"
       },
       {
-        "command": "codeQL.runRemoteQuery",
-        "title": "CodeQL: Run Remote Query"
+        "command": "codeQL.runVariantAnalysis",
+        "title": "CodeQL: Run Variant Analysis"
+      },
+      {
+        "command": "codeQL.exportSelectedVariantAnalysisResults",
+        "title": "CodeQL: Export Variant Analysis Results"
       },
       {
         "command": "codeQL.runQueries",
@@ -312,6 +356,14 @@
         "command": "codeQL.copyVersion",
         "title": "CodeQL: Copy Version Information"
       },
+      {
+        "command": "codeQLDatabasesExperimental.openConfigFile",
+        "title": "Open Database Configuration File",
+        "icon": {
+          "light": "media/light/edit.svg",
+          "dark": "media/dark/edit.svg"
+        }
+      },
       {
         "command": "codeQLDatabases.chooseDatabaseFolder",
         "title": "Choose Database from Folder",
@@ -340,6 +392,14 @@
           "dark": "media/dark/cloud-download.svg"
         }
       },
+      {
+        "command": "codeQLDatabases.chooseDatabaseGithub",
+        "title": "Download Database from GitHub",
+        "icon": {
+          "light": "media/light/github.svg",
+          "dark": "media/dark/github.svg"
+        }
+      },
       {
         "command": "codeQLDatabases.chooseDatabaseLgtm",
         "title": "Download from LGTM",
@@ -356,6 +416,10 @@
         "command": "codeQL.viewAst",
         "title": "CodeQL: View AST"
       },
+      {
+        "command": "codeQL.viewCfg",
+        "title": "CodeQL: View CFG"
+      },
       {
         "command": "codeQL.upgradeCurrentDatabase",
         "title": "CodeQL: Upgrade Current Database"
@@ -364,6 +428,14 @@
         "command": "codeQL.clearCache",
         "title": "CodeQL: Clear Cache"
       },
+      {
+        "command": "codeQL.installPackDependencies",
+        "title": "CodeQL: Install Pack Dependencies"
+      },
+      {
+        "command": "codeQL.downloadPacks",
+        "title": "CodeQL: Download Packs"
+      },
       {
         "command": "codeQLDatabases.setCurrentDatabase",
         "title": "Set Current Database"
@@ -400,6 +472,10 @@
         "command": "codeQL.chooseDatabaseInternet",
         "title": "CodeQL: Download Database"
       },
+      {
+        "command": "codeQL.chooseDatabaseGithub",
+        "title": "CodeQL: Download Database from GitHub"
+      },
       {
         "command": "codeQL.chooseDatabaseLgtm",
         "title": "CodeQL: Download Database from LGTM"
@@ -426,7 +502,7 @@
       },
       {
         "command": "codeQLQueryHistory.openQuery",
-        "title": "Open the query that produced these results",
+        "title": "Open the Query that Produced these Results",
         "icon": {
           "light": "media/light/edit.svg",
           "dark": "media/dark/edit.svg"
@@ -476,10 +552,34 @@
         "command": "codeQLQueryHistory.showQueryLog",
         "title": "Show Query Log"
       },
+      {
+        "command": "codeQLQueryHistory.openQueryDirectory",
+        "title": "Open Query Directory"
+      },
+      {
+        "command": "codeQLQueryHistory.showEvalLog",
+        "title": "Show Evaluator Log (Raw JSON)"
+      },
+      {
+        "command": "codeQLQueryHistory.showEvalLogSummary",
+        "title": "Show Evaluator Log (Summary Text)"
+      },
+      {
+        "command": "codeQLQueryHistory.showEvalLogViewer",
+        "title": "Show Evaluator Log (UI)"
+      },
+      {
+        "command": "codeQLQueryHistory.cancel",
+        "title": "Cancel"
+      },
       {
         "command": "codeQLQueryHistory.showQueryText",
         "title": "Show Query Text"
       },
+      {
+        "command": "codeQLQueryHistory.exportResults",
+        "title": "Export Results"
+      },
       {
         "command": "codeQLQueryHistory.viewCsvResults",
         "title": "View Results (CSV)"
@@ -505,12 +605,28 @@
         "title": "Compare Results"
       },
       {
-        "command": "codeQLQueryResults.nextPathStep",
-        "title": "CodeQL: Show Next Step on Path"
+        "command": "codeQLQueryHistory.openOnGithub",
+        "title": "Open Variant Analysis on GitHub"
       },
       {
-        "command": "codeQLQueryResults.previousPathStep",
-        "title": "CodeQL: Show Previous Step on Path"
+        "command": "codeQLQueryHistory.copyRepoList",
+        "title": "Copy Repository List"
+      },
+      {
+        "command": "codeQLQueryResults.down",
+        "title": "CodeQL: Navigate Down in Local Result Viewer"
+      },
+      {
+        "command": "codeQLQueryResults.up",
+        "title": "CodeQL: Navigate Up in Local Result Viewer"
+      },
+      {
+        "command": "codeQLQueryResults.right",
+        "title": "CodeQL: Navigate Right in Local Result Viewer"
+      },
+      {
+        "command": "codeQLQueryResults.left",
+        "title": "CodeQL: Navigate Left in Local Result Viewer"
       },
       {
         "command": "codeQL.restartQueryServer",
@@ -535,6 +651,39 @@
           "light": "media/light/clear-all.svg",
           "dark": "media/dark/clear-all.svg"
         }
+      },
+      {
+        "command": "codeQLEvalLogViewer.clear",
+        "title": "Clear Viewer",
+        "icon": {
+          "light": "media/light/clear-all.svg",
+          "dark": "media/dark/clear-all.svg"
+        }
+      },
+      {
+        "command": "codeQL.gotoQL",
+        "title": "CodeQL: Go to QL Code",
+        "enablement": "codeql.hasQLSource"
+      },
+      {
+        "command": "codeQL.mockGitHubApiServer.startRecording",
+        "title": "CodeQL: Mock GitHub API Server: Start Scenario Recording"
+      },
+      {
+        "command": "codeQL.mockGitHubApiServer.saveScenario",
+        "title": "CodeQL: Mock GitHub API Server: Save Scenario"
+      },
+      {
+        "command": "codeQL.mockGitHubApiServer.cancelRecording",
+        "title": "CodeQL: Mock GitHub API Server: Cancel Scenario Recording"
+      },
+      {
+        "command": "codeQL.mockGitHubApiServer.loadScenario",
+        "title": "CodeQL: Mock GitHub API Server: Load Scenario"
+      },
+      {
+        "command": "codeQL.mockGitHubApiServer.unloadScenario",
+        "title": "CodeQL: Mock GitHub API Server: Unload Scenario"
       }
     ],
     "menus": {
@@ -565,10 +714,15 @@
           "group": "navigation"
         },
         {
-          "command": "codeQLDatabases.chooseDatabaseLgtm",
+          "command": "codeQLDatabases.chooseDatabaseGithub",
           "when": "view == codeQLDatabases",
           "group": "navigation"
         },
+        {
+          "command": "codeQLDatabases.chooseDatabaseLgtm",
+          "when": "config.codeQL.canary && view == codeQLDatabases",
+          "group": "navigation"
+        },
         {
           "command": "codeQLQueryHistory.openQuery",
           "when": "view == codeQLQueryHistory",
@@ -603,6 +757,16 @@
           "command": "codeQLAstViewer.clear",
           "when": "view == codeQLAstViewer",
           "group": "navigation"
+        },
+        {
+          "command": "codeQLEvalLogViewer.clear",
+          "when": "view == codeQLEvalLogViewer",
+          "group": "navigation"
+        },
+        {
+          "command": "codeQLDatabasesExperimental.openConfigFile",
+          "when": "view == codeQLDatabasesExperimental",
+          "group": "navigation"
         }
       ],
       "view/item/context": [
@@ -616,11 +780,6 @@
           "group": "9_qlCommands",
           "when": "view == codeQLDatabases"
         },
-        {
-          "command": "codeQLDatabases.upgradeDatabase",
-          "group": "9_qlCommands",
-          "when": "view == codeQLDatabases"
-        },
         {
           "command": "codeQLDatabases.renameDatabase",
           "group": "9_qlCommands",
@@ -644,7 +803,7 @@
         {
           "command": "codeQLQueryHistory.removeHistoryItem",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory"
+          "when": "viewItem == interpretedResultsItem || viewItem == rawResultsItem || viewItem == remoteResultsItem || viewItem == cancelledResultsItem || viewItem == cancelledRemoteResultsItem"
         },
         {
           "command": "codeQLQueryHistory.setLabel",
@@ -654,52 +813,87 @@
         {
           "command": "codeQLQueryHistory.compareWith",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory"
+          "when": "viewItem == rawResultsItem || viewItem == interpretedResultsItem"
         },
         {
           "command": "codeQLQueryHistory.showQueryLog",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory"
+          "when": "viewItem == rawResultsItem || viewItem == interpretedResultsItem"
+        },
+        {
+          "command": "codeQLQueryHistory.openQueryDirectory",
+          "group": "9_qlCommands",
+          "when": "view == codeQLQueryHistory && !hasRemoteServer"
+        },
+        {
+          "command": "codeQLQueryHistory.showEvalLog",
+          "group": "9_qlCommands",
+          "when": "codeql.supportsEvalLog && viewItem == rawResultsItem || codeql.supportsEvalLog && viewItem == interpretedResultsItem || codeql.supportsEvalLog && viewItem == cancelledResultsItem"
+        },
+        {
+          "command": "codeQLQueryHistory.showEvalLogSummary",
+          "group": "9_qlCommands",
+          "when": "codeql.supportsEvalLog && viewItem == rawResultsItem || codeql.supportsEvalLog && viewItem == interpretedResultsItem || codeql.supportsEvalLog && viewItem == cancelledResultsItem"
+        },
+        {
+          "command": "codeQLQueryHistory.showEvalLogViewer",
+          "group": "9_qlCommands",
+          "when": "config.codeQL.canary && codeql.supportsEvalLog && viewItem == rawResultsItem || config.codeQL.canary && codeql.supportsEvalLog && viewItem == interpretedResultsItem || config.codeQL.canary && codeql.supportsEvalLog && viewItem == cancelledResultsItem"
         },
         {
           "command": "codeQLQueryHistory.showQueryText",
           "group": "9_qlCommands",
           "when": "view == codeQLQueryHistory"
         },
+        {
+          "command": "codeQLQueryHistory.exportResults",
+          "group": "9_qlCommands",
+          "when": "view == codeQLQueryHistory && viewItem == remoteResultsItem"
+        },
         {
           "command": "codeQLQueryHistory.viewCsvResults",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory && viewItem != interpretedResultsItem"
+          "when": "viewItem == rawResultsItem"
         },
         {
           "command": "codeQLQueryHistory.viewCsvAlerts",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory && viewItem == interpretedResultsItem"
+          "when": "viewItem == interpretedResultsItem"
         },
         {
           "command": "codeQLQueryHistory.viewSarifAlerts",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory && viewItem == interpretedResultsItem"
+          "when": "viewItem == interpretedResultsItem"
         },
         {
           "command": "codeQLQueryHistory.viewDil",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory"
+          "when": "viewItem == rawResultsItem || viewItem == interpretedResultsItem"
         },
         {
-          "command": "codeQL.previewQueryHelp",
+          "command": "codeQLQueryHistory.cancel",
           "group": "9_qlCommands",
-          "when": "view == codeQLQueryHistory && resourceScheme == .qhelp && isWorkspaceTrusted"
+          "when": "viewItem == inProgressResultsItem || viewItem == inProgressRemoteResultsItem"
+        },
+        {
+          "command": "codeQLQueryHistory.openOnGithub",
+          "group": "9_qlCommands",
+          "when": "viewItem == remoteResultsItem || viewItem == inProgressRemoteResultsItem || viewItem == cancelledRemoteResultsItem"
+        },
+        {
+          "command": "codeQLQueryHistory.copyRepoList",
+          "group": "9_qlCommands",
+          "when": "viewItem == remoteResultsItem"
         },
         {
           "command": "codeQLTests.showOutputDifferences",
           "group": "qltest@1",
-          "when": "view == test-explorer && viewItem == testWithSource"
+          "when": "viewItem == testWithSource"
         },
         {
           "command": "codeQLTests.acceptOutput",
           "group": "qltest@2",
-          "when": "view == test-explorer && viewItem == testWithSource"
+          "when": "viewItem == testWithSource"
         }
       ],
       "explorer/context": [
@@ -711,7 +905,12 @@
         {
           "command": "codeQL.viewAst",
           "group": "9_qlCommands",
-          "when": "resourceScheme == codeql-zip-archive"
+          "when": "resourceScheme == codeql-zip-archive && !explorerResourceIsFolder && !listMultiSelection"
+        },
+        {
+          "command": "codeQL.viewCfg",
+          "group": "9_qlCommands",
+          "when": "resourceScheme == codeql-zip-archive && config.codeQL.canary"
         },
         {
           "command": "codeQL.runQueries",
@@ -743,9 +942,13 @@
           "when": "resourceLangId == ql && resourceExtname == .ql"
         },
         {
-          "command": "codeQL.runRemoteQuery",
+          "command": "codeQL.runVariantAnalysis",
           "when": "config.codeQL.canary && editorLangId == ql && resourceExtname == .ql"
         },
+        {
+          "command": "codeQL.exportSelectedVariantAnalysisResults",
+          "when": "config.codeQL.canary"
+        },
         {
           "command": "codeQL.runQueries",
           "when": "false"
@@ -770,6 +973,18 @@
           "command": "codeQL.viewAst",
           "when": "resourceScheme == codeql-zip-archive"
         },
+        {
+          "command": "codeQL.viewCfg",
+          "when": "resourceScheme == codeql-zip-archive && config.codeQL.canary"
+        },
+        {
+          "command": "codeQL.chooseDatabaseLgtm",
+          "when": "config.codeQL.canary"
+        },
+        {
+          "command": "codeQLDatabasesExperimental.openConfigFile",
+          "when": "false"
+        },
         {
           "command": "codeQLDatabases.setCurrentDatabase",
           "when": "false"
@@ -814,6 +1029,10 @@
           "command": "codeQLDatabases.chooseDatabaseInternet",
           "when": "false"
         },
+        {
+          "command": "codeQLDatabases.chooseDatabaseGithub",
+          "when": "false"
+        },
         {
           "command": "codeQLDatabases.chooseDatabaseLgtm",
           "when": "false"
@@ -838,10 +1057,42 @@
           "command": "codeQLQueryHistory.showQueryLog",
           "when": "false"
         },
+        {
+          "command": "codeQLQueryHistory.showEvalLog",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.showEvalLogSummary",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.showEvalLogViewer",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.openQueryDirectory",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.cancel",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.openOnGithub",
+          "when": "false"
+        },
+        {
+          "command": "codeQLQueryHistory.copyRepoList",
+          "when": "false"
+        },
         {
           "command": "codeQLQueryHistory.showQueryText",
           "when": "false"
         },
+        {
+          "command": "codeQLQueryHistory.exportResults",
+          "when": "false"
+        },
         {
           "command": "codeQLQueryHistory.viewCsvResults",
           "when": "false"
@@ -886,6 +1137,10 @@
           "command": "codeQLAstViewer.clear",
           "when": "false"
         },
+        {
+          "command": "codeQLEvalLogViewer.clear",
+          "when": "false"
+        },
         {
           "command": "codeQLTests.acceptOutput",
           "when": "false"
@@ -893,6 +1148,26 @@
         {
           "command": "codeQLTests.showOutputDifferences",
           "when": "false"
+        },
+        {
+          "command": "codeQL.mockGitHubApiServer.startRecording",
+          "when": "config.codeQL.mockGitHubApiServer.enabled && !codeQL.mockGitHubApiServer.recording"
+        },
+        {
+          "command": "codeQL.mockGitHubApiServer.saveScenario",
+          "when": "config.codeQL.mockGitHubApiServer.enabled && codeQL.mockGitHubApiServer.recording"
+        },
+        {
+          "command": "codeQL.mockGitHubApiServer.cancelRecording",
+          "when": "config.codeQL.mockGitHubApiServer.enabled && codeQL.mockGitHubApiServer.recording"
+        },
+        {
+          "command": "codeQL.mockGitHubApiServer.loadScenario",
+          "when": "config.codeQL.mockGitHubApiServer.enabled && !codeQL.mockGitHubApiServer.recording"
+        },
+        {
+          "command": "codeQL.mockGitHubApiServer.unloadScenario",
+          "when": "config.codeQL.mockGitHubApiServer.enabled && codeQL.mockGitHubApiServer.scenarioLoaded"
         }
       ],
       "editor/context": [
@@ -905,13 +1180,17 @@
           "when": "editorLangId == ql && resourceExtname == .ql"
         },
         {
-          "command": "codeQL.runRemoteQuery",
+          "command": "codeQL.runVariantAnalysis",
           "when": "config.codeQL.canary && editorLangId == ql && resourceExtname == .ql"
         },
         {
           "command": "codeQL.viewAst",
           "when": "resourceScheme == codeql-zip-archive"
         },
+        {
+          "command": "codeQL.viewCfg",
+          "when": "resourceScheme == codeql-zip-archive && config.codeQL.canary"
+        },
         {
           "command": "codeQL.quickEval",
           "when": "editorLangId == ql"
@@ -923,6 +1202,10 @@
         {
           "command": "codeQL.previewQueryHelp",
           "when": "resourceExtname == .qhelp && isWorkspaceTrusted"
+        },
+        {
+          "command": "codeQL.gotoQL",
+          "when": "editorLangId == ql-summary && config.codeQL.canary"
         }
       ]
     },
@@ -941,6 +1224,11 @@
           "id": "codeQLDatabases",
           "name": "Databases"
         },
+        {
+          "id": "codeQLDatabasesExperimental",
+          "name": "Databases",
+          "when": "config.codeQL.canary && config.codeQL.newQueryRunExperience"
+        },
         {
           "id": "codeQLQueryHistory",
           "name": "Query History"
@@ -948,6 +1236,11 @@
         {
           "id": "codeQLAstViewer",
           "name": "AST Viewer"
+        },
+        {
+          "id": "codeQLEvalLogViewer",
+          "name": "Evaluator Log Viewer",
+          "when": "config.codeQL.canary"
         }
       ]
     },
@@ -962,7 +1255,11 @@
       },
       {
         "view": "codeQLDatabases",
-        "contents": "Add a CodeQL database:\n[From a folder](command:codeQLDatabases.chooseDatabaseFolder)\n[From an archive](command:codeQLDatabases.chooseDatabaseArchive)\n[From a URL (as a zip file)](command:codeQLDatabases.chooseDatabaseInternet)\n[From LGTM](command:codeQLDatabases.chooseDatabaseLgtm)"
+        "contents": "Add a CodeQL database:\n[From a folder](command:codeQLDatabases.chooseDatabaseFolder)\n[From an archive](command:codeQLDatabases.chooseDatabaseArchive)\n[From a URL (as a zip file)](command:codeQLDatabases.chooseDatabaseInternet)\n[From GitHub](command:codeQLDatabases.chooseDatabaseGithub)"
+      },
+      {
+        "view": "codeQLEvalLogViewer",
+        "contents": "Run the 'Show Evaluator Log (UI)' command on a CodeQL query run in the Query History view."
       }
     ]
   },
@@ -970,31 +1267,55 @@
     "build": "gulp",
     "watch": "npm-run-all -p watch:*",
     "watch:extension": "tsc --watch",
-    "test": "mocha --exit -r ts-node/register test/pure-tests/**/*.ts",
-    "preintegration": "rm -rf ./out/vscode-tests && gulp",
+    "watch:webpack": "gulp watchView",
+    "watch:files": "gulp watchTestData",
+    "test": "npm-run-all -p test:*",
+    "test:unit": "mocha --config .mocharc.json 'test/pure-tests/**/*.ts'",
+    "test:view": "jest",
     "integration": "node ./out/vscode-tests/run-integration-tests.js no-workspace,minimal-workspace",
-    "cli-integration": "npm run preintegration && node ./out/vscode-tests/run-integration-tests.js cli-integration",
+    "integration:no-workspace": "node ./out/vscode-tests/run-integration-tests.js no-workspace",
+    "integration:minimal-workspace": "node ./out/vscode-tests/run-integration-tests.js minimal-workspace",
+    "cli-integration": "node ./out/vscode-tests/run-integration-tests.js cli-integration",
     "update-vscode": "node ./node_modules/vscode/bin/install",
-    "format": "tsfmt -r && eslint src test --ext .ts,.tsx --fix",
-    "lint": "eslint src test --ext .ts,.tsx --max-warnings=0",
-    "format-staged": "lint-staged"
+    "format": "prettier --write **/*.{ts,tsx} && eslint . --ext .ts,.tsx --fix",
+    "lint": "eslint . --ext .ts,.tsx --max-warnings=0",
+    "format-staged": "lint-staged",
+    "storybook": "start-storybook -p 6006",
+    "build-storybook": "build-storybook",
+    "lint:scenarios": "ts-node scripts/lint-scenarios.ts"
   },
   "dependencies": {
-    "@octokit/rest": "^18.5.6",
+    "@octokit/plugin-retry": "^3.0.9",
+    "@octokit/rest": "^19.0.4",
+    "@primer/octicons-react": "^17.6.0",
+    "@primer/react": "^35.0.0",
+    "@vscode/codicons": "^0.0.31",
+    "@vscode/webview-ui-toolkit": "^1.0.1",
+    "ajv": "^8.11.0",
     "child-process-promise": "^2.2.1",
+    "chokidar": "^3.5.3",
     "classnames": "~2.2.6",
-    "fs-extra": "^9.0.1",
-    "glob-promise": "^3.4.0",
-    "js-yaml": "^3.14.0",
-    "minimist": "~1.2.5",
-    "node-fetch": "~2.6.0",
+    "d3": "^7.6.1",
+    "d3-graphviz": "^2.6.1",
+    "fs-extra": "^10.0.1",
+    "glob-promise": "^4.2.2",
+    "immutable": "^4.0.0",
+    "js-yaml": "^4.1.0",
+    "minimist": "~1.2.6",
+    "msw": "^0.47.4",
+    "nanoid": "^3.2.0",
+    "node-fetch": "~2.6.7",
+    "p-queue": "^6.0.0",
     "path-browserify": "^1.0.1",
-    "react": "^16.8.6",
-    "react-dom": "^16.8.6",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "semver": "~7.3.2",
+    "source-map": "^0.7.4",
+    "source-map-support": "^0.5.21",
     "stream": "^0.0.2",
     "stream-chain": "~2.2.4",
     "stream-json": "~1.7.3",
+    "styled-components": "^5.3.3",
     "tmp": "^0.1.0",
     "tmp-promise": "~3.0.2",
     "tree-kill": "~1.2.2",
@@ -1004,91 +1325,124 @@
     "vscode-languageclient": "^6.1.3",
     "vscode-test-adapter-api": "~1.7.0",
     "vscode-test-adapter-util": "~0.7.0",
-    "zip-a-folder": "~0.0.12"
+    "zip-a-folder": "~1.1.3"
   },
   "devDependencies": {
+    "@babel/core": "^7.18.13",
+    "@babel/plugin-transform-modules-commonjs": "^7.18.6",
+    "@faker-js/faker": "^7.5.0",
+    "@octokit/plugin-throttling": "^4.3.2",
+    "@storybook/addon-actions": "^6.5.10",
+    "@storybook/addon-essentials": "^6.5.10",
+    "@storybook/addon-interactions": "^6.5.10",
+    "@storybook/addon-links": "^6.5.10",
+    "@storybook/builder-webpack5": "^6.5.10",
+    "@storybook/manager-webpack5": "^6.5.10",
+    "@storybook/react": "^6.5.10",
+    "@storybook/testing-library": "^0.0.13",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^12.1.5",
+    "@testing-library/user-event": "^14.4.3",
     "@types/chai": "^4.1.7",
     "@types/chai-as-promised": "~7.1.2",
     "@types/child-process-promise": "^2.2.1",
     "@types/classnames": "~2.2.9",
+    "@types/d3": "^7.4.0",
+    "@types/d3-graphviz": "^2.6.6",
+    "@types/del": "^4.0.0",
     "@types/fs-extra": "^9.0.6",
     "@types/glob": "^7.1.1",
     "@types/google-protobuf": "^3.2.7",
     "@types/gulp": "^4.0.9",
-    "@types/gulp-replace": "0.0.31",
+    "@types/gulp-replace": "^1.1.0",
     "@types/gulp-sourcemaps": "0.0.32",
+    "@types/jest": "^29.0.2",
     "@types/js-yaml": "^3.12.5",
     "@types/jszip": "~3.1.6",
     "@types/mocha": "^9.0.0",
-    "@types/node": "^12.14.1",
+    "@types/nanoid": "^3.0.0",
+    "@types/node": "^16.11.25",
     "@types/node-fetch": "~2.5.2",
     "@types/proxyquire": "~1.3.28",
-    "@types/react": "^16.8.17",
-    "@types/react-dom": "^16.8.4",
+    "@types/react": "^17.0.2",
+    "@types/react-dom": "^17.0.2",
     "@types/sarif": "~2.1.2",
     "@types/semver": "~7.2.0",
     "@types/sinon": "~7.5.2",
     "@types/sinon-chai": "~3.2.3",
     "@types/stream-chain": "~2.0.1",
     "@types/stream-json": "~1.7.1",
+    "@types/tar-stream": "^2.2.2",
     "@types/through2": "^2.0.36",
     "@types/tmp": "^0.1.0",
     "@types/unzipper": "~0.10.1",
-    "@types/vscode": "^1.57.0",
-    "@types/webpack": "^4.32.1",
+    "@types/vscode": "^1.59.0",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-env": "^1.18.0",
     "@types/xml2js": "~0.4.4",
-    "@typescript-eslint/eslint-plugin": "^4.26.0",
-    "@typescript-eslint/parser": "^4.26.0",
+    "@typescript-eslint/eslint-plugin": "^5.38.0",
+    "@typescript-eslint/parser": "^5.38.0",
+    "@vscode/test-electron": "^2.2.0",
     "ansi-colors": "^4.1.1",
-    "applicationinsights": "^1.8.7",
+    "applicationinsights": "^2.3.5",
+    "babel-loader": "^8.2.5",
     "chai": "^4.2.0",
     "chai-as-promised": "~7.1.1",
     "css-loader": "~3.1.0",
-    "eslint": "~6.8.0",
-    "eslint-plugin-react": "~7.19.0",
+    "del": "^6.0.0",
+    "eslint": "^8.23.1",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-jest-dom": "^4.0.2",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-react": "^7.31.8",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-storybook": "^0.6.4",
+    "file-loader": "^6.2.0",
     "glob": "^7.1.4",
     "gulp": "^4.0.2",
-    "gulp-replace": "^1.0.0",
-    "gulp-sourcemaps": "^2.6.5",
+    "gulp-replace": "^1.1.3",
+    "gulp-sourcemaps": "^3.0.0",
     "gulp-typescript": "^5.0.1",
-    "husky": "~4.2.5",
-    "jsonc-parser": "^2.3.0",
+    "husky": "~4.3.8",
+    "jest": "^29.0.3",
+    "jest-environment-jsdom": "^29.0.3",
     "lint-staged": "~10.2.2",
-    "mocha": "^9.1.3",
+    "mini-css-extract-plugin": "^2.6.1",
+    "mocha": "^10.0.0",
     "mocha-sinon": "~2.1.2",
     "npm-run-all": "^4.1.5",
-    "prettier": "~2.0.5",
+    "prettier": "^2.7.1",
     "proxyquire": "~2.1.3",
-    "sinon": "~9.0.0",
+    "sinon": "~14.0.0",
     "sinon-chai": "~3.5.0",
-    "style-loader": "~0.23.1",
-    "through2": "^3.0.1",
+    "tar-stream": "^2.2.0",
+    "through2": "^4.0.2",
+    "ts-jest": "^29.0.1",
+    "ts-json-schema-generator": "^1.1.2",
     "ts-loader": "^8.1.0",
-    "ts-node": "^8.3.0",
+    "ts-node": "^10.7.0",
     "ts-protoc-gen": "^0.9.0",
-    "typescript": "^4.3.2",
-    "typescript-formatter": "^7.2.2",
-    "vsce": "^1.65.0",
-    "vscode-test": "^1.4.0",
-    "webpack": "^5.28.0",
+    "typescript": "^4.5.5",
+    "vsce": "^2.7.0",
+    "webpack": "^5.62.2",
     "webpack-cli": "^4.6.0"
   },
   "husky": {
     "hooks": {
       "pre-commit": "npm run format-staged",
-      "pre-push": "npm run lint"
+      "pre-push": "npm run lint && scripts/forbid-mocha-only"
     }
   },
   "lint-staged": {
-    "./**/*.{json,css,scss,md}": [
+    "./**/*.{json,css,scss}": [
       "prettier --write"
     ],
     "./**/*.{ts,tsx}": [
-      "tsfmt -r",
+      "prettier --write",
       "eslint --fix"
     ]
   },
   "resolutions": {
-    "glob-parent": "~6.0.0"
+    "glob-parent": "6.0.0"
   }
 }

extensions/ql-vscode/scripts/add-fields-to-scenarios.ts

@@ -0,0 +1,147 @@
+/**
+ * This scripts helps after adding a new field in the GitHub API. You will
+ * need to modify this script to add the new field to the scenarios. This
+ * is just a template and should not be used as-is since it has already been
+ * applied.
+ *
+ * Depending on the actual implementation of the script, you might run into
+ * rate limits. If that happens, you can set a `GITHUB_TOKEN` environment
+ * variable. For example, use: ``export GITHUB_TOKEN=`gh auth token```.
+ *
+ * Usage: npx ts-node scripts/add-fields-to-scenarios.ts
+ */
+
+import * as fs from "fs-extra";
+import * as path from "path";
+
+import { Octokit, type RestEndpointMethodTypes } from "@octokit/rest";
+import { throttling } from "@octokit/plugin-throttling";
+
+import { getFiles } from "./util/files";
+import type { GitHubApiRequest } from "../src/mocks/gh-api-request";
+import { isGetVariantAnalysisRequest } from "../src/mocks/gh-api-request";
+import { VariantAnalysis } from "../src/remote-queries/gh-api/variant-analysis";
+import { RepositoryWithMetadata } from "../src/remote-queries/gh-api/repository";
+
+const extensionDirectory = path.resolve(__dirname, "..");
+const scenariosDirectory = path.resolve(
+  extensionDirectory,
+  "src/mocks/scenarios",
+);
+
+// Make sure we don't run into rate limits by automatically waiting until we can
+// make another request.
+const MyOctokit = Octokit.plugin(throttling);
+
+const auth = process.env.GITHUB_TOKEN;
+
+const octokit = new MyOctokit({
+  auth,
+  throttle: {
+    onRateLimit: (
+      retryAfter: number,
+      options: any,
+      octokit: Octokit,
+    ): boolean => {
+      octokit.log.warn(
+        `Request quota exhausted for request ${options.method} ${options.url}. Retrying after ${retryAfter} seconds!`,
+      );
+
+      return true;
+    },
+    onSecondaryRateLimit: (
+      _retryAfter: number,
+      options: any,
+      octokit: Octokit,
+    ): void => {
+      octokit.log.warn(
+        `SecondaryRateLimit detected for request ${options.method} ${options.url}`,
+      );
+    },
+  },
+});
+const repositories = new Map<
+  number,
+  RestEndpointMethodTypes["repos"]["get"]["response"]["data"]
+>();
+
+async function addFieldsToRepository(repository: RepositoryWithMetadata) {
+  if (!repositories.has(repository.id)) {
+    const [owner, repo] = repository.full_name.split("/");
+
+    const apiRepository = await octokit.repos.get({
+      owner,
+      repo,
+    });
+
+    repositories.set(repository.id, apiRepository.data);
+  }
+
+  const apiRepository = repositories.get(repository.id)!;
+
+  repository.stargazers_count = apiRepository.stargazers_count;
+  repository.updated_at = apiRepository.updated_at;
+}
+
+async function addFieldsToScenarios() {
+  if (!(await fs.pathExists(scenariosDirectory))) {
+    console.error("Scenarios directory does not exist: " + scenariosDirectory);
+    return;
+  }
+
+  for await (const file of getFiles(scenariosDirectory)) {
+    if (!file.endsWith(".json")) {
+      continue;
+    }
+
+    const data: GitHubApiRequest = await fs.readJson(file);
+
+    if (!isGetVariantAnalysisRequest(data)) {
+      continue;
+    }
+
+    if (!data.response.body || !("controller_repo" in data.response.body)) {
+      continue;
+    }
+
+    console.log(
+      `Adding fields to '${path.relative(scenariosDirectory, file)}'`,
+    );
+
+    const variantAnalysis = data.response.body as VariantAnalysis;
+
+    if (variantAnalysis.scanned_repositories) {
+      for (const item of variantAnalysis.scanned_repositories) {
+        await addFieldsToRepository(item.repository);
+      }
+    }
+
+    if (variantAnalysis.skipped_repositories?.access_mismatch_repos) {
+      for (const item of variantAnalysis.skipped_repositories
+        .access_mismatch_repos.repositories) {
+        await addFieldsToRepository(item);
+      }
+    }
+
+    if (variantAnalysis.skipped_repositories?.no_codeql_db_repos) {
+      for (const item of variantAnalysis.skipped_repositories.no_codeql_db_repos
+        .repositories) {
+        await addFieldsToRepository(item);
+      }
+    }
+
+    if (variantAnalysis.skipped_repositories?.over_limit_repos) {
+      for (const item of variantAnalysis.skipped_repositories.over_limit_repos
+        .repositories) {
+        await addFieldsToRepository(item);
+      }
+    }
+
+    await fs.writeJson(file, data, { spaces: 2 });
+  }
+}
+
+addFieldsToScenarios().catch((e) => {
+  console.error(e);
+  process.exit(2);
+});

extensions/ql-vscode/scripts/fix-scenario-file-numbering.ts

@@ -0,0 +1,81 @@
+/**
+ * This scripts helps after recording a scenario to be used for replaying
+ * with the mock GitHub API server.
+ *
+ * Once the scenario has been recorded, it's often useful to remove some of
+ * the requests to speed up the replay, particularly ones that fetch the
+ * variant analysis status. Once some of the requests have manually been
+ * removed, this script can be used to update the numbering of the files.
+ *
+ * Usage: npx ts-node scripts/fix-scenario-file-numbering.ts <scenario-name>
+ */
+
+import * as fs from "fs-extra";
+import * as path from "path";
+
+if (process.argv.length !== 3) {
+  console.error("Expected 1 argument - the scenario name");
+}
+
+const scenarioName = process.argv[2];
+
+const extensionDirectory = path.resolve(__dirname, "..");
+const scenariosDirectory = path.resolve(
+  extensionDirectory,
+  "src/mocks/scenarios",
+);
+const scenarioDirectory = path.resolve(scenariosDirectory, scenarioName);
+
+async function fixScenarioFiles() {
+  console.log(scenarioDirectory);
+  if (!(await fs.pathExists(scenarioDirectory))) {
+    console.error("Scenario directory does not exist: " + scenarioDirectory);
+    return;
+  }
+
+  const files = await fs.readdir(scenarioDirectory);
+
+  const orderedFiles = files.sort((a, b) => {
+    const aNum = parseInt(a.split("-")[0]);
+    const bNum = parseInt(b.split("-")[0]);
+    return aNum - bNum;
+  });
+
+  let index = 0;
+  for (const file of orderedFiles) {
+    const ext = path.extname(file);
+    if (ext === ".json") {
+      const fileName = path.basename(file, ext);
+      const fileCurrentIndex = parseInt(fileName.split("-")[0]);
+      const fileNameWithoutIndex = fileName.split("-")[1];
+      if (fileCurrentIndex !== index) {
+        const newFileName = `${index}-${fileNameWithoutIndex}${ext}`;
+        const oldFilePath = path.join(scenarioDirectory, file);
+        const newFilePath = path.join(scenarioDirectory, newFileName);
+        console.log(`Rename: ${oldFilePath} -> ${newFilePath}`);
+        await fs.rename(oldFilePath, newFilePath);
+
+        if (fileNameWithoutIndex === "getVariantAnalysisRepoResult") {
+          const oldZipFileName = `${fileCurrentIndex}-getVariantAnalysisRepoResult.body.zip`;
+          const newZipFileName = `${index}-getVariantAnalysisRepoResult.body.zip`;
+          const oldZipFilePath = path.join(scenarioDirectory, oldZipFileName);
+          const newZipFilePath = path.join(scenarioDirectory, newZipFileName);
+          console.log(`Rename: ${oldZipFilePath} -> ${newZipFilePath}`);
+          await fs.rename(oldZipFilePath, newZipFilePath);
+
+          const json = await fs.readJson(newFilePath);
+          json.response.body = `file:${newZipFileName}`;
+          console.log(`Response.body change to ${json.response.body}`);
+          await fs.writeJSON(newFilePath, json);
+        }
+      }
+
+      index++;
+    }
+  }
+}
+
+fixScenarioFiles().catch((e) => {
+  console.error(e);
+  process.exit(2);
+});

extensions/ql-vscode/scripts/forbid-mocha-only

@@ -0,0 +1,6 @@
+if grep -rq --include '*.test.ts' 'it.only\|describe.only' './test' './src'; then
+    echo 'There is a .only() in the tests. Please remove it.'
+    exit 1;
+else
+    exit 0;
+fi

extensions/ql-vscode/scripts/lint-scenarios.ts

@@ -0,0 +1,77 @@
+import * as fs from "fs-extra";
+import * as path from "path";
+
+import Ajv from "ajv";
+import * as tsj from "ts-json-schema-generator";
+
+import { getFiles } from "./util/files";
+
+const extensionDirectory = path.resolve(__dirname, "..");
+const rootDirectory = path.resolve(extensionDirectory, "../..");
+const scenariosDirectory = path.resolve(
+  extensionDirectory,
+  "src/mocks/scenarios",
+);
+
+const debug = process.env.RUNNER_DEBUG || process.argv.includes("--debug");
+
+async function lintScenarios() {
+  const schema = tsj
+    .createGenerator({
+      path: path.resolve(extensionDirectory, "src/mocks/gh-api-request.ts"),
+      tsconfig: path.resolve(extensionDirectory, "tsconfig.json"),
+      type: "GitHubApiRequest",
+      skipTypeCheck: true,
+      topRef: true,
+      additionalProperties: true,
+    })
+    .createSchema("GitHubApiRequest");
+
+  const ajv = new Ajv();
+
+  if (!ajv.validateSchema(schema)) {
+    throw new Error("Invalid schema: " + ajv.errorsText());
+  }
+
+  const validate = await ajv.compile(schema);
+
+  let invalidFiles = 0;
+
+  if (!(await fs.pathExists(scenariosDirectory))) {
+    console.error("Scenarios directory does not exist: " + scenariosDirectory);
+    // Do not exit with a non-zero status code, as this is not a fatal error.
+    return;
+  }
+
+  for await (const file of getFiles(scenariosDirectory)) {
+    if (!file.endsWith(".json")) {
+      continue;
+    }
+
+    const contents = await fs.readFile(file, "utf8");
+    const data = JSON.parse(contents);
+
+    if (!validate(data)) {
+      validate.errors?.forEach((error) => {
+        // https://docs.github.com/en/actions/using-workflows/workflow-commands-for-github-actions#setting-an-error-message
+        console.log(
+          `::error file=${path.relative(rootDirectory, file)}::${
+            error.instancePath
+          }: ${error.message}`,
+        );
+      });
+      invalidFiles++;
+    } else if (debug) {
+      console.log(`File '${path.relative(rootDirectory, file)}' is valid`);
+    }
+  }
+
+  if (invalidFiles > 0) {
+    process.exit(1);
+  }
+}
+
+lintScenarios().catch((e) => {
+  console.error(e);
+  process.exit(2);
+});

extensions/ql-vscode/scripts/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "../tsconfig.json",
+  "include": ["**/*.ts"],
+  "exclude": [],
+  "compilerOptions": {
+    "rootDir": "..",
+    "noEmit": true
+  }
+}

extensions/ql-vscode/scripts/util/files.ts

@@ -0,0 +1,15 @@
+import * as fs from "fs-extra";
+import * as path from "path";
+
+// https://stackoverflow.com/a/45130990
+export async function* getFiles(dir: string): AsyncGenerator<string> {
+  const dirents = await fs.readdir(dir, { withFileTypes: true });
+  for (const dirent of dirents) {
+    const res = path.resolve(dir, dirent.name);
+    if (dirent.isDirectory()) {
+      yield* getFiles(res);
+    } else {
+      yield res;
+    }
+  }
+}

extensions/ql-vscode/src/abstract-webview.ts

@@ -0,0 +1,163 @@
+import {
+  WebviewPanel,
+  ExtensionContext,
+  window as Window,
+  ViewColumn,
+  Uri,
+  WebviewPanelOptions,
+  WebviewOptions,
+} from "vscode";
+import * as path from "path";
+
+import { DisposableObject, DisposeHandler } from "./pure/disposable-object";
+import { tmpDir } from "./helpers";
+import {
+  getHtmlForWebview,
+  WebviewMessage,
+  WebviewView,
+} from "./interface-utils";
+
+export type WebviewPanelConfig = {
+  viewId: string;
+  title: string;
+  viewColumn: ViewColumn;
+  view: WebviewView;
+  preserveFocus?: boolean;
+  additionalOptions?: WebviewPanelOptions & WebviewOptions;
+};
+
+export abstract class AbstractWebview<
+  ToMessage extends WebviewMessage,
+  FromMessage extends WebviewMessage,
+> extends DisposableObject {
+  protected panel: WebviewPanel | undefined;
+  protected panelLoaded = false;
+  protected panelLoadedCallBacks: (() => void)[] = [];
+
+  private panelResolves?: Array<(panel: WebviewPanel) => void>;
+
+  constructor(protected readonly ctx: ExtensionContext) {
+    super();
+  }
+
+  public async restoreView(panel: WebviewPanel): Promise<void> {
+    this.panel = panel;
+    const config = await this.getPanelConfig();
+    this.setupPanel(panel, config);
+  }
+
+  protected get isShowingPanel() {
+    return !!this.panel;
+  }
+
+  protected async getPanel(): Promise<WebviewPanel> {
+    if (this.panel == undefined) {
+      const { ctx } = this;
+
+      // This is an async method, so in theory this method can be called concurrently. To ensure that we don't
+      // create two panels, we use a promise that resolves when the panel is created. This way, if the panel is
+      // being created, the promise will resolve when it is done.
+      if (this.panelResolves !== undefined) {
+        return new Promise((resolve) => {
+          if (this.panel !== undefined) {
+            resolve(this.panel);
+            return;
+          }
+
+          this.panelResolves?.push(resolve);
+        });
+      }
+      this.panelResolves = [];
+
+      const config = await this.getPanelConfig();
+
+      const panel = Window.createWebviewPanel(
+        config.viewId,
+        config.title,
+        { viewColumn: config.viewColumn, preserveFocus: config.preserveFocus },
+        {
+          enableScripts: true,
+          enableFindWidget: true,
+          retainContextWhenHidden: true,
+          ...config.additionalOptions,
+          localResourceRoots: [
+            ...(config.additionalOptions?.localResourceRoots ?? []),
+            Uri.file(tmpDir.name),
+            Uri.file(path.join(ctx.extensionPath, "out")),
+          ],
+        },
+      );
+      this.panel = panel;
+
+      this.setupPanel(panel, config);
+
+      this.panelResolves.forEach((resolve) => resolve(panel));
+      this.panelResolves = undefined;
+    }
+    return this.panel;
+  }
+
+  protected setupPanel(panel: WebviewPanel, config: WebviewPanelConfig): void {
+    this.push(
+      panel.onDidDispose(
+        () => {
+          this.panel = undefined;
+          this.panelLoaded = false;
+          this.onPanelDispose();
+        },
+        null,
+        this.ctx.subscriptions,
+      ),
+    );
+
+    panel.webview.html = getHtmlForWebview(
+      this.ctx,
+      panel.webview,
+      config.view,
+      {
+        allowInlineStyles: true,
+      },
+    );
+    this.push(
+      panel.webview.onDidReceiveMessage(
+        async (e) => this.onMessage(e),
+        undefined,
+        this.ctx.subscriptions,
+      ),
+    );
+  }
+
+  protected abstract getPanelConfig():
+    | WebviewPanelConfig
+    | Promise<WebviewPanelConfig>;
+
+  protected abstract onPanelDispose(): void;
+
+  protected abstract onMessage(msg: FromMessage): Promise<void>;
+
+  protected waitForPanelLoaded(): Promise<void> {
+    return new Promise((resolve) => {
+      if (this.panelLoaded) {
+        resolve();
+      } else {
+        this.panelLoadedCallBacks.push(resolve);
+      }
+    });
+  }
+
+  protected onWebViewLoaded(): void {
+    this.panelLoaded = true;
+    this.panelLoadedCallBacks.forEach((cb) => cb());
+    this.panelLoadedCallBacks = [];
+  }
+
+  protected async postMessage(msg: ToMessage): Promise<boolean> {
+    const panel = await this.getPanel();
+    return panel.webview.postMessage(msg);
+  }
+
+  public dispose(disposeHandler?: DisposeHandler) {
+    this.panel?.dispose();
+    super.dispose(disposeHandler);
+  }
+}

extensions/ql-vscode/src/additional-typings.d.ts

@@ -0,0 +1,15 @@
+/**
+ * The d3 library is designed to work in both the browser and
+ * node. Consequently their typings files refer to both node
+ * types like `Buffer` (which don't exist in the browser), and browser
+ * types like `Blob` (which don't exist in node). Instead of sticking
+ * all of `dom` in `compilerOptions.lib`, it suffices just to put in a
+ * stub definition of the affected types so that compilation
+ * succeeds.
+ */
+
+declare type RequestInit = Record<string, unknown>;
+declare type ElementTagNameMap = any;
+declare type NodeListOf<T> = Record<string, T>;
+declare type Node = Record<string, unknown>;
+declare type XMLDocument = Record<string, unknown>;

extensions/ql-vscode/src/archive-filesystem-provider.ts

@@ -1,11 +1,11 @@
-import * as fs from 'fs-extra';
-import * as unzipper from 'unzipper';
-import * as vscode from 'vscode';
-import { logger } from './logging';
+import * as fs from "fs-extra";
+import * as unzipper from "unzipper";
+import * as vscode from "vscode";
+import { logger } from "./logging";
 
 // All path operations in this file must be on paths *within* the zip
 // archive.
-import * as _path from 'path';
+import * as _path from "path";
 const path = _path.posix;
 
 export class File implements vscode.FileStat {
@@ -72,19 +72,20 @@ export function encodeSourceArchiveUri(ref: ZipFileReference): vscode.Uri {
   // Since we will use an authority component, we add a leading slash if necessary
   // (paths on Windows usually start with the drive letter).
   let sourceArchiveZipPathStartIndex: number;
-  if (encodedPath.startsWith('/')) {
+  if (encodedPath.startsWith("/")) {
     sourceArchiveZipPathStartIndex = 0;
   } else {
-    encodedPath = '/' + encodedPath;
+    encodedPath = "/" + encodedPath;
     sourceArchiveZipPathStartIndex = 1;
   }
 
   // The authority component of the URI records the 0-based inclusive start and exclusive end index
   // of the source archive zip path within the path component of the resulting URI.
   // This lets us separate the paths, ignoring the leading slash if we added one.
-  const sourceArchiveZipPathEndIndex = sourceArchiveZipPathStartIndex + sourceArchiveZipPath.length;
+  const sourceArchiveZipPathEndIndex =
+    sourceArchiveZipPathStartIndex + sourceArchiveZipPath.length;
   const authority = `${sourceArchiveZipPathStartIndex}-${sourceArchiveZipPathEndIndex}`;
-  return vscode.Uri.parse(zipArchiveScheme + ':/', true).with({
+  return vscode.Uri.parse(zipArchiveScheme + ":/", true).with({
     path: encodedPath,
     authority,
   });
@@ -99,7 +100,7 @@ export function encodeSourceArchiveUri(ref: ZipFileReference): vscode.Uri {
 export function encodeArchiveBasePath(sourceArchiveZipPath: string) {
   return encodeSourceArchiveUri({
     sourceArchiveZipPath,
-    pathWithinSourceArchive: ''
+    pathWithinSourceArchive: "",
   });
 }
 
@@ -107,7 +108,9 @@ const sourceArchiveUriAuthorityPattern = /^(\d+)-(\d+)$/;
 
 class InvalidSourceArchiveUriError extends Error {
   constructor(uri: vscode.Uri) {
-    super(`Can't decode uri ${uri}: authority should be of the form startIndex-endIndex (where both indices are integers).`);
+    super(
+      `Can't decode uri ${uri}: authority should be of the form startIndex-endIndex (where both indices are integers).`,
+    );
   }
 }
 
@@ -115,22 +118,26 @@ class InvalidSourceArchiveUriError extends Error {
 export function decodeSourceArchiveUri(uri: vscode.Uri): ZipFileReference {
   if (!uri.authority) {
     // Uri is malformed, but this is recoverable
-    void logger.log(`Warning: ${new InvalidSourceArchiveUriError(uri).message}`);
+    void logger.log(
+      `Warning: ${new InvalidSourceArchiveUriError(uri).message}`,
+    );
     return {
-      pathWithinSourceArchive: '/',
-      sourceArchiveZipPath: uri.path
+      pathWithinSourceArchive: "/",
+      sourceArchiveZipPath: uri.path,
     };
   }
   const match = sourceArchiveUriAuthorityPattern.exec(uri.authority);
-  if (match === null)
-    throw new InvalidSourceArchiveUriError(uri);
+  if (match === null) throw new InvalidSourceArchiveUriError(uri);
   const zipPathStartIndex = parseInt(match[1]);
   const zipPathEndIndex = parseInt(match[2]);
   if (isNaN(zipPathStartIndex) || isNaN(zipPathEndIndex))
     throw new InvalidSourceArchiveUriError(uri);
   return {
-    pathWithinSourceArchive: uri.path.substring(zipPathEndIndex) || '/',
-    sourceArchiveZipPath: uri.path.substring(zipPathStartIndex, zipPathEndIndex),
+    pathWithinSourceArchive: uri.path.substring(zipPathEndIndex) || "/",
+    sourceArchiveZipPath: uri.path.substring(
+      zipPathStartIndex,
+      zipPathEndIndex,
+    ),
   };
 }
 
@@ -139,7 +146,7 @@ export function decodeSourceArchiveUri(uri: vscode.Uri): ZipFileReference {
  */
 function ensureFile(map: DirectoryHierarchyMap, file: string) {
   const dirname = path.dirname(file);
-  if (dirname === '.') {
+  if (dirname === ".") {
     const error = `Ill-formed path ${file} in zip archive (expected absolute path)`;
     void logger.log(error);
     throw new Error(error);
@@ -154,8 +161,9 @@ function ensureFile(map: DirectoryHierarchyMap, file: string) {
 function ensureDir(map: DirectoryHierarchyMap, dir: string) {
   const parent = path.dirname(dir);
   if (!map.has(dir)) {
-    map.set(dir, new Map);
-    if (dir !== parent) { // not the root directory
+    map.set(dir, new Map());
+    if (dir !== parent) {
+      // not the root directory
       ensureDir(map, parent);
       map.get(parent)!.set(path.basename(dir), vscode.FileType.Directory);
     }
@@ -167,22 +175,33 @@ type Archive = {
   dirMap: DirectoryHierarchyMap;
 };
 
+async function parse_zip(zipPath: string): Promise<Archive> {
+  if (!(await fs.pathExists(zipPath)))
+    throw vscode.FileSystemError.FileNotFound(zipPath);
+  const archive: Archive = {
+    unzipped: await unzipper.Open.file(zipPath),
+    dirMap: new Map(),
+  };
+  archive.unzipped.files.forEach((f) => {
+    ensureFile(archive.dirMap, path.resolve("/", f.path));
+  });
+  return archive;
+}
+
 export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
-  private readOnlyError = vscode.FileSystemError.NoPermissions('write operation attempted, but source archive filesystem is readonly');
-  private archives: Map<string, Archive> = new Map;
+  private readOnlyError = vscode.FileSystemError.NoPermissions(
+    "write operation attempted, but source archive filesystem is readonly",
+  );
+  private archives: Map<string, Promise<Archive>> = new Map();
 
   private async getArchive(zipPath: string): Promise<Archive> {
     if (!this.archives.has(zipPath)) {
-      if (!await fs.pathExists(zipPath))
-        throw vscode.FileSystemError.FileNotFound(zipPath);
-      const archive: Archive = { unzipped: await unzipper.Open.file(zipPath), dirMap: new Map };
-      archive.unzipped.files.forEach(f => { ensureFile(archive.dirMap, path.resolve('/', f.path)); });
-      this.archives.set(zipPath, archive);
+      this.archives.set(zipPath, parse_zip(zipPath));
     }
-    return this.archives.get(zipPath)!;
+    return await this.archives.get(zipPath)!;
   }
 
-  root = new Directory('');
+  root = new Directory("");
 
   // metadata
 
@@ -194,7 +213,8 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
     const ref = decodeSourceArchiveUri(uri);
     const archive = await this.getArchive(ref.sourceArchiveZipPath);
     const contents = archive.dirMap.get(ref.pathWithinSourceArchive);
-    const result = contents === undefined ? undefined : Array.from(contents.entries());
+    const result =
+      contents === undefined ? undefined : Array.from(contents.entries());
     if (result === undefined) {
       throw vscode.FileSystemError.FileNotFound(uri);
     }
@@ -213,11 +233,19 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
 
   // write operations, all disabled
 
-  writeFile(_uri: vscode.Uri, _content: Uint8Array, _options: { create: boolean; overwrite: boolean }): void {
+  writeFile(
+    _uri: vscode.Uri,
+    _content: Uint8Array,
+    _options: { create: boolean; overwrite: boolean },
+  ): void {
     throw this.readOnlyError;
   }
 
-  rename(_oldUri: vscode.Uri, _newUri: vscode.Uri, _options: { overwrite: boolean }): void {
+  rename(
+    _oldUri: vscode.Uri,
+    _newUri: vscode.Uri,
+    _options: { overwrite: boolean },
+  ): void {
     throw this.readOnlyError;
   }
 
@@ -239,18 +267,18 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
     // use '/' as path separator throughout
     const reqPath = ref.pathWithinSourceArchive;
 
-    const file = archive.unzipped.files.find(
-      f => {
-        const absolutePath = path.resolve('/', f.path);
-        return absolutePath === reqPath
-          || absolutePath === path.join('/src_archive', reqPath);
-      }
-    );
+    const file = archive.unzipped.files.find((f) => {
+      const absolutePath = path.resolve("/", f.path);
+      return (
+        absolutePath === reqPath ||
+        absolutePath === path.join("/src_archive", reqPath)
+      );
+    });
     if (file !== undefined) {
-      if (file.type === 'File') {
+      if (file.type === "File") {
         return new File(reqPath, await file.buffer());
-      }
-      else { // file.type === 'Directory'
+      } else {
+        // file.type === 'Directory'
         // I haven't observed this case in practice. Could it happen
         // with a zip file that contains empty directories?
         return new Directory(reqPath);
@@ -259,7 +287,11 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
     if (archive.dirMap.has(reqPath)) {
       return new Directory(reqPath);
     }
-    throw vscode.FileSystemError.FileNotFound(`uri '${uri.toString()}', interpreted as '${reqPath}' in archive '${ref.sourceArchiveZipPath}'`);
+    throw vscode.FileSystemError.FileNotFound(
+      `uri '${uri.toString()}', interpreted as '${reqPath}' in archive '${
+        ref.sourceArchiveZipPath
+      }'`,
+    );
   }
 
   private async _lookupAsFile(uri: vscode.Uri): Promise<File> {
@@ -274,11 +306,14 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
 
   private _emitter = new vscode.EventEmitter<vscode.FileChangeEvent[]>();
 
-  readonly onDidChangeFile: vscode.Event<vscode.FileChangeEvent[]> = this._emitter.event;
+  readonly onDidChangeFile: vscode.Event<vscode.FileChangeEvent[]> =
+    this._emitter.event;
 
   watch(_resource: vscode.Uri): vscode.Disposable {
     // ignore, fires for all changes...
-    return new vscode.Disposable(() => { /**/ });
+    return new vscode.Disposable(() => {
+      /**/
+    });
   }
 }
 
@@ -290,15 +325,17 @@ export class ArchiveFileSystemProvider implements vscode.FileSystemProvider {
  * (cf. https://www.ietf.org/rfc/rfc2396.txt (Appendix A, page 26) for
  * the fact that hyphens are allowed in uri schemes)
  */
-export const zipArchiveScheme = 'codeql-zip-archive';
+export const zipArchiveScheme = "codeql-zip-archive";
 
 export function activate(ctx: vscode.ExtensionContext) {
-  ctx.subscriptions.push(vscode.workspace.registerFileSystemProvider(
-    zipArchiveScheme,
-    new ArchiveFileSystemProvider(),
-    {
-      isCaseSensitive: true,
-      isReadonly: true,
-    }
-  ));
+  ctx.subscriptions.push(
+    vscode.workspace.registerFileSystemProvider(
+      zipArchiveScheme,
+      new ArchiveFileSystemProvider(),
+      {
+        isCaseSensitive: true,
+        isReadonly: true,
+      },
+    ),
+  );
 }

extensions/ql-vscode/src/astViewer.ts

@@ -10,17 +10,22 @@ import {
   TextEditorSelectionChangeEvent,
   TextEditorSelectionChangeKind,
   Location,
-  Range
-} from 'vscode';
-import * as path from 'path';
+  Range,
+  Uri,
+} from "vscode";
+import * as path from "path";
 
-import { DatabaseItem } from './databases';
-import { UrlValue, BqrsId } from './pure/bqrs-cli-types';
-import { showLocation } from './interface-utils';
-import { isStringLoc, isWholeFileLoc, isLineColumnLoc } from './pure/bqrs-utils';
-import { commandRunner } from './commandRunner';
-import { DisposableObject } from './pure/disposable-object';
-import { showAndLogErrorMessage } from './helpers';
+import { DatabaseItem } from "./databases";
+import { UrlValue, BqrsId } from "./pure/bqrs-cli-types";
+import { showLocation } from "./interface-utils";
+import {
+  isStringLoc,
+  isWholeFileLoc,
+  isLineColumnLoc,
+} from "./pure/bqrs-utils";
+import { commandRunner } from "./commandRunner";
+import { DisposableObject } from "./pure/disposable-object";
+import { showAndLogErrorMessage } from "./helpers";
 
 export interface AstItem {
   id: BqrsId;
@@ -35,23 +40,25 @@ export interface ChildAstItem extends AstItem {
   parent: ChildAstItem | AstItem;
 }
 
-class AstViewerDataProvider extends DisposableObject implements TreeDataProvider<AstItem> {
-
+class AstViewerDataProvider
+  extends DisposableObject
+  implements TreeDataProvider<AstItem>
+{
   public roots: AstItem[] = [];
   public db: DatabaseItem | undefined;
 
-  private _onDidChangeTreeData =
-    this.push(new EventEmitter<AstItem | undefined>());
+  private _onDidChangeTreeData = this.push(
+    new EventEmitter<AstItem | undefined>(),
+  );
   readonly onDidChangeTreeData: Event<AstItem | undefined> =
     this._onDidChangeTreeData.event;
 
   constructor() {
     super();
     this.push(
-      commandRunner('codeQLAstViewer.gotoCode',
-        async (item: AstItem) => {
-          await showLocation(item.fileLocation);
-        })
+      commandRunner("codeQLAstViewer.gotoCode", async (item: AstItem) => {
+        await showLocation(item.fileLocation);
+      }),
     );
   }
 
@@ -60,7 +67,7 @@ class AstViewerDataProvider extends DisposableObject implements TreeDataProvider
   }
   getChildren(item?: AstItem): ProviderResult<AstItem[]> {
     const children = item ? item.children : this.roots;
-    return children.sort((c1, c2) => (c1.order - c2.order));
+    return children.sort((c1, c2) => c1.order - c2.order);
   }
 
   getParent(item: ChildAstItem): ProviderResult<AstItem> {
@@ -73,22 +80,22 @@ class AstViewerDataProvider extends DisposableObject implements TreeDataProvider
     const state = item.children.length
       ? TreeItemCollapsibleState.Collapsed
       : TreeItemCollapsibleState.None;
-    const treeItem = new TreeItem(item.label || '', state);
-    treeItem.description = line ? `Line ${line}` : '';
+    const treeItem = new TreeItem(item.label || "", state);
+    treeItem.description = line ? `Line ${line}` : "";
     treeItem.id = String(item.id);
     treeItem.tooltip = `${treeItem.description} ${treeItem.label}`;
     treeItem.command = {
-      command: 'codeQLAstViewer.gotoCode',
-      title: 'Go To Code',
+      command: "codeQLAstViewer.gotoCode",
+      title: "Go To Code",
       tooltip: `Go To ${item.location}`,
-      arguments: [item]
+      arguments: [item],
     };
     return treeItem;
   }
 
   private extractLineInfo(loc?: UrlValue) {
     if (!loc) {
-      return '';
+      return "";
     } else if (isStringLoc(loc)) {
       return loc;
     } else if (isWholeFileLoc(loc)) {
@@ -96,7 +103,7 @@ class AstViewerDataProvider extends DisposableObject implements TreeDataProvider
     } else if (isLineColumnLoc(loc)) {
       return loc.startLine;
     } else {
-      return '';
+      return "";
     }
   }
 }
@@ -104,38 +111,42 @@ class AstViewerDataProvider extends DisposableObject implements TreeDataProvider
 export class AstViewer extends DisposableObject {
   private treeView: TreeView<AstItem>;
   private treeDataProvider: AstViewerDataProvider;
-  private currentFile: string | undefined;
+  private currentFileUri: Uri | undefined;
 
   constructor() {
     super();
 
     this.treeDataProvider = new AstViewerDataProvider();
-    this.treeView = window.createTreeView('codeQLAstViewer', {
+    this.treeView = window.createTreeView("codeQLAstViewer", {
       treeDataProvider: this.treeDataProvider,
-      showCollapseAll: true
+      showCollapseAll: true,
     });
 
     this.push(this.treeView);
     this.push(this.treeDataProvider);
     this.push(
-      commandRunner('codeQLAstViewer.clear', async () => {
+      commandRunner("codeQLAstViewer.clear", async () => {
         this.clear();
-      })
+      }),
+    );
+    this.push(
+      window.onDidChangeTextEditorSelection(this.updateTreeSelection, this),
     );
-    this.push(window.onDidChangeTextEditorSelection(this.updateTreeSelection, this));
   }
 
-  updateRoots(roots: AstItem[], db: DatabaseItem, fileName: string) {
+  updateRoots(roots: AstItem[], db: DatabaseItem, fileUri: Uri) {
     this.treeDataProvider.roots = roots;
     this.treeDataProvider.db = db;
     this.treeDataProvider.refresh();
-    this.treeView.message = `AST for ${path.basename(fileName)}`;
-    this.currentFile = fileName;
+    this.treeView.message = `AST for ${path.basename(fileUri.fsPath)}`;
+    this.currentFileUri = fileUri;
     // Handle error on reveal. This could happen if
     // the tree view is disposed during the reveal.
     this.treeView.reveal(roots[0], { focus: false })?.then(
-      () => { /**/ },
-      err => showAndLogErrorMessage(err)
+      () => {
+        /**/
+      },
+      (err) => showAndLogErrorMessage(err),
     );
   }
 
@@ -148,7 +159,10 @@ export class AstViewer extends DisposableObject {
     // range that contains the selection.
     // Some nodes do not have a location, but their children might, so must
     // recurse though location-less AST nodes to see if children are correct.
-    function findBest(selectedRange: Range, items?: AstItem[]): AstItem | undefined {
+    function findBest(
+      selectedRange: Range,
+      items?: AstItem[],
+    ): AstItem | undefined {
       if (!items || !items.length) {
         return;
       }
@@ -174,7 +188,7 @@ export class AstViewer extends DisposableObject {
 
     if (
       this.treeView.visible &&
-      e.textEditor.document.uri.fsPath === this.currentFile &&
+      e.textEditor.document.uri.fsPath === this.currentFileUri?.fsPath &&
       e.selections.length === 1
     ) {
       const selection = e.selections[0];
@@ -187,8 +201,10 @@ export class AstViewer extends DisposableObject {
         // Handle error on reveal. This could happen if
         // the tree view is disposed during the reveal.
         this.treeView.reveal(targetItem)?.then(
-          () => { /**/ },
-          err => showAndLogErrorMessage(err)
+          () => {
+            /**/
+          },
+          (err) => showAndLogErrorMessage(err),
         );
       }
     }
@@ -199,6 +215,6 @@ export class AstViewer extends DisposableObject {
     this.treeDataProvider.db = undefined;
     this.treeDataProvider.refresh();
     this.treeView.message = undefined;
-    this.currentFile = undefined;
+    this.currentFileUri = undefined;
   }
 }

extensions/ql-vscode/src/authentication.ts

@@ -1,13 +1,15 @@
-import * as vscode from 'vscode';
-import * as Octokit from '@octokit/rest';
+import * as vscode from "vscode";
+import * as Octokit from "@octokit/rest";
+import { retry } from "@octokit/plugin-retry";
 
-const GITHUB_AUTH_PROVIDER_ID = 'github';
+const GITHUB_AUTH_PROVIDER_ID = "github";
 
-// 'repo' scope should be enough for triggering workflows. For a comprehensive list, see:
+// We need 'repo' scope for triggering workflows and 'gist' scope for exporting results to Gist.
+// For a comprehensive list of scopes, see:
 // https://docs.github.com/apps/building-oauth-apps/understanding-scopes-for-oauth-apps
-const SCOPES = ['repo'];
+const SCOPES = ["repo", "gist"];
 
-/** 
+/**
  * Handles authentication to GitHub, using the VS Code [authentication API](https://code.visualstudio.com/api/references/vscode-api#authentication).
  */
 export class Credentials {
@@ -16,21 +18,58 @@ export class Credentials {
   // Explicitly make the constructor private, so that we can't accidentally call the constructor from outside the class
   // without also initializing the class.
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  private constructor() { }
+  private constructor() {}
 
-  static async initialize(context: vscode.ExtensionContext): Promise<Credentials> {
+  /**
+   * Initializes an instance of credentials with an octokit instance.
+   *
+   * Do not call this method until you know you actually need an instance of credentials.
+   * since calling this method will require the user to log in.
+   *
+   * @param context The extension context.
+   * @returns An instance of credentials.
+   */
+  static async initialize(
+    context: vscode.ExtensionContext,
+  ): Promise<Credentials> {
     const c = new Credentials();
     c.registerListeners(context);
     c.octokit = await c.createOctokit(false);
     return c;
   }
 
-  private async createOctokit(createIfNone: boolean): Promise<Octokit.Octokit | undefined> {
-    const session = await vscode.authentication.getSession(GITHUB_AUTH_PROVIDER_ID, SCOPES, { createIfNone });
+  /**
+   * Initializes an instance of credentials with an octokit instance using
+   * a token from the user's GitHub account. This method is meant to be
+   * used non-interactive environments such as tests.
+   *
+   * @param overrideToken The GitHub token to use for authentication.
+   * @returns An instance of credentials.
+   */
+  static async initializeWithToken(overrideToken: string) {
+    const c = new Credentials();
+    c.octokit = await c.createOctokit(false, overrideToken);
+    return c;
+  }
+
+  private async createOctokit(
+    createIfNone: boolean,
+    overrideToken?: string,
+  ): Promise<Octokit.Octokit | undefined> {
+    if (overrideToken) {
+      return new Octokit.Octokit({ auth: overrideToken, retry });
+    }
+
+    const session = await vscode.authentication.getSession(
+      GITHUB_AUTH_PROVIDER_ID,
+      SCOPES,
+      { createIfNone },
+    );
 
     if (session) {
       return new Octokit.Octokit({
-        auth: session.accessToken
+        auth: session.accessToken,
+        retry,
       });
     } else {
       return undefined;
@@ -39,23 +78,36 @@ export class Credentials {
 
   registerListeners(context: vscode.ExtensionContext): void {
     // Sessions are changed when a user logs in or logs out.
-    context.subscriptions.push(vscode.authentication.onDidChangeSessions(async e => {
-      if (e.provider.id === GITHUB_AUTH_PROVIDER_ID) {
-        this.octokit = await this.createOctokit(false);
-      }
-    }));
+    context.subscriptions.push(
+      vscode.authentication.onDidChangeSessions(async (e) => {
+        if (e.provider.id === GITHUB_AUTH_PROVIDER_ID) {
+          this.octokit = await this.createOctokit(false);
+        }
+      }),
+    );
   }
 
-  async getOctokit(): Promise<Octokit.Octokit> {
+  /**
+   * Creates or returns an instance of Octokit.
+   *
+   * @param requireAuthentication Whether the Octokit instance needs to be authenticated as user.
+   * @returns An instance of Octokit.
+   */
+  async getOctokit(requireAuthentication = true): Promise<Octokit.Octokit> {
     if (this.octokit) {
       return this.octokit;
     }
 
-    this.octokit = await this.createOctokit(true);
-    // octokit shouldn't be undefined, since we've set "createIfNone: true".
-    // The following block is mainly here to prevent a compiler error.
+    this.octokit = await this.createOctokit(requireAuthentication);
+
     if (!this.octokit) {
-      throw new Error('Did not initialize Octokit.');
+      if (requireAuthentication) {
+        throw new Error("Did not initialize Octokit.");
+      }
+
+      // We don't want to set this in this.octokit because that would prevent
+      // authenticating when requireCredentials is true.
+      return new Octokit.Octokit({ retry });
     }
     return this.octokit;
   }

extensions/ql-vscode/src/blob.d.ts

@@ -1,11 +0,0 @@
-/**
- * The npm library jszip is designed to work in both the browser and
- * node. Consequently its typings @types/jszip refers to both node
- * types like `Buffer` (which don't exist in the browser), and browser
- * types like `Blob` (which don't exist in node). Instead of sticking
- * all of `dom` in `compilerOptions.lib`, it suffices just to put in a
- * stub definition of the type `Blob` here so that compilation
- * succeeds.
- */
-
-declare type Blob = string;

extensions/ql-vscode/src/cli-version.ts

@@ -1,24 +1,30 @@
-import * as semver from 'semver';
-import { runCodeQlCliCommand } from './cli';
-import { Logger } from './logging';
+import * as semver from "semver";
+import { runCodeQlCliCommand } from "./cli";
+import { Logger } from "./logging";
+import { getErrorMessage } from "./pure/helpers-pure";
 
 /**
  * Get the version of a CodeQL CLI.
  */
-export async function getCodeQlCliVersion(codeQlPath: string, logger: Logger): Promise<semver.SemVer | undefined> {
+export async function getCodeQlCliVersion(
+  codeQlPath: string,
+  logger: Logger,
+): Promise<semver.SemVer | undefined> {
   try {
     const output: string = await runCodeQlCliCommand(
       codeQlPath,
-      ['version'],
-      ['--format=terse'],
-      'Checking CodeQL version',
-      logger
+      ["version"],
+      ["--format=terse"],
+      "Checking CodeQL version",
+      logger,
     );
     return semver.parse(output.trim()) || undefined;
   } catch (e) {
     // Failed to run the version command. This might happen if the cli version is _really_ old, or it is corrupted.
     // Either way, we can't determine compatibility.
-    void logger.log(`Failed to run 'codeql version'. Reason: ${e.message}`);
+    void logger.log(
+      `Failed to run 'codeql version'. Reason: ${getErrorMessage(e)}`,
+    );
     return undefined;
   }
 }

extensions/ql-vscode/src/commandRunner.ts

@@ -4,11 +4,12 @@ import {
   window as Window,
   commands,
   Disposable,
-  ProgressLocation
-} from 'vscode';
-import { showAndLogErrorMessage, showAndLogWarningMessage } from './helpers';
-import { logger } from './logging';
-import { telemetryListener } from './telemetry';
+  ProgressLocation,
+} from "vscode";
+import { showAndLogErrorMessage, showAndLogWarningMessage } from "./helpers";
+import { logger } from "./logging";
+import { getErrorMessage, getErrorStack } from "./pure/helpers-pure";
+import { telemetryListener } from "./telemetry";
 
 export class UserCancellationException extends Error {
   /**
@@ -66,7 +67,7 @@ export type ProgressTask<R> = (
  * @param args arguments passed to this task passed on from
  * `commands.registerCommand`.
  */
-type NoProgressTask = ((...args: any[]) => Promise<any>);
+type NoProgressTask = (...args: any[]) => Promise<any>;
 
 /**
  * This mediates between the kind of progress callbacks we want to
@@ -90,15 +91,18 @@ export function withProgress<R>(
   ...args: any[]
 ): Thenable<R> {
   let progressAchieved = 0;
-  return Window.withProgress(options,
-    (progress, token) => {
-      return task(p => {
+  return Window.withProgress(options, (progress, token) => {
+    return task(
+      (p) => {
         const { message, step, maxStep } = p;
-        const increment = 100 * (step - progressAchieved) / maxStep;
+        const increment = (100 * (step - progressAchieved)) / maxStep;
         progressAchieved = step;
         progress.report({ message, increment });
-      }, token, ...args);
-    });
+      },
+      token,
+      ...args,
+    );
+  });
 }
 
 /**
@@ -121,8 +125,9 @@ export function commandRunner(
     try {
       return await task(...args);
     } catch (e) {
-      error = e;
-      const errorMessage = `${e.message || e} (${commandId})`;
+      const errorMessage = `${getErrorMessage(e) || e} (${commandId})`;
+      error = e instanceof Error ? e : new Error(errorMessage);
+      const errorStack = getErrorStack(e);
       if (e instanceof UserCancellationException) {
         // User has cancelled this action manually
         if (e.silent) {
@@ -132,11 +137,11 @@ export function commandRunner(
         }
       } else {
         // Include the full stack in the error log only.
-        const fullMessage = e.stack
-          ? `${errorMessage}\n${e.stack}`
+        const fullMessage = errorStack
+          ? `${errorMessage}\n${errorStack}`
           : errorMessage;
         void showAndLogErrorMessage(errorMessage, {
-          fullMessage
+          fullMessage,
         });
       }
       return undefined;
@@ -160,34 +165,37 @@ export function commandRunner(
 export function commandRunnerWithProgress<R>(
   commandId: string,
   task: ProgressTask<R>,
-  progressOptions: Partial<ProgressOptions>
+  progressOptions: Partial<ProgressOptions>,
+  outputLogger = logger,
 ): Disposable {
   return commands.registerCommand(commandId, async (...args: any[]) => {
     const startTime = Date.now();
     let error: Error | undefined;
     const progressOptionsWithDefaults = {
       location: ProgressLocation.Notification,
-      ...progressOptions
+      ...progressOptions,
     };
     try {
       return await withProgress(progressOptionsWithDefaults, task, ...args);
     } catch (e) {
-      error = e;
-      const errorMessage = `${e.message || e} (${commandId})`;
+      const errorMessage = `${getErrorMessage(e) || e} (${commandId})`;
+      error = e instanceof Error ? e : new Error(errorMessage);
+      const errorStack = getErrorStack(e);
       if (e instanceof UserCancellationException) {
         // User has cancelled this action manually
         if (e.silent) {
-          void logger.log(errorMessage);
+          void outputLogger.log(errorMessage);
         } else {
-          void showAndLogWarningMessage(errorMessage);
+          void showAndLogWarningMessage(errorMessage, { outputLogger });
         }
       } else {
         // Include the full stack in the error log only.
-        const fullMessage = e.stack
-          ? `${errorMessage}\n${e.stack}`
+        const fullMessage = errorStack
+          ? `${errorMessage}\n${errorStack}`
           : errorMessage;
         void showAndLogErrorMessage(errorMessage, {
-          fullMessage
+          outputLogger,
+          fullMessage,
         });
       }
       return undefined;
@@ -211,23 +219,26 @@ export function reportStreamProgress(
   readable: NodeJS.ReadableStream,
   messagePrefix: string,
   totalNumBytes?: number,
-  progress?: ProgressCallback
+  progress?: ProgressCallback,
 ) {
   if (progress && totalNumBytes) {
     let numBytesDownloaded = 0;
-    const bytesToDisplayMB = (numBytes: number): string => `${(numBytes / (1024 * 1024)).toFixed(1)} MB`;
+    const bytesToDisplayMB = (numBytes: number): string =>
+      `${(numBytes / (1024 * 1024)).toFixed(1)} MB`;
     const updateProgress = () => {
       progress({
         step: numBytesDownloaded,
         maxStep: totalNumBytes,
-        message: `${messagePrefix} [${bytesToDisplayMB(numBytesDownloaded)} of ${bytesToDisplayMB(totalNumBytes)}]`,
+        message: `${messagePrefix} [${bytesToDisplayMB(
+          numBytesDownloaded,
+        )} of ${bytesToDisplayMB(totalNumBytes)}]`,
       });
     };
 
     // Display the progress straight away rather than waiting for the first chunk.
     updateProgress();
 
-    readable.on('data', data => {
+    readable.on("data", (data) => {
       numBytesDownloaded += data.length;
       updateProgress();
     });

extensions/ql-vscode/src/common/app.ts

@@ -0,0 +1,17 @@
+import { Disposable } from "../pure/disposable-object";
+import { AppEventEmitter } from "./events";
+
+export interface App {
+  createEventEmitter<T>(): AppEventEmitter<T>;
+  mode: AppMode;
+  subscriptions: Disposable[];
+  extensionPath: string;
+  globalStoragePath: string;
+  workspaceStoragePath?: string;
+}
+
+export enum AppMode {
+  Production = 1,
+  Development = 2,
+  Test = 3,
+}

extensions/ql-vscode/src/common/events.ts

@@ -0,0 +1,10 @@
+import { Disposable } from "../pure/disposable-object";
+
+export interface AppEvent<T> {
+  (listener: (event: T) => void): Disposable;
+}
+
+export interface AppEventEmitter<T> {
+  event: AppEvent<T>;
+  fire(data: T): void;
+}

extensions/ql-vscode/src/common/value-result.ts

@@ -0,0 +1,51 @@
+/**
+ * Represents a result that can be either a value or some errors.
+ */
+export class ValueResult<TValue> {
+  private constructor(
+    private readonly errorMsgs: string[],
+    private readonly val?: TValue,
+  ) {}
+
+  public static ok<TValue>(value: TValue): ValueResult<TValue> {
+    if (value === undefined) {
+      throw new Error("Value must be set for successful result");
+    }
+
+    return new ValueResult([], value);
+  }
+
+  public static fail<TValue>(errorMsgs: string[]): ValueResult<TValue> {
+    if (errorMsgs.length === 0) {
+      throw new Error(
+        "At least one error message must be set for a failed result",
+      );
+    }
+
+    return new ValueResult<TValue>(errorMsgs, undefined);
+  }
+
+  public get isOk(): boolean {
+    return this.errorMsgs.length === 0;
+  }
+
+  public get isFailure(): boolean {
+    return this.errorMsgs.length > 0;
+  }
+
+  public get errors(): string[] {
+    if (!this.errorMsgs) {
+      throw new Error("Cannot get error for successful result");
+    }
+
+    return this.errorMsgs;
+  }
+
+  public get value(): TValue {
+    if (this.val === undefined) {
+      throw new Error("Cannot get value for unsuccessful result");
+    }
+
+    return this.val;
+  }
+}

extensions/ql-vscode/src/common/vscode/events.ts

@@ -0,0 +1,6 @@
+import * as vscode from "vscode";
+import { AppEventEmitter } from "../events";
+
+export class VSCodeAppEventEmitter<T>
+  extends vscode.EventEmitter<T>
+  implements AppEventEmitter<T> {}

extensions/ql-vscode/src/common/vscode/vscode-app.ts

@@ -0,0 +1,42 @@
+import * as vscode from "vscode";
+import { Disposable } from "../../pure/disposable-object";
+import { App, AppMode } from "../app";
+import { AppEventEmitter } from "../events";
+import { VSCodeAppEventEmitter } from "./events";
+
+export class ExtensionApp implements App {
+  public constructor(
+    public readonly extensionContext: vscode.ExtensionContext,
+  ) {}
+
+  public get extensionPath(): string {
+    return this.extensionContext.extensionPath;
+  }
+
+  public get globalStoragePath(): string {
+    return this.extensionContext.globalStorageUri.fsPath;
+  }
+
+  public get workspaceStoragePath(): string | undefined {
+    return this.extensionContext.storageUri?.fsPath;
+  }
+
+  public get subscriptions(): Disposable[] {
+    return this.extensionContext.subscriptions;
+  }
+
+  public get mode(): AppMode {
+    switch (this.extensionContext.extensionMode) {
+      case vscode.ExtensionMode.Development:
+        return AppMode.Development;
+      case vscode.ExtensionMode.Test:
+        return AppMode.Test;
+      default:
+        return AppMode.Production;
+    }
+  }
+
+  public createEventEmitter<T>(): AppEventEmitter<T> {
+    return new VSCodeAppEventEmitter<T>();
+  }
+}

extensions/ql-vscode/src/compare/compare-interface.ts

@@ -1,277 +0,0 @@
-import { DisposableObject } from '../pure/disposable-object';
-import {
-  WebviewPanel,
-  ExtensionContext,
-  window as Window,
-  ViewColumn,
-  Uri,
-} from 'vscode';
-import * as path from 'path';
-
-import { tmpDir } from '../run-queries';
-import { CompletedQuery } from '../query-results';
-import {
-  FromCompareViewMessage,
-  ToCompareViewMessage,
-  QueryCompareResult,
-} from '../pure/interface-types';
-import { Logger } from '../logging';
-import { CodeQLCliServer } from '../cli';
-import { DatabaseManager } from '../databases';
-import { getHtmlForWebview, jumpToLocation } from '../interface-utils';
-import { transformBqrsResultSet, RawResultSet, BQRSInfo } from '../pure/bqrs-cli-types';
-import resultsDiff from './resultsDiff';
-
-interface ComparePair {
-  from: CompletedQuery;
-  to: CompletedQuery;
-}
-
-export class CompareInterfaceManager extends DisposableObject {
-  private comparePair: ComparePair | undefined;
-  private panel: WebviewPanel | undefined;
-  private panelLoaded = false;
-  private panelLoadedCallBacks: (() => void)[] = [];
-
-  constructor(
-    private ctx: ExtensionContext,
-    private databaseManager: DatabaseManager,
-    private cliServer: CodeQLCliServer,
-    private logger: Logger,
-    private showQueryResultsCallback: (
-      item: CompletedQuery
-    ) => Promise<void>
-  ) {
-    super();
-  }
-
-  async showResults(
-    from: CompletedQuery,
-    to: CompletedQuery,
-    selectedResultSetName?: string
-  ) {
-    this.comparePair = { from, to };
-    this.getPanel().reveal(undefined, true);
-
-    await this.waitForPanelLoaded();
-    const [
-      commonResultSetNames,
-      currentResultSetName,
-      fromResultSet,
-      toResultSet,
-    ] = await this.findCommonResultSetNames(
-      from,
-      to,
-      selectedResultSetName
-    );
-    if (currentResultSetName) {
-      let rows: QueryCompareResult | undefined;
-      let message: string | undefined;
-      try {
-        rows = this.compareResults(fromResultSet, toResultSet);
-      } catch (e) {
-        message = e.message;
-      }
-
-      await this.postMessage({
-        t: 'setComparisons',
-        stats: {
-          fromQuery: {
-            // since we split the description into several rows
-            // only run interpolation if the label is user-defined
-            // otherwise we will wind up with duplicated rows
-            name: from.options.label
-              ? from.interpolate(from.getLabel())
-              : from.queryName,
-            status: from.statusString,
-            time: from.time,
-          },
-          toQuery: {
-            name: to.options.label
-              ? to.interpolate(to.getLabel())
-              : to.queryName,
-            status: to.statusString,
-            time: to.time,
-          },
-        },
-        columns: fromResultSet.schema.columns,
-        commonResultSetNames,
-        currentResultSetName: currentResultSetName,
-        rows,
-        message,
-        datebaseUri: to.database.databaseUri,
-      });
-    }
-  }
-
-  getPanel(): WebviewPanel {
-    if (this.panel == undefined) {
-      const { ctx } = this;
-      const panel = (this.panel = Window.createWebviewPanel(
-        'compareView',
-        'Compare CodeQL Query Results',
-        { viewColumn: ViewColumn.Active, preserveFocus: true },
-        {
-          enableScripts: true,
-          enableFindWidget: true,
-          retainContextWhenHidden: true,
-          localResourceRoots: [
-            Uri.file(tmpDir.name),
-            Uri.file(path.join(this.ctx.extensionPath, 'out')),
-          ],
-        }
-      ));
-      this.panel.onDidDispose(
-        () => {
-          this.panel = undefined;
-          this.comparePair = undefined;
-        },
-        null,
-        ctx.subscriptions
-      );
-
-      const scriptPathOnDisk = Uri.file(
-        ctx.asAbsolutePath('out/compareView.js')
-      );
-
-      const stylesheetPathOnDisk = Uri.file(
-        ctx.asAbsolutePath('out/resultsView.css')
-      );
-
-      panel.webview.html = getHtmlForWebview(
-        panel.webview,
-        scriptPathOnDisk,
-        stylesheetPathOnDisk
-      );
-      panel.webview.onDidReceiveMessage(
-        async (e) => this.handleMsgFromView(e),
-        undefined,
-        ctx.subscriptions
-      );
-    }
-    return this.panel;
-  }
-
-  private waitForPanelLoaded(): Promise<void> {
-    return new Promise((resolve) => {
-      if (this.panelLoaded) {
-        resolve();
-      } else {
-        this.panelLoadedCallBacks.push(resolve);
-      }
-    });
-  }
-
-  private async handleMsgFromView(
-    msg: FromCompareViewMessage
-  ): Promise<void> {
-    switch (msg.t) {
-      case 'compareViewLoaded':
-        this.panelLoaded = true;
-        this.panelLoadedCallBacks.forEach((cb) => cb());
-        this.panelLoadedCallBacks = [];
-        break;
-
-      case 'changeCompare':
-        await this.changeTable(msg.newResultSetName);
-        break;
-
-      case 'viewSourceFile':
-        await jumpToLocation(msg, this.databaseManager, this.logger);
-        break;
-
-      case 'openQuery':
-        await this.openQuery(msg.kind);
-        break;
-    }
-  }
-
-  private postMessage(msg: ToCompareViewMessage): Thenable<boolean> {
-    return this.getPanel().webview.postMessage(msg);
-  }
-
-  private async findCommonResultSetNames(
-    from: CompletedQuery,
-    to: CompletedQuery,
-    selectedResultSetName: string | undefined
-  ): Promise<[string[], string, RawResultSet, RawResultSet]> {
-    const fromSchemas = await this.cliServer.bqrsInfo(
-      from.query.resultsPaths.resultsPath
-    );
-    const toSchemas = await this.cliServer.bqrsInfo(
-      to.query.resultsPaths.resultsPath
-    );
-    const fromSchemaNames = fromSchemas['result-sets'].map(
-      (schema) => schema.name
-    );
-    const toSchemaNames = toSchemas['result-sets'].map(
-      (schema) => schema.name
-    );
-    const commonResultSetNames = fromSchemaNames.filter((name) =>
-      toSchemaNames.includes(name)
-    );
-    const currentResultSetName =
-      selectedResultSetName || commonResultSetNames[0];
-    const fromResultSet = await this.getResultSet(
-      fromSchemas,
-      currentResultSetName,
-      from.query.resultsPaths.resultsPath
-    );
-    const toResultSet = await this.getResultSet(
-      toSchemas,
-      currentResultSetName,
-      to.query.resultsPaths.resultsPath
-    );
-    return [
-      commonResultSetNames,
-      currentResultSetName,
-      fromResultSet,
-      toResultSet,
-    ];
-  }
-
-  private async changeTable(newResultSetName: string) {
-    if (!this.comparePair?.from || !this.comparePair.to) {
-      return;
-    }
-    await this.showResults(
-      this.comparePair.from,
-      this.comparePair.to,
-      newResultSetName
-    );
-  }
-
-  private async getResultSet(
-    bqrsInfo: BQRSInfo,
-    resultSetName: string,
-    resultsPath: string
-  ): Promise<RawResultSet> {
-    const schema = bqrsInfo['result-sets'].find(
-      (schema) => schema.name === resultSetName
-    );
-    if (!schema) {
-      throw new Error(`Schema ${resultSetName} not found.`);
-    }
-    const chunk = await this.cliServer.bqrsDecode(
-      resultsPath,
-      resultSetName
-    );
-    return transformBqrsResultSet(schema, chunk);
-  }
-
-  private compareResults(
-    fromResults: RawResultSet,
-    toResults: RawResultSet
-  ): QueryCompareResult {
-    // Only compare columns that have the same name
-    return resultsDiff(fromResults, toResults);
-  }
-
-  private async openQuery(kind: 'from' | 'to') {
-    const toOpen =
-      kind === 'from' ? this.comparePair?.from : this.comparePair?.to;
-    if (toOpen) {
-      await this.showQueryResultsCallback(toOpen);
-    }
-  }
-}

extensions/ql-vscode/src/compare/compare-view.ts

@@ -0,0 +1,212 @@
+import { ExtensionContext, ViewColumn } from "vscode";
+
+import {
+  FromCompareViewMessage,
+  ToCompareViewMessage,
+  QueryCompareResult,
+} from "../pure/interface-types";
+import { Logger } from "../logging";
+import { CodeQLCliServer } from "../cli";
+import { DatabaseManager } from "../databases";
+import { jumpToLocation } from "../interface-utils";
+import {
+  transformBqrsResultSet,
+  RawResultSet,
+  BQRSInfo,
+} from "../pure/bqrs-cli-types";
+import resultsDiff from "./resultsDiff";
+import { CompletedLocalQueryInfo } from "../query-results";
+import { getErrorMessage } from "../pure/helpers-pure";
+import { HistoryItemLabelProvider } from "../history-item-label-provider";
+import { AbstractWebview, WebviewPanelConfig } from "../abstract-webview";
+
+interface ComparePair {
+  from: CompletedLocalQueryInfo;
+  to: CompletedLocalQueryInfo;
+}
+
+export class CompareView extends AbstractWebview<
+  ToCompareViewMessage,
+  FromCompareViewMessage
+> {
+  private comparePair: ComparePair | undefined;
+
+  constructor(
+    ctx: ExtensionContext,
+    private databaseManager: DatabaseManager,
+    private cliServer: CodeQLCliServer,
+    private logger: Logger,
+    private labelProvider: HistoryItemLabelProvider,
+    private showQueryResultsCallback: (
+      item: CompletedLocalQueryInfo,
+    ) => Promise<void>,
+  ) {
+    super(ctx);
+  }
+
+  async showResults(
+    from: CompletedLocalQueryInfo,
+    to: CompletedLocalQueryInfo,
+    selectedResultSetName?: string,
+  ) {
+    this.comparePair = { from, to };
+    const panel = await this.getPanel();
+    panel.reveal(undefined, true);
+
+    await this.waitForPanelLoaded();
+    const [
+      commonResultSetNames,
+      currentResultSetName,
+      fromResultSet,
+      toResultSet,
+    ] = await this.findCommonResultSetNames(from, to, selectedResultSetName);
+    if (currentResultSetName) {
+      let rows: QueryCompareResult | undefined;
+      let message: string | undefined;
+      try {
+        rows = this.compareResults(fromResultSet, toResultSet);
+      } catch (e) {
+        message = getErrorMessage(e);
+      }
+
+      await this.postMessage({
+        t: "setComparisons",
+        stats: {
+          fromQuery: {
+            // since we split the description into several rows
+            // only run interpolation if the label is user-defined
+            // otherwise we will wind up with duplicated rows
+            name: this.labelProvider.getShortLabel(from),
+            status: from.completedQuery.statusString,
+            time: from.startTime,
+          },
+          toQuery: {
+            name: this.labelProvider.getShortLabel(to),
+            status: to.completedQuery.statusString,
+            time: to.startTime,
+          },
+        },
+        columns: fromResultSet.schema.columns,
+        commonResultSetNames,
+        currentResultSetName: currentResultSetName,
+        rows,
+        message,
+        databaseUri: to.initialInfo.databaseInfo.databaseUri,
+      });
+    }
+  }
+
+  protected getPanelConfig(): WebviewPanelConfig {
+    return {
+      viewId: "compareView",
+      title: "Compare CodeQL Query Results",
+      viewColumn: ViewColumn.Active,
+      preserveFocus: true,
+      view: "compare",
+    };
+  }
+
+  protected onPanelDispose(): void {
+    this.comparePair = undefined;
+  }
+
+  protected async onMessage(msg: FromCompareViewMessage): Promise<void> {
+    switch (msg.t) {
+      case "viewLoaded":
+        this.onWebViewLoaded();
+        break;
+
+      case "changeCompare":
+        await this.changeTable(msg.newResultSetName);
+        break;
+
+      case "viewSourceFile":
+        await jumpToLocation(msg, this.databaseManager, this.logger);
+        break;
+
+      case "openQuery":
+        await this.openQuery(msg.kind);
+        break;
+    }
+  }
+
+  private async findCommonResultSetNames(
+    from: CompletedLocalQueryInfo,
+    to: CompletedLocalQueryInfo,
+    selectedResultSetName: string | undefined,
+  ): Promise<[string[], string, RawResultSet, RawResultSet]> {
+    const fromSchemas = await this.cliServer.bqrsInfo(
+      from.completedQuery.query.resultsPaths.resultsPath,
+    );
+    const toSchemas = await this.cliServer.bqrsInfo(
+      to.completedQuery.query.resultsPaths.resultsPath,
+    );
+    const fromSchemaNames = fromSchemas["result-sets"].map(
+      (schema) => schema.name,
+    );
+    const toSchemaNames = toSchemas["result-sets"].map((schema) => schema.name);
+    const commonResultSetNames = fromSchemaNames.filter((name) =>
+      toSchemaNames.includes(name),
+    );
+    const currentResultSetName =
+      selectedResultSetName || commonResultSetNames[0];
+    const fromResultSet = await this.getResultSet(
+      fromSchemas,
+      currentResultSetName,
+      from.completedQuery.query.resultsPaths.resultsPath,
+    );
+    const toResultSet = await this.getResultSet(
+      toSchemas,
+      currentResultSetName,
+      to.completedQuery.query.resultsPaths.resultsPath,
+    );
+    return [
+      commonResultSetNames,
+      currentResultSetName,
+      fromResultSet,
+      toResultSet,
+    ];
+  }
+
+  private async changeTable(newResultSetName: string) {
+    if (!this.comparePair?.from || !this.comparePair.to) {
+      return;
+    }
+    await this.showResults(
+      this.comparePair.from,
+      this.comparePair.to,
+      newResultSetName,
+    );
+  }
+
+  private async getResultSet(
+    bqrsInfo: BQRSInfo,
+    resultSetName: string,
+    resultsPath: string,
+  ): Promise<RawResultSet> {
+    const schema = bqrsInfo["result-sets"].find(
+      (schema) => schema.name === resultSetName,
+    );
+    if (!schema) {
+      throw new Error(`Schema ${resultSetName} not found.`);
+    }
+    const chunk = await this.cliServer.bqrsDecode(resultsPath, resultSetName);
+    return transformBqrsResultSet(schema, chunk);
+  }
+
+  private compareResults(
+    fromResults: RawResultSet,
+    toResults: RawResultSet,
+  ): QueryCompareResult {
+    // Only compare columns that have the same name
+    return resultsDiff(fromResults, toResults);
+  }
+
+  private async openQuery(kind: "from" | "to") {
+    const toOpen =
+      kind === "from" ? this.comparePair?.from : this.comparePair?.to;
+    if (toOpen) {
+      await this.showQueryResultsCallback(toOpen);
+    }
+  }
+}

extensions/ql-vscode/src/compare/resultsDiff.ts

@@ -1,5 +1,5 @@
-import { RawResultSet } from '../pure/bqrs-cli-types';
-import { QueryCompareResult } from '../pure/interface-types';
+import { RawResultSet } from "../pure/bqrs-cli-types";
+import { QueryCompareResult } from "../pure/interface-types";
 
 /**
  * Compare the rows of two queries. Use deep equality to determine if
@@ -21,19 +21,18 @@ import { QueryCompareResult } from '../pure/interface-types';
  */
 export default function resultsDiff(
   fromResults: RawResultSet,
-  toResults: RawResultSet
+  toResults: RawResultSet,
 ): QueryCompareResult {
-
   if (fromResults.schema.columns.length !== toResults.schema.columns.length) {
-    throw new Error('CodeQL Compare: Columns do not match.');
+    throw new Error("CodeQL Compare: Columns do not match.");
   }
 
   if (!fromResults.rows.length) {
-    throw new Error('CodeQL Compare: Source query has no results.');
+    throw new Error("CodeQL Compare: Source query has no results.");
   }
 
   if (!toResults.rows.length) {
-    throw new Error('CodeQL Compare: Target query has no results.');
+    throw new Error("CodeQL Compare: Target query has no results.");
   }
 
   const results = {
@@ -45,7 +44,7 @@ export default function resultsDiff(
     fromResults.rows.length === results.from.length &&
     toResults.rows.length === results.to.length
   ) {
-    throw new Error('CodeQL Compare: No overlap between the selected queries.');
+    throw new Error("CodeQL Compare: No overlap between the selected queries.");
   }
 
   return results;

extensions/ql-vscode/src/config.ts

@@ -1,16 +1,34 @@
-import { DisposableObject } from './pure/disposable-object';
-import { workspace, Event, EventEmitter, ConfigurationChangeEvent, ConfigurationTarget } from 'vscode';
-import { DistributionManager } from './distribution';
-import { logger } from './logging';
+import { DisposableObject } from "./pure/disposable-object";
+import {
+  workspace,
+  Event,
+  EventEmitter,
+  ConfigurationChangeEvent,
+  ConfigurationTarget,
+} from "vscode";
+import { DistributionManager } from "./distribution";
+import { logger } from "./logging";
+import { ONE_DAY_IN_MS } from "./pure/time";
+
+export const ALL_SETTINGS: Setting[] = [];
 
 /** Helper class to look up a labelled (and possibly nested) setting. */
 export class Setting {
   name: string;
   parent?: Setting;
+  private _hasChildren = false;
 
   constructor(name: string, parent?: Setting) {
     this.name = name;
     this.parent = parent;
+    if (parent !== undefined) {
+      parent._hasChildren = true;
+    }
+    ALL_SETTINGS.push(this);
+  }
+
+  get hasChildren() {
+    return this._hasChildren;
   }
 
   get qualifiedName(): string {
@@ -23,42 +41,86 @@ export class Setting {
 
   getValue<T>(): T {
     if (this.parent === undefined) {
-      throw new Error('Cannot get the value of a root setting.');
+      throw new Error("Cannot get the value of a root setting.");
     }
-    return workspace.getConfiguration(this.parent.qualifiedName).get<T>(this.name)!;
+    return workspace
+      .getConfiguration(this.parent.qualifiedName)
+      .get<T>(this.name)!;
   }
 
   updateValue<T>(value: T, target: ConfigurationTarget): Thenable<void> {
     if (this.parent === undefined) {
-      throw new Error('Cannot update the value of a root setting.');
+      throw new Error("Cannot update the value of a root setting.");
     }
-    return workspace.getConfiguration(this.parent.qualifiedName).update(this.name, value, target);
+    return workspace
+      .getConfiguration(this.parent.qualifiedName)
+      .update(this.name, value, target);
   }
 
+  inspect<T>(): InspectionResult<T> | undefined {
+    if (this.parent === undefined) {
+      throw new Error("Cannot update the value of a root setting.");
+    }
+    return workspace
+      .getConfiguration(this.parent.qualifiedName)
+      .inspect(this.name);
+  }
 }
 
-const ROOT_SETTING = new Setting('codeQL');
+export interface InspectionResult<T> {
+  globalValue?: T;
+  workspaceValue?: T;
+  workspaceFolderValue?: T;
+}
+
+const ROOT_SETTING = new Setting("codeQL");
 
 // Global configuration
-const TELEMETRY_SETTING = new Setting('telemetry', ROOT_SETTING);
-const AST_VIEWER_SETTING = new Setting('astViewer', ROOT_SETTING);
-const GLOBAL_TELEMETRY_SETTING = new Setting('telemetry');
+const TELEMETRY_SETTING = new Setting("telemetry", ROOT_SETTING);
+const AST_VIEWER_SETTING = new Setting("astViewer", ROOT_SETTING);
+const GLOBAL_TELEMETRY_SETTING = new Setting("telemetry");
+const LOG_INSIGHTS_SETTING = new Setting("logInsights", ROOT_SETTING);
 
-export const LOG_TELEMETRY = new Setting('logTelemetry', TELEMETRY_SETTING);
-export const ENABLE_TELEMETRY = new Setting('enableTelemetry', TELEMETRY_SETTING);
+export const LOG_TELEMETRY = new Setting("logTelemetry", TELEMETRY_SETTING);
+export const ENABLE_TELEMETRY = new Setting(
+  "enableTelemetry",
+  TELEMETRY_SETTING,
+);
 
-export const GLOBAL_ENABLE_TELEMETRY = new Setting('enableTelemetry', GLOBAL_TELEMETRY_SETTING);
+export const GLOBAL_ENABLE_TELEMETRY = new Setting(
+  "enableTelemetry",
+  GLOBAL_TELEMETRY_SETTING,
+);
 
 // Distribution configuration
-const DISTRIBUTION_SETTING = new Setting('cli', ROOT_SETTING);
-export const CUSTOM_CODEQL_PATH_SETTING = new Setting('executablePath', DISTRIBUTION_SETTING);
-const INCLUDE_PRERELEASE_SETTING = new Setting('includePrerelease', DISTRIBUTION_SETTING);
-const PERSONAL_ACCESS_TOKEN_SETTING = new Setting('personalAccessToken', DISTRIBUTION_SETTING);
-const QUERY_HISTORY_SETTING = new Setting('queryHistory', ROOT_SETTING);
-const QUERY_HISTORY_FORMAT_SETTING = new Setting('format', QUERY_HISTORY_SETTING);
+const DISTRIBUTION_SETTING = new Setting("cli", ROOT_SETTING);
+export const CUSTOM_CODEQL_PATH_SETTING = new Setting(
+  "executablePath",
+  DISTRIBUTION_SETTING,
+);
+const INCLUDE_PRERELEASE_SETTING = new Setting(
+  "includePrerelease",
+  DISTRIBUTION_SETTING,
+);
+const PERSONAL_ACCESS_TOKEN_SETTING = new Setting(
+  "personalAccessToken",
+  DISTRIBUTION_SETTING,
+);
+
+// Query History configuration
+const QUERY_HISTORY_SETTING = new Setting("queryHistory", ROOT_SETTING);
+const QUERY_HISTORY_FORMAT_SETTING = new Setting(
+  "format",
+  QUERY_HISTORY_SETTING,
+);
+const QUERY_HISTORY_TTL = new Setting("ttl", QUERY_HISTORY_SETTING);
 
 /** When these settings change, the distribution should be updated. */
-const DISTRIBUTION_CHANGE_SETTINGS = [CUSTOM_CODEQL_PATH_SETTING, INCLUDE_PRERELEASE_SETTING, PERSONAL_ACCESS_TOKEN_SETTING];
+const DISTRIBUTION_CHANGE_SETTINGS = [
+  CUSTOM_CODEQL_PATH_SETTING,
+  INCLUDE_PRERELEASE_SETTING,
+  PERSONAL_ACCESS_TOKEN_SETTING,
+];
 
 export interface DistributionConfig {
   readonly customCodeQlPath?: string;
@@ -71,27 +133,48 @@ export interface DistributionConfig {
 }
 
 // Query server configuration
+const RUNNING_QUERIES_SETTING = new Setting("runningQueries", ROOT_SETTING);
+const NUMBER_OF_THREADS_SETTING = new Setting(
+  "numberOfThreads",
+  RUNNING_QUERIES_SETTING,
+);
+const SAVE_CACHE_SETTING = new Setting("saveCache", RUNNING_QUERIES_SETTING);
+const CACHE_SIZE_SETTING = new Setting("cacheSize", RUNNING_QUERIES_SETTING);
+const TIMEOUT_SETTING = new Setting("timeout", RUNNING_QUERIES_SETTING);
+const MEMORY_SETTING = new Setting("memory", RUNNING_QUERIES_SETTING);
+const DEBUG_SETTING = new Setting("debug", RUNNING_QUERIES_SETTING);
+const MAX_PATHS = new Setting("maxPaths", RUNNING_QUERIES_SETTING);
+const RUNNING_TESTS_SETTING = new Setting("runningTests", ROOT_SETTING);
+const RESULTS_DISPLAY_SETTING = new Setting("resultsDisplay", ROOT_SETTING);
 
-const RUNNING_QUERIES_SETTING = new Setting('runningQueries', ROOT_SETTING);
-const NUMBER_OF_THREADS_SETTING = new Setting('numberOfThreads', RUNNING_QUERIES_SETTING);
-const SAVE_CACHE_SETTING = new Setting('saveCache', RUNNING_QUERIES_SETTING);
-const CACHE_SIZE_SETTING = new Setting('cacheSize', RUNNING_QUERIES_SETTING);
-const TIMEOUT_SETTING = new Setting('timeout', RUNNING_QUERIES_SETTING);
-const MEMORY_SETTING = new Setting('memory', RUNNING_QUERIES_SETTING);
-const DEBUG_SETTING = new Setting('debug', RUNNING_QUERIES_SETTING);
-const MAX_PATHS = new Setting('maxPaths', RUNNING_QUERIES_SETTING);
-const RUNNING_TESTS_SETTING = new Setting('runningTests', ROOT_SETTING);
-const RESULTS_DISPLAY_SETTING = new Setting('resultsDisplay', ROOT_SETTING);
-
-export const ADDITIONAL_TEST_ARGUMENTS_SETTING = new Setting('additionalTestArguments', RUNNING_TESTS_SETTING);
-export const NUMBER_OF_TEST_THREADS_SETTING = new Setting('numberOfThreads', RUNNING_TESTS_SETTING);
-export const MAX_QUERIES = new Setting('maxQueries', RUNNING_QUERIES_SETTING);
-export const AUTOSAVE_SETTING = new Setting('autoSave', RUNNING_QUERIES_SETTING);
-export const PAGE_SIZE = new Setting('pageSize', RESULTS_DISPLAY_SETTING);
-const CUSTOM_LOG_DIRECTORY_SETTING = new Setting('customLogDirectory', RUNNING_QUERIES_SETTING);
+export const ADDITIONAL_TEST_ARGUMENTS_SETTING = new Setting(
+  "additionalTestArguments",
+  RUNNING_TESTS_SETTING,
+);
+export const NUMBER_OF_TEST_THREADS_SETTING = new Setting(
+  "numberOfThreads",
+  RUNNING_TESTS_SETTING,
+);
+export const MAX_QUERIES = new Setting("maxQueries", RUNNING_QUERIES_SETTING);
+export const AUTOSAVE_SETTING = new Setting(
+  "autoSave",
+  RUNNING_QUERIES_SETTING,
+);
+export const PAGE_SIZE = new Setting("pageSize", RESULTS_DISPLAY_SETTING);
+const CUSTOM_LOG_DIRECTORY_SETTING = new Setting(
+  "customLogDirectory",
+  RUNNING_QUERIES_SETTING,
+);
 
 /** When these settings change, the running query server should be restarted. */
-const QUERY_SERVER_RESTARTING_SETTINGS = [NUMBER_OF_THREADS_SETTING, SAVE_CACHE_SETTING, CACHE_SIZE_SETTING, MEMORY_SETTING, DEBUG_SETTING, CUSTOM_LOG_DIRECTORY_SETTING];
+const QUERY_SERVER_RESTARTING_SETTINGS = [
+  NUMBER_OF_THREADS_SETTING,
+  SAVE_CACHE_SETTING,
+  CACHE_SIZE_SETTING,
+  MEMORY_SETTING,
+  DEBUG_SETTING,
+  CUSTOM_LOG_DIRECTORY_SETTING,
+];
 
 export interface QueryServerConfig {
   codeQlPath: string;
@@ -106,14 +189,23 @@ export interface QueryServerConfig {
 }
 
 /** When these settings change, the query history should be refreshed. */
-const QUERY_HISTORY_SETTINGS = [QUERY_HISTORY_FORMAT_SETTING];
+const QUERY_HISTORY_SETTINGS = [
+  QUERY_HISTORY_FORMAT_SETTING,
+  QUERY_HISTORY_TTL,
+];
 
 export interface QueryHistoryConfig {
   format: string;
+  ttlInMillis: number;
   onDidChangeConfiguration: Event<void>;
 }
 
-const CLI_SETTINGS = [ADDITIONAL_TEST_ARGUMENTS_SETTING, NUMBER_OF_TEST_THREADS_SETTING, NUMBER_OF_THREADS_SETTING, MAX_PATHS];
+const CLI_SETTINGS = [
+  ADDITIONAL_TEST_ARGUMENTS_SETTING,
+  NUMBER_OF_TEST_THREADS_SETTING,
+  NUMBER_OF_THREADS_SETTING,
+  MAX_PATHS,
+];
 
 export interface CliConfig {
   additionalTestArguments: string[];
@@ -123,20 +215,29 @@ export interface CliConfig {
   onDidChangeConfiguration?: Event<void>;
 }
 
-
 export abstract class ConfigListener extends DisposableObject {
-  protected readonly _onDidChangeConfiguration = this.push(new EventEmitter<void>());
+  protected readonly _onDidChangeConfiguration = this.push(
+    new EventEmitter<void>(),
+  );
 
   constructor() {
     super();
     this.updateConfiguration();
-    this.push(workspace.onDidChangeConfiguration(this.handleDidChangeConfiguration, this));
+    this.push(
+      workspace.onDidChangeConfiguration(
+        this.handleDidChangeConfiguration,
+        this,
+      ),
+    );
   }
 
   /**
    * Calls `updateConfiguration` if any of the `relevantSettings` have changed.
    */
-  protected handleDidChangeConfigurationForRelevantSettings(relevantSettings: Setting[], e: ConfigurationChangeEvent): void {
+  protected handleDidChangeConfigurationForRelevantSettings(
+    relevantSettings: Setting[],
+    e: ConfigurationChangeEvent,
+  ): void {
     // Check whether any options that affect query running were changed.
     for (const option of relevantSettings) {
       // TODO: compare old and new values, only update if there was actually a change?
@@ -147,7 +248,9 @@ export abstract class ConfigListener extends DisposableObject {
     }
   }
 
-  protected abstract handleDidChangeConfiguration(e: ConfigurationChangeEvent): void;
+  protected abstract handleDidChangeConfiguration(
+    e: ConfigurationChangeEvent,
+  ): void;
   private updateConfiguration(): void {
     this._onDidChangeConfiguration.fire(undefined);
   }
@@ -157,7 +260,10 @@ export abstract class ConfigListener extends DisposableObject {
   }
 }
 
-export class DistributionConfigListener extends ConfigListener implements DistributionConfig {
+export class DistributionConfigListener
+  extends ConfigListener
+  implements DistributionConfig
+{
   public get customCodeQlPath(): string | undefined {
     return CUSTOM_CODEQL_PATH_SETTING.getValue() || undefined;
   }
@@ -171,28 +277,43 @@ export class DistributionConfigListener extends ConfigListener implements Distri
   }
 
   public async updateCustomCodeQlPath(newPath: string | undefined) {
-    await CUSTOM_CODEQL_PATH_SETTING.updateValue(newPath, ConfigurationTarget.Global);
+    await CUSTOM_CODEQL_PATH_SETTING.updateValue(
+      newPath,
+      ConfigurationTarget.Global,
+    );
   }
 
   protected handleDidChangeConfiguration(e: ConfigurationChangeEvent): void {
-    this.handleDidChangeConfigurationForRelevantSettings(DISTRIBUTION_CHANGE_SETTINGS, e);
+    this.handleDidChangeConfigurationForRelevantSettings(
+      DISTRIBUTION_CHANGE_SETTINGS,
+      e,
+    );
   }
 }
 
-export class QueryServerConfigListener extends ConfigListener implements QueryServerConfig {
-  public constructor(private _codeQlPath = '') {
+export class QueryServerConfigListener
+  extends ConfigListener
+  implements QueryServerConfig
+{
+  public constructor(private _codeQlPath = "") {
     super();
   }
 
-  public static async createQueryServerConfigListener(distributionManager: DistributionManager): Promise<QueryServerConfigListener> {
-    const codeQlPath = await distributionManager.getCodeQlPathWithoutVersionCheck();
+  public static async createQueryServerConfigListener(
+    distributionManager: DistributionManager,
+  ): Promise<QueryServerConfigListener> {
+    const codeQlPath =
+      await distributionManager.getCodeQlPathWithoutVersionCheck();
     const config = new QueryServerConfigListener(codeQlPath!);
     if (distributionManager.onDidChangeDistribution) {
-      config.push(distributionManager.onDidChangeDistribution(async () => {
-        const codeQlPath = await distributionManager.getCodeQlPathWithoutVersionCheck();
-        config._codeQlPath = codeQlPath!;
-        config._onDidChangeConfiguration.fire(undefined);
-      }));
+      config.push(
+        distributionManager.onDidChangeDistribution(async () => {
+          const codeQlPath =
+            await distributionManager.getCodeQlPathWithoutVersionCheck();
+          config._codeQlPath = codeQlPath!;
+          config._onDidChangeConfiguration.fire(undefined);
+        }),
+      );
     }
     return config;
   }
@@ -227,8 +348,10 @@ export class QueryServerConfigListener extends ConfigListener implements QuerySe
     if (memory === null) {
       return undefined;
     }
-    if (memory == 0 || typeof (memory) !== 'number') {
-      void logger.log(`Ignoring value '${memory}' for setting ${MEMORY_SETTING.qualifiedName}`);
+    if (memory == 0 || typeof memory !== "number") {
+      void logger.log(
+        `Ignoring value '${memory}' for setting ${MEMORY_SETTING.qualifiedName}`,
+      );
       return undefined;
     }
     return memory;
@@ -239,18 +362,34 @@ export class QueryServerConfigListener extends ConfigListener implements QuerySe
   }
 
   protected handleDidChangeConfiguration(e: ConfigurationChangeEvent): void {
-    this.handleDidChangeConfigurationForRelevantSettings(QUERY_SERVER_RESTARTING_SETTINGS, e);
+    this.handleDidChangeConfigurationForRelevantSettings(
+      QUERY_SERVER_RESTARTING_SETTINGS,
+      e,
+    );
   }
 }
 
-export class QueryHistoryConfigListener extends ConfigListener implements QueryHistoryConfig {
+export class QueryHistoryConfigListener
+  extends ConfigListener
+  implements QueryHistoryConfig
+{
   protected handleDidChangeConfiguration(e: ConfigurationChangeEvent): void {
-    this.handleDidChangeConfigurationForRelevantSettings(QUERY_HISTORY_SETTINGS, e);
+    this.handleDidChangeConfigurationForRelevantSettings(
+      QUERY_HISTORY_SETTINGS,
+      e,
+    );
   }
 
   public get format(): string {
     return QUERY_HISTORY_FORMAT_SETTING.getValue<string>();
   }
+
+  /**
+   * The configuration value is in days, but return the value in milliseconds to make it easier to use.
+   */
+  public get ttlInMillis(): number {
+    return (QUERY_HISTORY_TTL.getValue<number>() || 30) * ONE_DAY_IN_MS;
+  }
 }
 
 export class CliConfigListener extends ConfigListener implements CliConfig {
@@ -275,6 +414,18 @@ export class CliConfigListener extends ConfigListener implements CliConfig {
   }
 }
 
+/**
+ * Whether to enable CodeLens for the 'Quick Evaluation' command.
+ */
+const QUICK_EVAL_CODELENS_SETTING = new Setting(
+  "quickEvalCodelens",
+  RUNNING_QUERIES_SETTING,
+);
+
+export function isQuickEvalCodelensEnabled() {
+  return QUICK_EVAL_CODELENS_SETTING.getValue<boolean>();
+}
+
 // Enable experimental features
 
 /**
@@ -287,44 +438,98 @@ export class CliConfigListener extends ConfigListener implements CliConfig {
 /**
  * Enables canary features of this extension. Recommended for all internal users.
  */
-export const CANARY_FEATURES = new Setting('canary', ROOT_SETTING);
+export const CANARY_FEATURES = new Setting("canary", ROOT_SETTING);
 
 export function isCanary() {
   return !!CANARY_FEATURES.getValue<boolean>();
 }
 
 /**
- * Avoids caching in the AST viewer if the user is also a canary user.
+ * Enables the experimental query server
  */
-export const NO_CACHE_AST_VIEWER = new Setting('disableCache', AST_VIEWER_SETTING);
+export const CANARY_QUERY_SERVER = new Setting(
+  "canaryQueryServer",
+  ROOT_SETTING,
+);
 
-// Settings for remote queries
-const REMOTE_QUERIES_SETTING = new Setting('remoteQueries', ROOT_SETTING);
+// The default value for this setting is now `true`
+export function allowCanaryQueryServer() {
+  const value = CANARY_QUERY_SERVER.getValue<boolean>();
+  return value === undefined ? true : !!value;
+}
+
+export const JOIN_ORDER_WARNING_THRESHOLD = new Setting(
+  "joinOrderWarningThreshold",
+  LOG_INSIGHTS_SETTING,
+);
+
+export function joinOrderWarningThreshold(): number {
+  return JOIN_ORDER_WARNING_THRESHOLD.getValue<number>();
+}
 
 /**
- * Lists of GitHub repositories that you want to query remotely via the "Run Remote query" command.
+ * Avoids caching in the AST viewer if the user is also a canary user.
+ */
+export const NO_CACHE_AST_VIEWER = new Setting(
+  "disableCache",
+  AST_VIEWER_SETTING,
+);
+
+// Settings for variant analysis
+const REMOTE_QUERIES_SETTING = new Setting("variantAnalysis", ROOT_SETTING);
+
+/**
+ * Lists of GitHub repositories that you want to query remotely via the "Run Variant Analysis" command.
  * Note: This command is only available for internal users.
  *
  * This setting should be a JSON object where each key is a user-specified name (string),
  * and the value is an array of GitHub repositories (of the form `<owner>/<repo>`).
  */
-const REMOTE_REPO_LISTS = new Setting('repositoryLists', REMOTE_QUERIES_SETTING);
+const REMOTE_REPO_LISTS = new Setting(
+  "repositoryLists",
+  REMOTE_QUERIES_SETTING,
+);
 
-export function getRemoteRepositoryLists(): Record<string, string[]> | undefined {
+export function getRemoteRepositoryLists():
+  | Record<string, string[]>
+  | undefined {
   return REMOTE_REPO_LISTS.getValue<Record<string, string[]>>() || undefined;
 }
 
-export async function setRemoteRepositoryLists(lists: Record<string, string[]> | undefined) {
+export async function setRemoteRepositoryLists(
+  lists: Record<string, string[]> | undefined,
+) {
   await REMOTE_REPO_LISTS.updateValue(lists, ConfigurationTarget.Global);
 }
 
 /**
- * The name of the "controller" repository that you want to use with the "Run Remote query" command.
+ * Path to a file that contains lists of GitHub repositories that you want to query remotely via
+ * the "Run Variant Analysis" command.
+ * Note: This command is only available for internal users.
+ *
+ * This setting should be a path to a JSON file that contains a JSON object where each key is a
+ * user-specified name (string), and the value is an array of GitHub repositories
+ * (of the form `<owner>/<repo>`).
+ */
+const REPO_LISTS_PATH = new Setting(
+  "repositoryListsPath",
+  REMOTE_QUERIES_SETTING,
+);
+
+export function getRemoteRepositoryListsPath(): string | undefined {
+  return REPO_LISTS_PATH.getValue<string>() || undefined;
+}
+
+/**
+ * The name of the "controller" repository that you want to use with the "Run Variant Analysis" command.
  * Note: This command is only available for internal users.
  *
  * This setting should be a GitHub repository of the form `<owner>/<repo>`.
  */
-const REMOTE_CONTROLLER_REPO = new Setting('controllerRepo', REMOTE_QUERIES_SETTING);
+const REMOTE_CONTROLLER_REPO = new Setting(
+  "controllerRepo",
+  REMOTE_QUERIES_SETTING,
+);
 
 export function getRemoteControllerRepo(): string | undefined {
   return REMOTE_CONTROLLER_REPO.getValue<string>() || undefined;
@@ -335,13 +540,87 @@ export async function setRemoteControllerRepo(repo: string | undefined) {
 }
 
 /**
- * Whether to insecurely load ML models from CodeQL packs.
- *
- * This setting is for internal users only.
+ * The branch of "github/codeql-variant-analysis-action" to use with the "Run Variant Analysis" command.
+ * Default value is "main".
+ * Note: This command is only available for internal users.
  */
-const SHOULD_INSECURELY_LOAD_MODELS_FROM_PACKS =
-  new Setting('shouldInsecurelyLoadModelsFromPacks', RUNNING_QUERIES_SETTING);
+const ACTION_BRANCH = new Setting("actionBranch", REMOTE_QUERIES_SETTING);
 
-export function shouldInsecurelyLoadMlModelsFromPacks(): boolean {
-  return SHOULD_INSECURELY_LOAD_MODELS_FROM_PACKS.getValue<boolean>();
+export function getActionBranch(): string {
+  return ACTION_BRANCH.getValue<string>() || "main";
+}
+
+export function isIntegrationTestMode() {
+  return process.env.INTEGRATION_TEST_MODE === "true";
+}
+
+/**
+ * A flag indicating whether to enable the experimental "live results" feature
+ * for multi-repo variant analyses.
+ */
+const LIVE_RESULTS = new Setting("liveResults", REMOTE_QUERIES_SETTING);
+
+export function isVariantAnalysisLiveResultsEnabled(): boolean {
+  return !!LIVE_RESULTS.getValue<boolean>();
+}
+
+/**
+ * A flag indicating whether to use the new query run experience which involves
+ * using a new database panel.
+ */
+const NEW_QUERY_RUN_EXPERIENCE = new Setting(
+  "newQueryRunExperience",
+  ROOT_SETTING,
+);
+
+export function isNewQueryRunExperienceEnabled(): boolean {
+  return !!NEW_QUERY_RUN_EXPERIENCE.getValue<boolean>();
+}
+
+// Settings for mocking the GitHub API.
+const MOCK_GH_API_SERVER = new Setting("mockGitHubApiServer", ROOT_SETTING);
+
+/**
+ * A flag indicating whether to enable a mock GitHub API server.
+ */
+const MOCK_GH_API_SERVER_ENABLED = new Setting("enabled", MOCK_GH_API_SERVER);
+
+/**
+ * A path to a directory containing test scenarios. If this setting is not set,
+ * the mock server will a default location for test scenarios in dev mode, and
+ * will show a menu to select a directory in production mode.
+ */
+const MOCK_GH_API_SERVER_SCENARIOS_PATH = new Setting(
+  "scenariosPath",
+  MOCK_GH_API_SERVER,
+);
+
+export interface MockGitHubApiConfig {
+  mockServerEnabled: boolean;
+  mockScenariosPath: string;
+  onDidChangeConfiguration: Event<void>;
+}
+
+export class MockGitHubApiConfigListener
+  extends ConfigListener
+  implements MockGitHubApiConfig
+{
+  protected handleDidChangeConfiguration(e: ConfigurationChangeEvent): void {
+    this.handleDidChangeConfigurationForRelevantSettings(
+      [MOCK_GH_API_SERVER],
+      e,
+    );
+  }
+
+  public get mockServerEnabled(): boolean {
+    return !!MOCK_GH_API_SERVER_ENABLED.getValue<boolean>();
+  }
+
+  public get mockScenariosPath(): string {
+    return MOCK_GH_API_SERVER_SCENARIOS_PATH.getValue<string>();
+  }
+}
+
+export function getMockGitHubApiServerScenariosPath(): string | undefined {
+  return MOCK_GH_API_SERVER_SCENARIOS_PATH.getValue<string>();
 }

extensions/ql-vscode/src/contextual/astBuilder.ts

@@ -1,23 +1,23 @@
-import { QueryWithResults } from '../run-queries';
-import { CodeQLCliServer } from '../cli';
-import { DecodedBqrsChunk, BqrsId, EntityValue } from '../pure/bqrs-cli-types';
-import { DatabaseItem } from '../databases';
-import { ChildAstItem, AstItem } from '../astViewer';
-import fileRangeFromURI from './fileRangeFromURI';
+import { CodeQLCliServer } from "../cli";
+import { DecodedBqrsChunk, BqrsId, EntityValue } from "../pure/bqrs-cli-types";
+import { DatabaseItem } from "../databases";
+import { ChildAstItem, AstItem } from "../astViewer";
+import fileRangeFromURI from "./fileRangeFromURI";
+import { Uri } from "vscode";
+import { QueryWithResults } from "../run-queries-shared";
 
 /**
  * A class that wraps a tree of QL results from a query that
  * has an @kind of graph
  */
 export default class AstBuilder {
-
   private roots: AstItem[] | undefined;
   private bqrsPath: string;
   constructor(
     queryResults: QueryWithResults,
     private cli: CodeQLCliServer,
     public db: DatabaseItem,
-    public fileName: string
+    public fileName: Uri,
   ) {
     this.bqrsPath = queryResults.query.resultsPaths.resultsPath;
   }
@@ -30,15 +30,15 @@ export default class AstBuilder {
   }
 
   private async parseRoots(): Promise<AstItem[]> {
-    const options = { entities: ['id', 'url', 'string'] };
+    const options = { entities: ["id", "url", "string"] };
     const [nodeTuples, edgeTuples, graphProperties] = await Promise.all([
-      await this.cli.bqrsDecode(this.bqrsPath, 'nodes', options),
-      await this.cli.bqrsDecode(this.bqrsPath, 'edges', options),
-      await this.cli.bqrsDecode(this.bqrsPath, 'graphProperties', options),
+      await this.cli.bqrsDecode(this.bqrsPath, "nodes", options),
+      await this.cli.bqrsDecode(this.bqrsPath, "edges", options),
+      await this.cli.bqrsDecode(this.bqrsPath, "graphProperties", options),
     ]);
 
     if (!this.isValidGraph(graphProperties)) {
-      throw new Error('AST is invalid');
+      throw new Error("AST is invalid");
     }
 
     const idToItem = new Map<BqrsId, AstItem>();
@@ -49,21 +49,26 @@ export default class AstBuilder {
     const roots = [];
 
     // Build up the parent-child relationships
-    edgeTuples.tuples.forEach(tuple => {
-      const [source, target, tupleType, value] = tuple as [EntityValue, EntityValue, string, string];
+    edgeTuples.tuples.forEach((tuple) => {
+      const [source, target, tupleType, value] = tuple as [
+        EntityValue,
+        EntityValue,
+        string,
+        string,
+      ];
       const sourceId = source.id!;
       const targetId = target.id!;
 
       switch (tupleType) {
-        case 'semmle.order':
+        case "semmle.order":
           astOrder.set(targetId, Number(value));
           break;
 
-        case 'semmle.label': {
+        case "semmle.label": {
           childToParent.set(targetId, sourceId);
           let children = parentToChildren.get(sourceId);
           if (!children) {
-            parentToChildren.set(sourceId, children = []);
+            parentToChildren.set(sourceId, (children = []));
           }
           children.push(targetId);
 
@@ -80,39 +85,43 @@ export default class AstBuilder {
     });
 
     // populate parents and children
-    nodeTuples.tuples.forEach(tuple => {
+    nodeTuples.tuples.forEach((tuple) => {
       const [entity, tupleType, value] = tuple as [EntityValue, string, string];
       const id = entity.id!;
 
       switch (tupleType) {
-        case 'semmle.order':
+        case "semmle.order":
           astOrder.set(id, Number(value));
           break;
 
-        case 'semmle.label': {
+        case "semmle.label": {
           // If an edge label exists, include it and separate from the node label using ':'
           const nodeLabel = value ?? entity.label;
           const edgeLabel = edgeLabels.get(id);
-          const label = [edgeLabel, nodeLabel].filter(e => e).join(': ');
+          const label = [edgeLabel, nodeLabel].filter((e) => e).join(": ");
           const item = {
             id,
             label,
             location: entity.url,
             fileLocation: fileRangeFromURI(entity.url, this.db),
             children: [] as ChildAstItem[],
-            order: Number.MAX_SAFE_INTEGER
+            order: Number.MAX_SAFE_INTEGER,
           };
 
           idToItem.set(id, item);
-          const parent = idToItem.get(childToParent.has(id) ? childToParent.get(id)! : -1);
+          const parent = idToItem.get(
+            childToParent.has(id) ? childToParent.get(id)! : -1,
+          );
 
           if (parent) {
             const astItem = item as ChildAstItem;
             astItem.parent = parent;
             parent.children.push(astItem);
           }
-          const children = parentToChildren.has(id) ? parentToChildren.get(id)! : [];
-          children.forEach(childId => {
+          const children = parentToChildren.has(id)
+            ? parentToChildren.get(id)!
+            : [];
+          children.forEach((childId) => {
             const child = idToItem.get(childId) as ChildAstItem | undefined;
             if (child) {
               child.parent = item;
@@ -133,7 +142,7 @@ export default class AstBuilder {
         ? astOrder.get(item.id)!
         : Number.MAX_SAFE_INTEGER;
 
-      if (!('parent' in item)) {
+      if (!("parent" in item)) {
         roots.push(item);
       }
     }
@@ -141,7 +150,9 @@ export default class AstBuilder {
   }
 
   private isValidGraph(graphProperties: DecodedBqrsChunk) {
-    const tuple = graphProperties?.tuples?.find(t => t[0] === 'semmle.graphKind');
-    return tuple?.[1] === 'tree';
+    const tuple = graphProperties?.tuples?.find(
+      (t) => t[0] === "semmle.graphKind",
+    );
+    return tuple?.[1] === "tree";
   }
 }

extensions/ql-vscode/src/contextual/fileRangeFromURI.ts

@@ -1,26 +1,30 @@
-import * as vscode from 'vscode';
+import * as vscode from "vscode";
 
-import { UrlValue, LineColumnLocation } from '../pure/bqrs-cli-types';
-import { isEmptyPath } from '../pure/bqrs-utils';
-import { DatabaseItem } from '../databases';
+import { UrlValue, LineColumnLocation } from "../pure/bqrs-cli-types";
+import { isEmptyPath } from "../pure/bqrs-utils";
+import { DatabaseItem } from "../databases";
 
-
-export default function fileRangeFromURI(uri: UrlValue | undefined, db: DatabaseItem): vscode.Location | undefined {
-  if (!uri || typeof uri === 'string') {
+export default function fileRangeFromURI(
+  uri: UrlValue | undefined,
+  db: DatabaseItem,
+): vscode.Location | undefined {
+  if (!uri || typeof uri === "string") {
     return undefined;
-  } else if ('startOffset' in uri) {
+  } else if ("startOffset" in uri) {
     return undefined;
   } else {
     const loc = uri as LineColumnLocation;
     if (isEmptyPath(loc.uri)) {
       return undefined;
     }
-    const range = new vscode.Range(Math.max(0, (loc.startLine || 0) - 1),
+    const range = new vscode.Range(
+      Math.max(0, (loc.startLine || 0) - 1),
       Math.max(0, (loc.startColumn || 0) - 1),
       Math.max(0, (loc.endLine || 0) - 1),
-      Math.max(0, (loc.endColumn || 0)));
+      Math.max(0, loc.endColumn || 0),
+    );
     try {
-      if (uri.uri.startsWith('file:')) {
+      if (uri.uri.startsWith("file:")) {
         return new vscode.Location(db.resolveSourceFile(uri.uri), range);
       }
       return undefined;

extensions/ql-vscode/src/contextual/keyType.ts

@@ -1,28 +1,33 @@
 export enum KeyType {
-  DefinitionQuery = 'DefinitionQuery',
-  ReferenceQuery = 'ReferenceQuery',
-  PrintAstQuery = 'PrintAstQuery',
+  DefinitionQuery = "DefinitionQuery",
+  ReferenceQuery = "ReferenceQuery",
+  PrintAstQuery = "PrintAstQuery",
+  PrintCfgQuery = "PrintCfgQuery",
 }
 
 export function tagOfKeyType(keyType: KeyType): string {
   switch (keyType) {
     case KeyType.DefinitionQuery:
-      return 'ide-contextual-queries/local-definitions';
+      return "ide-contextual-queries/local-definitions";
     case KeyType.ReferenceQuery:
-      return 'ide-contextual-queries/local-references';
+      return "ide-contextual-queries/local-references";
     case KeyType.PrintAstQuery:
-      return 'ide-contextual-queries/print-ast';
+      return "ide-contextual-queries/print-ast";
+    case KeyType.PrintCfgQuery:
+      return "ide-contextual-queries/print-cfg";
   }
 }
 
 export function nameOfKeyType(keyType: KeyType): string {
   switch (keyType) {
     case KeyType.DefinitionQuery:
-      return 'definitions';
+      return "definitions";
     case KeyType.ReferenceQuery:
-      return 'references';
+      return "references";
     case KeyType.PrintAstQuery:
-      return 'print AST';
+      return "print AST";
+    case KeyType.PrintCfgQuery:
+      return "print CFG";
   }
 }
 
@@ -30,8 +35,9 @@ export function kindOfKeyType(keyType: KeyType): string {
   switch (keyType) {
     case KeyType.DefinitionQuery:
     case KeyType.ReferenceQuery:
-      return 'definitions';
+      return "definitions";
     case KeyType.PrintAstQuery:
-      return 'graph';
+    case KeyType.PrintCfgQuery:
+      return "graph";
   }
 }

extensions/ql-vscode/src/contextual/locationFinder.ts

@@ -1,22 +1,32 @@
-import * as vscode from 'vscode';
+import {
+  decodeSourceArchiveUri,
+  encodeArchiveBasePath,
+} from "../archive-filesystem-provider";
+import {
+  ColumnKindCode,
+  EntityValue,
+  getResultSetSchema,
+  ResultSetSchema,
+} from "../pure/bqrs-cli-types";
+import { CodeQLCliServer } from "../cli";
+import { DatabaseManager, DatabaseItem } from "../databases";
+import fileRangeFromURI from "./fileRangeFromURI";
+import { ProgressCallback } from "../commandRunner";
+import { KeyType } from "./keyType";
+import {
+  qlpackOfDatabase,
+  resolveQueries,
+  runContextualQuery,
+} from "./queryResolver";
+import { CancellationToken, LocationLink, Uri } from "vscode";
+import { QueryWithResults } from "../run-queries-shared";
+import { QueryRunner } from "../queryRunner";
 
-import { decodeSourceArchiveUri, encodeArchiveBasePath } from '../archive-filesystem-provider';
-import { ColumnKindCode, EntityValue, getResultSetSchema, ResultSetSchema } from '../pure/bqrs-cli-types';
-import { CodeQLCliServer } from '../cli';
-import { DatabaseManager, DatabaseItem } from '../databases';
-import fileRangeFromURI from './fileRangeFromURI';
-import * as messages from '../pure/messages';
-import { QueryServerClient } from '../queryserver-client';
-import { QueryWithResults, compileAndRunQueryAgainstDatabase } from '../run-queries';
-import { ProgressCallback } from '../commandRunner';
-import { KeyType } from './keyType';
-import { qlpackOfDatabase, resolveQueries } from './queryResolver';
+export const SELECT_QUERY_NAME = "#select";
+export const TEMPLATE_NAME = "selectedSourceFile";
 
-export const SELECT_QUERY_NAME = '#select';
-export const TEMPLATE_NAME = 'selectedSourceFile';
-
-export interface FullLocationLink extends vscode.LocationLink {
-  originUri: vscode.Uri;
+export interface FullLocationLink extends LocationLink {
+  originUri: Uri;
 }
 
 /**
@@ -29,21 +39,23 @@ export interface FullLocationLink extends vscode.LocationLink {
  * @param dbm The database manager
  * @param uriString The selected source file and location
  * @param keyType The contextual query type to run
+ * @param queryStorageDir The directory to store the query results
  * @param progress A progress callback
  * @param token A CancellationToken
  * @param filter A function that will filter extraneous results
  */
 export async function getLocationsForUriString(
   cli: CodeQLCliServer,
-  qs: QueryServerClient,
+  qs: QueryRunner,
   dbm: DatabaseManager,
   uriString: string,
   keyType: KeyType,
+  queryStorageDir: string,
   progress: ProgressCallback,
-  token: vscode.CancellationToken,
-  filter: (src: string, dest: string) => boolean
+  token: CancellationToken,
+  filter: (src: string, dest: string) => boolean,
 ): Promise<FullLocationLink[]> {
-  const uri = decodeSourceArchiveUri(vscode.Uri.parse(uriString, true));
+  const uri = decodeSourceArchiveUri(Uri.parse(uriString, true));
   const sourceArchiveUri = encodeArchiveBasePath(uri.sourceArchiveZipPath);
 
   const db = dbm.findDatabaseItemBySourceArchive(sourceArchiveUri);
@@ -56,19 +68,18 @@ export async function getLocationsForUriString(
 
   const links: FullLocationLink[] = [];
   for (const query of await resolveQueries(cli, qlpack, keyType)) {
-    const results = await compileAndRunQueryAgainstDatabase(
-      cli,
-      qs,
+    const results = await runContextualQuery(
+      query,
       db,
-      false,
-      vscode.Uri.file(query),
+      queryStorageDir,
+      qs,
+      cli,
       progress,
       token,
-      templates
+      templates,
     );
-
-    if (results.result.resultType == messages.QueryResultType.SUCCESS) {
-      links.push(...await getLinksFromResults(results, cli, db, filter));
+    if (results.successful) {
+      links.push(...(await getLinksFromResults(results, cli, db, filter)));
     }
   }
   return links;
@@ -78,7 +89,7 @@ async function getLinksFromResults(
   results: QueryWithResults,
   cli: CodeQLCliServer,
   db: DatabaseItem,
-  filter: (srcFile: string, destFile: string) => boolean
+  filter: (srcFile: string, destFile: string) => boolean,
 ): Promise<FullLocationLink[]> {
   const localLinks: FullLocationLink[] = [];
   const bqrsPath = results.query.resultsPaths.resultsPath;
@@ -91,12 +102,16 @@ async function getLinksFromResults(
       const [src, dest] = tuple as [EntityValue, EntityValue];
       const srcFile = src.url && fileRangeFromURI(src.url, db);
       const destFile = dest.url && fileRangeFromURI(dest.url, db);
-      if (srcFile && destFile && filter(srcFile.uri.toString(), destFile.uri.toString())) {
+      if (
+        srcFile &&
+        destFile &&
+        filter(srcFile.uri.toString(), destFile.uri.toString())
+      ) {
         localLinks.push({
           targetRange: destFile.range,
           targetUri: destFile.uri,
           originSelectionRange: srcFile.range,
-          originUri: srcFile.uri
+          originUri: srcFile.uri,
         });
       }
     }
@@ -104,21 +119,18 @@ async function getLinksFromResults(
   return localLinks;
 }
 
-function createTemplates(path: string): messages.TemplateDefinitions {
+function createTemplates(path: string): Record<string, string> {
   return {
-    [TEMPLATE_NAME]: {
-      values: {
-        tuples: [[{
-          stringValue: path
-        }]]
-      }
-    }
+    [TEMPLATE_NAME]: path,
   };
 }
 
 function isValidSelect(selectInfo: ResultSetSchema | undefined) {
-  return selectInfo && selectInfo.columns.length == 3
-    && selectInfo.columns[0].kind == ColumnKindCode.ENTITY
-    && selectInfo.columns[1].kind == ColumnKindCode.ENTITY
-    && selectInfo.columns[2].kind == ColumnKindCode.STRING;
+  return (
+    selectInfo &&
+    selectInfo.columns.length == 3 &&
+    selectInfo.columns[0].kind == ColumnKindCode.ENTITY &&
+    selectInfo.columns[1].kind == ColumnKindCode.ENTITY &&
+    selectInfo.columns[2].kind == ColumnKindCode.STRING
+  );
 }

extensions/ql-vscode/src/contextual/queryResolver.ts

@@ -1,21 +1,25 @@
-import * as fs from 'fs-extra';
-import * as yaml from 'js-yaml';
-import * as tmp from 'tmp-promise';
+import * as fs from "fs-extra";
+import * as yaml from "js-yaml";
+import * as tmp from "tmp-promise";
+import * as path from "path";
 
-import * as helpers from '../helpers';
-import {
-  KeyType,
-  kindOfKeyType,
-  nameOfKeyType,
-  tagOfKeyType
-} from './keyType';
-import { CodeQLCliServer } from '../cli';
-import { DatabaseItem } from '../databases';
-import { QlPacksForLanguage } from '../helpers';
+import * as helpers from "../helpers";
+import { KeyType, kindOfKeyType, nameOfKeyType, tagOfKeyType } from "./keyType";
+import { CodeQLCliServer } from "../cli";
+import { DatabaseItem } from "../databases";
+import { QlPacksForLanguage } from "../helpers";
+import { logger } from "../logging";
+import { createInitialQueryInfo } from "../run-queries-shared";
+import { CancellationToken, Uri } from "vscode";
+import { ProgressCallback } from "../commandRunner";
+import { QueryRunner } from "../queryRunner";
 
-export async function qlpackOfDatabase(cli: CodeQLCliServer, db: DatabaseItem): Promise<QlPacksForLanguage> {
+export async function qlpackOfDatabase(
+  cli: CodeQLCliServer,
+  db: DatabaseItem,
+): Promise<QlPacksForLanguage> {
   if (db.contents === undefined) {
-    throw new Error('Database is invalid and cannot infer QLPack.');
+    throw new Error("Database is invalid and cannot infer QLPack.");
   }
   const datasetPath = db.contents.datasetUri.fsPath;
   const dbscheme = await helpers.getPrimaryDbscheme(datasetPath);
@@ -30,29 +34,43 @@ export async function qlpackOfDatabase(cli: CodeQLCliServer, db: DatabaseItem):
  * @param keyType The contextual query key of the query to search for.
  * @returns The found queries from the first pack in which any matching queries were found.
  */
-async function resolveQueriesFromPacks(cli: CodeQLCliServer, qlpacks: string[], keyType: KeyType): Promise<string[]> {
-  const suiteFile = (await tmp.file({
-    postfix: '.qls'
-  })).path;
+async function resolveQueriesFromPacks(
+  cli: CodeQLCliServer,
+  qlpacks: string[],
+  keyType: KeyType,
+): Promise<string[]> {
+  const suiteFile = (
+    await tmp.file({
+      postfix: ".qls",
+    })
+  ).path;
   const suiteYaml = [];
   for (const qlpack of qlpacks) {
     suiteYaml.push({
       from: qlpack,
-      queries: '.',
+      queries: ".",
       include: {
         kind: kindOfKeyType(keyType),
-        'tags contain': tagOfKeyType(keyType)
-      }
+        "tags contain": tagOfKeyType(keyType),
+      },
     });
   }
-  await fs.writeFile(suiteFile, yaml.safeDump(suiteYaml), 'utf8');
+  await fs.writeFile(suiteFile, yaml.dump(suiteYaml), "utf8");
 
-  const queries = await cli.resolveQueriesInSuite(suiteFile, helpers.getOnDiskWorkspaceFolders());
+  const queries = await cli.resolveQueriesInSuite(
+    suiteFile,
+    helpers.getOnDiskWorkspaceFolders(),
+  );
   return queries;
 }
 
-export async function resolveQueries(cli: CodeQLCliServer, qlpacks: QlPacksForLanguage, keyType: KeyType): Promise<string[]> {
-  const cliCanHandleLibraryPack = await cli.cliConstraints.supportsAllowLibraryPacksInResolveQueries();
+export async function resolveQueries(
+  cli: CodeQLCliServer,
+  qlpacks: QlPacksForLanguage,
+  keyType: KeyType,
+): Promise<string[]> {
+  const cliCanHandleLibraryPack =
+    await cli.cliConstraints.supportsAllowLibraryPacksInResolveQueries();
   const packsToSearch: string[] = [];
   let blameCli: boolean;
 
@@ -92,15 +110,121 @@ export async function resolveQueries(cli: CodeQLCliServer, qlpacks: QlPacksForLa
   }
 
   // No queries found. Determine the correct error message for the various scenarios.
-  const errorMessage = blameCli ?
-    `Your current version of the CodeQL CLI, '${(await cli.getVersion()).version}', \
+  const errorMessage = blameCli
+    ? `Your current version of the CodeQL CLI, '${
+        (await cli.getVersion()).version
+      }', \
     is unable to use contextual queries from recent versions of the standard CodeQL libraries. \
     Please upgrade to the latest version of the CodeQL CLI.`
-    :
-    `No ${nameOfKeyType(keyType)} queries (tagged "${tagOfKeyType(keyType)}") could be found in the current library path. \
-    Try upgrading the CodeQL libraries. If that doesn't work, then ${nameOfKeyType(keyType)} queries are not yet available \
+    : `No ${nameOfKeyType(keyType)} queries (tagged "${tagOfKeyType(
+        keyType,
+      )}") could be found in the current library path. \
+    Try upgrading the CodeQL libraries. If that doesn't work, then ${nameOfKeyType(
+      keyType,
+    )} queries are not yet available \
     for this language.`;
 
   void helpers.showAndLogErrorMessage(errorMessage);
-  throw new Error(`Couldn't find any queries tagged ${tagOfKeyType(keyType)} in any of the following packs: ${packsToSearch.join(', ')}.`);
+  throw new Error(
+    `Couldn't find any queries tagged ${tagOfKeyType(
+      keyType,
+    )} in any of the following packs: ${packsToSearch.join(", ")}.`,
+  );
+}
+
+async function resolveContextualQuery(
+  cli: CodeQLCliServer,
+  query: string,
+): Promise<{ packPath: string; createdTempLockFile: boolean }> {
+  // Contextual queries now live within the standard library packs.
+  // This simplifies distribution (you don't need the standard query pack to use the AST viewer),
+  // but if the library pack doesn't have a lockfile, we won't be able to find
+  // other pack dependencies of the library pack.
+
+  // Work out the enclosing pack.
+  const packContents = await cli.packPacklist(query, false);
+  const packFilePath = packContents.find((p) =>
+    ["codeql-pack.yml", "qlpack.yml"].includes(path.basename(p)),
+  );
+  if (packFilePath === undefined) {
+    // Should not happen; we already resolved this query.
+    throw new Error(
+      `Could not find a CodeQL pack file for the pack enclosing the contextual query ${query}`,
+    );
+  }
+  const packPath = path.dirname(packFilePath);
+  const lockFilePath = packContents.find((p) =>
+    ["codeql-pack.lock.yml", "qlpack.lock.yml"].includes(path.basename(p)),
+  );
+  let createdTempLockFile = false;
+  if (!lockFilePath) {
+    // No lock file, likely because this library pack is in the package cache.
+    // Create a lock file so that we can resolve dependencies and library path
+    // for the contextual query.
+    void logger.log(
+      `Library pack ${packPath} is missing a lock file; creating a temporary lock file`,
+    );
+    await cli.packResolveDependencies(packPath);
+    createdTempLockFile = true;
+    // Clear CLI server pack cache before installing dependencies,
+    // so that it picks up the new lock file, not the previously cached pack.
+    void logger.log("Clearing the CodeQL CLI server's pack cache");
+    await cli.clearCache();
+    // Install dependencies.
+    void logger.log(
+      `Installing package dependencies for library pack ${packPath}`,
+    );
+    await cli.packInstall(packPath);
+  }
+  return { packPath, createdTempLockFile };
+}
+
+async function removeTemporaryLockFile(packPath: string) {
+  const tempLockFilePath = path.resolve(packPath, "codeql-pack.lock.yml");
+  void logger.log(
+    `Deleting temporary package lock file at ${tempLockFilePath}`,
+  );
+  // It's fine if the file doesn't exist.
+  await fs.promises.rm(path.resolve(packPath, "codeql-pack.lock.yml"), {
+    force: true,
+  });
+}
+
+export async function runContextualQuery(
+  query: string,
+  db: DatabaseItem,
+  queryStorageDir: string,
+  qs: QueryRunner,
+  cli: CodeQLCliServer,
+  progress: ProgressCallback,
+  token: CancellationToken,
+  templates: Record<string, string>,
+) {
+  const { packPath, createdTempLockFile } = await resolveContextualQuery(
+    cli,
+    query,
+  );
+  const initialInfo = await createInitialQueryInfo(
+    Uri.file(query),
+    {
+      name: db.name,
+      databaseUri: db.databaseUri.toString(),
+    },
+    false,
+  );
+  void logger.log(
+    `Running contextual query ${query}; results will be stored in ${queryStorageDir}`,
+  );
+  const queryResult = await qs.compileAndRunQueryAgainstDatabase(
+    db,
+    initialInfo,
+    queryStorageDir,
+    progress,
+    token,
+    templates,
+  );
+  if (createdTempLockFile) {
+    await removeTemporaryLockFile(packPath);
+  }
+  return queryResult;
 }

extensions/ql-vscode/src/contextual/templateProvider.ts

@@ -8,44 +8,59 @@ import {
   ReferenceContext,
   ReferenceProvider,
   TextDocument,
-  Uri
-} from 'vscode';
+  Uri,
+} from "vscode";
 
-import { decodeSourceArchiveUri, encodeArchiveBasePath, zipArchiveScheme } from '../archive-filesystem-provider';
-import { CodeQLCliServer } from '../cli';
-import { DatabaseManager } from '../databases';
-import { CachedOperation } from '../helpers';
-import { ProgressCallback, withProgress } from '../commandRunner';
-import * as messages from '../pure/messages';
-import { QueryServerClient } from '../queryserver-client';
-import { compileAndRunQueryAgainstDatabase, QueryWithResults } from '../run-queries';
-import AstBuilder from './astBuilder';
 import {
-  KeyType,
-} from './keyType';
-import { FullLocationLink, getLocationsForUriString, TEMPLATE_NAME } from './locationFinder';
-import { qlpackOfDatabase, resolveQueries } from './queryResolver';
-import { isCanary, NO_CACHE_AST_VIEWER } from '../config';
+  decodeSourceArchiveUri,
+  encodeArchiveBasePath,
+  zipArchiveScheme,
+} from "../archive-filesystem-provider";
+import { CodeQLCliServer } from "../cli";
+import { DatabaseManager } from "../databases";
+import { CachedOperation } from "../helpers";
+import { ProgressCallback, withProgress } from "../commandRunner";
+import AstBuilder from "./astBuilder";
+import { KeyType } from "./keyType";
+import {
+  FullLocationLink,
+  getLocationsForUriString,
+  TEMPLATE_NAME,
+} from "./locationFinder";
+import {
+  qlpackOfDatabase,
+  resolveQueries,
+  runContextualQuery,
+} from "./queryResolver";
+import { isCanary, NO_CACHE_AST_VIEWER } from "../config";
+import { QueryWithResults } from "../run-queries-shared";
+import { QueryRunner } from "../queryRunner";
 
 /**
- * Run templated CodeQL queries to find definitions and references in
+ * Runs templated CodeQL queries to find definitions in
  * source-language files. We may eventually want to find a way to
  * generalize this to other custom queries, e.g. showing dataflow to
  * or from a selected identifier.
  */
-
 export class TemplateQueryDefinitionProvider implements DefinitionProvider {
   private cache: CachedOperation<LocationLink[]>;
 
   constructor(
     private cli: CodeQLCliServer,
-    private qs: QueryServerClient,
+    private qs: QueryRunner,
     private dbm: DatabaseManager,
+    private queryStorageDir: string,
   ) {
-    this.cache = new CachedOperation<LocationLink[]>(this.getDefinitions.bind(this));
+    this.cache = new CachedOperation<LocationLink[]>(
+      this.getDefinitions.bind(this),
+    );
   }
 
-  async provideDefinition(document: TextDocument, position: Position, _token: CancellationToken): Promise<LocationLink[]> {
+  async provideDefinition(
+    document: TextDocument,
+    position: Position,
+    _token: CancellationToken,
+  ): Promise<LocationLink[]> {
     const fileLinks = await this.cache.get(document.uri.toString());
     const locLinks: LocationLink[] = [];
     for (const link of fileLinks) {
@@ -57,99 +72,132 @@ export class TemplateQueryDefinitionProvider implements DefinitionProvider {
   }
 
   private async getDefinitions(uriString: string): Promise<LocationLink[]> {
-    return withProgress({
-      location: ProgressLocation.Notification,
-      cancellable: true,
-      title: 'Finding definitions'
-    }, async (progress, token) => {
-      return getLocationsForUriString(
-        this.cli,
-        this.qs,
-        this.dbm,
-        uriString,
-        KeyType.DefinitionQuery,
-        progress,
-        token,
-        (src, _dest) => src === uriString
-      );
-    });
+    return withProgress(
+      {
+        location: ProgressLocation.Notification,
+        cancellable: true,
+        title: "Finding definitions",
+      },
+      async (progress, token) => {
+        return getLocationsForUriString(
+          this.cli,
+          this.qs,
+          this.dbm,
+          uriString,
+          KeyType.DefinitionQuery,
+          this.queryStorageDir,
+          progress,
+          token,
+          (src, _dest) => src === uriString,
+        );
+      },
+    );
   }
 }
 
+/**
+ * Runs templated CodeQL queries to find references in
+ * source-language files. We may eventually want to find a way to
+ * generalize this to other custom queries, e.g. showing dataflow to
+ * or from a selected identifier.
+ */
 export class TemplateQueryReferenceProvider implements ReferenceProvider {
   private cache: CachedOperation<FullLocationLink[]>;
 
   constructor(
     private cli: CodeQLCliServer,
-    private qs: QueryServerClient,
+    private qs: QueryRunner,
     private dbm: DatabaseManager,
+    private queryStorageDir: string,
   ) {
-    this.cache = new CachedOperation<FullLocationLink[]>(this.getReferences.bind(this));
+    this.cache = new CachedOperation<FullLocationLink[]>(
+      this.getReferences.bind(this),
+    );
   }
 
   async provideReferences(
     document: TextDocument,
     position: Position,
     _context: ReferenceContext,
-    _token: CancellationToken
+    _token: CancellationToken,
   ): Promise<Location[]> {
     const fileLinks = await this.cache.get(document.uri.toString());
     const locLinks: Location[] = [];
     for (const link of fileLinks) {
       if (link.targetRange!.contains(position)) {
-        locLinks.push({ range: link.originSelectionRange!, uri: link.originUri });
+        locLinks.push({
+          range: link.originSelectionRange!,
+          uri: link.originUri,
+        });
       }
     }
     return locLinks;
   }
 
   private async getReferences(uriString: string): Promise<FullLocationLink[]> {
-    return withProgress({
-      location: ProgressLocation.Notification,
-      cancellable: true,
-      title: 'Finding references'
-    }, async (progress, token) => {
-      return getLocationsForUriString(
-        this.cli,
-        this.qs,
-        this.dbm,
-        uriString,
-        KeyType.DefinitionQuery,
-        progress,
-        token,
-        (src, _dest) => src === uriString
-      );
-    });
+    return withProgress(
+      {
+        location: ProgressLocation.Notification,
+        cancellable: true,
+        title: "Finding references",
+      },
+      async (progress, token) => {
+        return getLocationsForUriString(
+          this.cli,
+          this.qs,
+          this.dbm,
+          uriString,
+          KeyType.DefinitionQuery,
+          this.queryStorageDir,
+          progress,
+          token,
+          (src, _dest) => src === uriString,
+        );
+      },
+    );
   }
 }
 
+type QueryWithDb = {
+  query: QueryWithResults;
+  dbUri: Uri;
+};
+
+/**
+ * Run templated CodeQL queries to produce AST information for
+ * source-language files.
+ */
 export class TemplatePrintAstProvider {
-  private cache: CachedOperation<QueryWithResults>;
+  private cache: CachedOperation<QueryWithDb>;
 
   constructor(
     private cli: CodeQLCliServer,
-    private qs: QueryServerClient,
+    private qs: QueryRunner,
     private dbm: DatabaseManager,
+    private queryStorageDir: string,
   ) {
-    this.cache = new CachedOperation<QueryWithResults>(this.getAst.bind(this));
+    this.cache = new CachedOperation<QueryWithDb>(this.getAst.bind(this));
   }
 
   async provideAst(
     progress: ProgressCallback,
     token: CancellationToken,
-    document?: TextDocument
+    fileUri?: Uri,
   ): Promise<AstBuilder | undefined> {
-    if (!document) {
-      throw new Error('Cannot view the AST. Please select a valid source file inside a CodeQL database.');
+    if (!fileUri) {
+      throw new Error(
+        "Cannot view the AST. Please select a valid source file inside a CodeQL database.",
+      );
     }
-    const queryResults = this.shouldCache()
-      ? await this.cache.get(document.uri.toString(), progress, token)
-      : await this.getAst(document.uri.toString(), progress, token);
+    const { query, dbUri } = this.shouldCache()
+      ? await this.cache.get(fileUri.toString(), progress, token)
+      : await this.getAst(fileUri.toString(), progress, token);
 
     return new AstBuilder(
-      queryResults, this.cli,
-      this.dbm.findDatabaseItem(Uri.parse(queryResults.database.databaseUri!, true))!,
-      document.fileName
+      query,
+      this.cli,
+      this.dbm.findDatabaseItem(dbUri)!,
+      fileUri,
     );
   }
 
@@ -160,50 +208,128 @@ export class TemplatePrintAstProvider {
   private async getAst(
     uriString: string,
     progress: ProgressCallback,
-    token: CancellationToken
-  ): Promise<QueryWithResults> {
+    token: CancellationToken,
+  ): Promise<QueryWithDb> {
     const uri = Uri.parse(uriString, true);
     if (uri.scheme !== zipArchiveScheme) {
-      throw new Error('Cannot view the AST. Please select a valid source file inside a CodeQL database.');
+      throw new Error(
+        "Cannot view the AST. Please select a valid source file inside a CodeQL database.",
+      );
     }
 
     const zippedArchive = decodeSourceArchiveUri(uri);
-    const sourceArchiveUri = encodeArchiveBasePath(zippedArchive.sourceArchiveZipPath);
+    const sourceArchiveUri = encodeArchiveBasePath(
+      zippedArchive.sourceArchiveZipPath,
+    );
     const db = this.dbm.findDatabaseItemBySourceArchive(sourceArchiveUri);
 
     if (!db) {
-      throw new Error('Can\'t infer database from the provided source.');
+      throw new Error("Can't infer database from the provided source.");
     }
 
     const qlpacks = await qlpackOfDatabase(this.cli, db);
-    const queries = await resolveQueries(this.cli, qlpacks, KeyType.PrintAstQuery);
+    const queries = await resolveQueries(
+      this.cli,
+      qlpacks,
+      KeyType.PrintAstQuery,
+    );
     if (queries.length > 1) {
-      throw new Error('Found multiple Print AST queries. Can\'t continue');
+      throw new Error("Found multiple Print AST queries. Can't continue");
     }
     if (queries.length === 0) {
-      throw new Error('Did not find any Print AST queries. Can\'t continue');
+      throw new Error("Did not find any Print AST queries. Can't continue");
     }
 
     const query = queries[0];
-    const templates: messages.TemplateDefinitions = {
-      [TEMPLATE_NAME]: {
-        values: {
-          tuples: [[{
-            stringValue: zippedArchive.pathWithinSourceArchive
-          }]]
-        }
-      }
+    const templates: Record<string, string> = {
+      [TEMPLATE_NAME]: zippedArchive.pathWithinSourceArchive,
     };
 
-    return await compileAndRunQueryAgainstDatabase(
-      this.cli,
-      this.qs,
+    const queryResult = await runContextualQuery(
+      query,
       db,
-      false,
-      Uri.file(query),
+      this.queryStorageDir,
+      this.qs,
+      this.cli,
       progress,
       token,
-      templates
+      templates,
     );
+    return {
+      query: queryResult,
+      dbUri: db.databaseUri,
+    };
+  }
+}
+
+/**
+ * Run templated CodeQL queries to produce CFG information for
+ * source-language files.
+ */
+export class TemplatePrintCfgProvider {
+  private cache: CachedOperation<[Uri, Record<string, string>] | undefined>;
+
+  constructor(private cli: CodeQLCliServer, private dbm: DatabaseManager) {
+    this.cache = new CachedOperation<[Uri, Record<string, string>] | undefined>(
+      this.getCfgUri.bind(this),
+    );
+  }
+
+  async provideCfgUri(
+    document?: TextDocument,
+  ): Promise<[Uri, Record<string, string>] | undefined> {
+    if (!document) {
+      return;
+    }
+    return await this.cache.get(document.uri.toString());
+  }
+
+  private async getCfgUri(
+    uriString: string,
+  ): Promise<[Uri, Record<string, string>]> {
+    const uri = Uri.parse(uriString, true);
+    if (uri.scheme !== zipArchiveScheme) {
+      throw new Error(
+        "CFG Viewing is only available for databases with zipped source archives.",
+      );
+    }
+
+    const zippedArchive = decodeSourceArchiveUri(uri);
+    const sourceArchiveUri = encodeArchiveBasePath(
+      zippedArchive.sourceArchiveZipPath,
+    );
+    const db = this.dbm.findDatabaseItemBySourceArchive(sourceArchiveUri);
+
+    if (!db) {
+      throw new Error("Can't infer database from the provided source.");
+    }
+
+    const qlpack = await qlpackOfDatabase(this.cli, db);
+    if (!qlpack) {
+      throw new Error("Can't infer qlpack from database source archive.");
+    }
+    const queries = await resolveQueries(
+      this.cli,
+      qlpack,
+      KeyType.PrintCfgQuery,
+    );
+    if (queries.length > 1) {
+      throw new Error(
+        `Found multiple Print CFG queries. Can't continue. Make sure there is exacly one query with the tag ${KeyType.PrintCfgQuery}`,
+      );
+    }
+    if (queries.length === 0) {
+      throw new Error(
+        `Did not find any Print CFG queries. Can't continue. Make sure there is exacly one query with the tag ${KeyType.PrintCfgQuery}`,
+      );
+    }
+
+    const queryUri = Uri.file(queries[0]);
+
+    const templates: Record<string, string> = {
+      [TEMPLATE_NAME]: zippedArchive.pathWithinSourceArchive,
+    };
+
+    return [queryUri, templates];
   }
 }

extensions/ql-vscode/src/databaseFetcher.ts

@@ -1,26 +1,20 @@
-import fetch, { Response } from 'node-fetch';
-import { zip } from 'zip-a-folder';
-import * as unzipper from 'unzipper';
-import {
-  Uri,
-  CancellationToken,
-  commands,
-  window,
-} from 'vscode';
-import { CodeQLCliServer } from './cli';
-import * as fs from 'fs-extra';
-import * as path from 'path';
+import fetch, { Response } from "node-fetch";
+import { zip } from "zip-a-folder";
+import * as unzipper from "unzipper";
+import { Uri, CancellationToken, commands, window } from "vscode";
+import { CodeQLCliServer } from "./cli";
+import * as fs from "fs-extra";
+import * as path from "path";
+import * as Octokit from "@octokit/rest";
+import { retry } from "@octokit/plugin-retry";
 
-import { DatabaseManager, DatabaseItem } from './databases';
-import {
-  showAndLogInformationMessage,
-} from './helpers';
-import {
-  reportStreamProgress,
-  ProgressCallback,
-} from './commandRunner';
-import { logger } from './logging';
-import { tmpDir } from './run-queries';
+import { DatabaseManager, DatabaseItem } from "./databases";
+import { showAndLogInformationMessage } from "./helpers";
+import { reportStreamProgress, ProgressCallback } from "./commandRunner";
+import { logger } from "./logging";
+import { tmpDir } from "./helpers";
+import { Credentials } from "./authentication";
+import { REPO_REGEX, getErrorMessage } from "./pure/helpers-pure";
 
 /**
  * Prompts a user to fetch a database from a remote location. Database is assumed to be an archive file.
@@ -33,10 +27,10 @@ export async function promptImportInternetDatabase(
   storagePath: string,
   progress: ProgressCallback,
   token: CancellationToken,
-  cli?: CodeQLCliServer
+  cli?: CodeQLCliServer,
 ): Promise<DatabaseItem | undefined> {
   const databaseUrl = await window.showInputBox({
-    prompt: 'Enter URL of zipfile of database to download',
+    prompt: "Enter URL of zipfile of database to download",
   });
   if (!databaseUrl) {
     return;
@@ -46,19 +40,106 @@ export async function promptImportInternetDatabase(
 
   const item = await databaseArchiveFetcher(
     databaseUrl,
+    {},
     databaseManager,
     storagePath,
+    undefined,
     progress,
     token,
-    cli
+    cli,
   );
 
   if (item) {
-    await commands.executeCommand('codeQLDatabases.focus');
-    void showAndLogInformationMessage('Database downloaded and imported successfully.');
+    await commands.executeCommand("codeQLDatabases.focus");
+    void showAndLogInformationMessage(
+      "Database downloaded and imported successfully.",
+    );
   }
   return item;
+}
 
+/**
+ * Prompts a user to fetch a database from GitHub.
+ * User enters a GitHub repository and then the user is asked which language
+ * to download (if there is more than one)
+ *
+ * @param databaseManager the DatabaseManager
+ * @param storagePath where to store the unzipped database.
+ */
+export async function promptImportGithubDatabase(
+  databaseManager: DatabaseManager,
+  storagePath: string,
+  credentials: Credentials | undefined,
+  progress: ProgressCallback,
+  token: CancellationToken,
+  cli?: CodeQLCliServer,
+): Promise<DatabaseItem | undefined> {
+  progress({
+    message: "Choose repository",
+    step: 1,
+    maxStep: 2,
+  });
+  const githubRepo = await window.showInputBox({
+    title:
+      'Enter a GitHub repository URL or "name with owner" (e.g. https://github.com/github/codeql or github/codeql)',
+    placeHolder: "https://github.com/<owner>/<repo> or <owner>/<repo>",
+    ignoreFocusOut: true,
+  });
+  if (!githubRepo) {
+    return;
+  }
+
+  if (!looksLikeGithubRepo(githubRepo)) {
+    throw new Error(`Invalid GitHub repository: ${githubRepo}`);
+  }
+
+  const octokit = credentials
+    ? await credentials.getOctokit(true)
+    : new Octokit.Octokit({ retry });
+
+  const result = await convertGithubNwoToDatabaseUrl(
+    githubRepo,
+    octokit,
+    progress,
+  );
+  if (!result) {
+    return;
+  }
+
+  const { databaseUrl, name, owner } = result;
+
+  /**
+   * The 'token' property of the token object returned by `octokit.auth()`.
+   * The object is undocumented, but looks something like this:
+   * {
+   *   token: 'xxxx',
+   *   tokenType: 'oauth',
+   *   type: 'token',
+   * }
+   * We only need the actual token string.
+   */
+  const octokitToken = ((await octokit.auth()) as { token: string })?.token;
+  const item = await databaseArchiveFetcher(
+    databaseUrl,
+    {
+      Accept: "application/zip",
+      Authorization: octokitToken ? `Bearer ${octokitToken}` : "",
+    },
+    databaseManager,
+    storagePath,
+    `${owner}/${name}`,
+    progress,
+    token,
+    cli,
+  );
+  if (item) {
+    await commands.executeCommand("codeQLDatabases.focus");
+    void showAndLogInformationMessage(
+      "Database downloaded and imported successfully.",
+    );
+    return item;
+  }
+  return;
 }
 
 /**
@@ -74,35 +155,39 @@ export async function promptImportLgtmDatabase(
   storagePath: string,
   progress: ProgressCallback,
   token: CancellationToken,
-  cli?: CodeQLCliServer
+  cli?: CodeQLCliServer,
 ): Promise<DatabaseItem | undefined> {
   progress({
-    message: 'Choose project',
+    message: "Choose project",
     step: 1,
-    maxStep: 2
+    maxStep: 2,
   });
   const lgtmUrl = await window.showInputBox({
     prompt:
-      'Enter the project slug or URL on LGTM (e.g., g/github/codeql or https://lgtm.com/projects/g/github/codeql)',
+      "Enter the project slug or URL on LGTM (e.g., g/github/codeql or https://lgtm.com/projects/g/github/codeql)",
   });
   if (!lgtmUrl) {
     return;
   }
 
   if (looksLikeLgtmUrl(lgtmUrl)) {
-    const databaseUrl = await convertToDatabaseUrl(lgtmUrl, progress);
+    const databaseUrl = await convertLgtmUrlToDatabaseUrl(lgtmUrl, progress);
     if (databaseUrl) {
       const item = await databaseArchiveFetcher(
         databaseUrl,
+        {},
         databaseManager,
         storagePath,
+        undefined,
         progress,
         token,
-        cli
+        cli,
       );
       if (item) {
-        await commands.executeCommand('codeQLDatabases.focus');
-        void showAndLogInformationMessage('Database downloaded and imported successfully.');
+        await commands.executeCommand("codeQLDatabases.focus");
+        void showAndLogInformationMessage(
+          "Database downloaded and imported successfully.",
+        );
       }
       return item;
     }
@@ -114,7 +199,10 @@ export async function promptImportLgtmDatabase(
 
 export async function retrieveCanonicalRepoName(lgtmUrl: string) {
   const givenRepoName = extractProjectSlug(lgtmUrl);
-  const response = await checkForFailingResponse(await fetch(`https://api.github.com/repos/${givenRepoName}`), 'Failed to locate the repository on github');
+  const response = await checkForFailingResponse(
+    await fetch(`https://api.github.com/repos/${givenRepoName}`),
+    "Failed to locate the repository on github",
+  );
   const repo = await response.json();
   if (!repo || !repo.full_name) {
     return;
@@ -140,20 +228,26 @@ export async function importArchiveDatabase(
   try {
     const item = await databaseArchiveFetcher(
       databaseUrl,
+      {},
       databaseManager,
       storagePath,
+      undefined,
       progress,
       token,
-      cli
+      cli,
     );
     if (item) {
-      await commands.executeCommand('codeQLDatabases.focus');
-      void showAndLogInformationMessage('Database unzipped and imported successfully.');
+      await commands.executeCommand("codeQLDatabases.focus");
+      void showAndLogInformationMessage(
+        "Database unzipped and imported successfully.",
+      );
     }
     return item;
   } catch (e) {
-    if (e.message.includes('unexpected end of file')) {
-      throw new Error('Database is corrupt or too large. Try unzipping outside of VS Code and importing the unzipped folder instead.');
+    if (getErrorMessage(e).includes("unexpected end of file")) {
+      throw new Error(
+        "Database is corrupt or too large. Try unzipping outside of VS Code and importing the unzipped folder instead.",
+      );
     } else {
       // delegate
       throw e;
@@ -166,26 +260,30 @@ export async function importArchiveDatabase(
  * or in the local filesystem.
  *
  * @param databaseUrl URL from which to grab the database
+ * @param requestHeaders Headers to send with the request
  * @param databaseManager the DatabaseManager
  * @param storagePath where to store the unzipped database.
+ * @param nameOverride a name for the database that overrides the default
  * @param progress callback to send progress messages to
  * @param token cancellation token
  */
 async function databaseArchiveFetcher(
   databaseUrl: string,
+  requestHeaders: { [key: string]: string },
   databaseManager: DatabaseManager,
   storagePath: string,
+  nameOverride: string | undefined,
   progress: ProgressCallback,
   token: CancellationToken,
   cli?: CodeQLCliServer,
 ): Promise<DatabaseItem> {
   progress({
-    message: 'Getting database',
+    message: "Getting database",
     step: 1,
     maxStep: 4,
   });
   if (!storagePath) {
-    throw new Error('No storage path specified.');
+    throw new Error("No storage path specified.");
   }
   await fs.ensureDir(storagePath);
   const unzipPath = await getStorageFolder(storagePath, databaseUrl);
@@ -193,11 +291,11 @@ async function databaseArchiveFetcher(
   if (isFile(databaseUrl)) {
     await readAndUnzip(databaseUrl, unzipPath, cli, progress);
   } else {
-    await fetchAndUnzip(databaseUrl, unzipPath, cli, progress);
+    await fetchAndUnzip(databaseUrl, requestHeaders, unzipPath, cli, progress);
   }
 
   progress({
-    message: 'Opening database',
+    message: "Opening database",
     step: 3,
     maxStep: 4,
   });
@@ -205,22 +303,27 @@ async function databaseArchiveFetcher(
   // find the path to the database. The actual database might be in a sub-folder
   const dbPath = await findDirWithFile(
     unzipPath,
-    '.dbinfo',
-    'codeql-database.yml'
+    ".dbinfo",
+    "codeql-database.yml",
   );
   if (dbPath) {
     progress({
-      message: 'Validating and fixing source location',
+      message: "Validating and fixing source location",
       step: 4,
       maxStep: 4,
     });
     await ensureZippedSourceLocation(dbPath);
 
-    const item = await databaseManager.openDatabase(progress, token, Uri.file(dbPath));
+    const item = await databaseManager.openDatabase(
+      progress,
+      token,
+      Uri.file(dbPath),
+      nameOverride,
+    );
     await databaseManager.setCurrentDatabaseItem(item);
     return item;
   } else {
-    throw new Error('Database not found in archive.');
+    throw new Error("Database not found in archive.");
   }
 }
 
@@ -232,7 +335,7 @@ async function getStorageFolder(storagePath: string, urlStr: string) {
   // MacOS has a max filename length of 255
   // and remove a few extra chars in case we need to add a counter at the end.
   let lastName = path.basename(url.path).substring(0, 250);
-  if (lastName.endsWith('.zip')) {
+  if (lastName.endsWith(".zip")) {
     lastName = lastName.substring(0, lastName.length - 4);
   }
 
@@ -245,7 +348,7 @@ async function getStorageFolder(storagePath: string, urlStr: string) {
     counter++;
     folderName = path.join(realpath, `${lastName}-${counter}`);
     if (counter > 100) {
-      throw new Error('Could not find a unique name for downloaded database.');
+      throw new Error("Could not find a unique name for downloaded database.");
     }
   }
   return folderName;
@@ -259,8 +362,8 @@ function validateHttpsUrl(databaseUrl: string) {
     throw new Error(`Invalid url: ${databaseUrl}`);
   }
 
-  if (uri.scheme !== 'https') {
-    throw new Error('Must use https for downloading a database.');
+  if (uri.scheme !== "https") {
+    throw new Error("Must use https for downloading a database.");
   }
 }
 
@@ -268,7 +371,7 @@ async function readAndUnzip(
   zipUrl: string,
   unzipPath: string,
   cli?: CodeQLCliServer,
-  progress?: ProgressCallback
+  progress?: ProgressCallback,
 ) {
   // TODO: Providing progress as the file is unzipped is currently blocked
   // on https://github.com/ZJONSSON/node-unzipper/issues/222
@@ -276,9 +379,9 @@ async function readAndUnzip(
   progress?.({
     maxStep: 10,
     step: 9,
-    message: `Unzipping into ${path.basename(unzipPath)}`
+    message: `Unzipping into ${path.basename(unzipPath)}`,
   });
-  if (cli && await cli.cliConstraints.supportsDatabaseUnbundle()) {
+  if (cli && (await cli.cliConstraints.supportsDatabaseUnbundle())) {
     // Use the `database unbundle` command if the installed cli version supports it
     await cli.databaseUnbundle(zipFile, unzipPath);
   } else {
@@ -292,9 +395,10 @@ async function readAndUnzip(
 
 async function fetchAndUnzip(
   databaseUrl: string,
+  requestHeaders: { [key: string]: string },
   unzipPath: string,
   cli?: CodeQLCliServer,
-  progress?: ProgressCallback
+  progress?: ProgressCallback,
 ) {
   // Although it is possible to download and stream directly to an unzipped directory,
   // we need to avoid this for two reasons. The central directory is located at the
@@ -306,31 +410,47 @@ async function fetchAndUnzip(
 
   progress?.({
     maxStep: 3,
-    message: 'Downloading database',
+    message: "Downloading database",
     step: 1,
   });
 
-  const response = await checkForFailingResponse(await fetch(databaseUrl), 'Error downloading database');
+  const response = await checkForFailingResponse(
+    await fetch(databaseUrl, { headers: requestHeaders }),
+    "Error downloading database",
+  );
   const archiveFileStream = fs.createWriteStream(archivePath);
 
-  const contentLength = response.headers.get('content-length');
+  const contentLength = response.headers.get("content-length");
   const totalNumBytes = contentLength ? parseInt(contentLength, 10) : undefined;
-  reportStreamProgress(response.body, 'Downloading database', totalNumBytes, progress);
-
-  await new Promise((resolve, reject) =>
-    response.body.pipe(archiveFileStream)
-      .on('finish', resolve)
-      .on('error', reject)
+  reportStreamProgress(
+    response.body,
+    "Downloading database",
+    totalNumBytes,
+    progress,
   );
 
-  await readAndUnzip(Uri.file(archivePath).toString(true), unzipPath, cli, progress);
+  await new Promise((resolve, reject) =>
+    response.body
+      .pipe(archiveFileStream)
+      .on("finish", resolve)
+      .on("error", reject),
+  );
 
+  await readAndUnzip(
+    Uri.file(archivePath).toString(true),
+    unzipPath,
+    cli,
+    progress,
+  );
 
   // remove archivePath eagerly since these archives can be large.
   await fs.remove(archivePath);
 }
 
-async function checkForFailingResponse(response: Response, errorMessage: string): Promise<Response | never> {
+async function checkForFailingResponse(
+  response: Response,
+  errorMessage: string,
+): Promise<Response | never> {
   if (response.ok) {
     return response;
   }
@@ -340,7 +460,8 @@ async function checkForFailingResponse(response: Response, errorMessage: string)
   let msg: string;
   try {
     const obj = JSON.parse(text);
-    msg = obj.error || obj.message || obj.reason || JSON.stringify(obj, null, 2);
+    msg =
+      obj.error || obj.message || obj.reason || JSON.stringify(obj, null, 2);
   } catch (e) {
     msg = text;
   }
@@ -348,7 +469,7 @@ async function checkForFailingResponse(response: Response, errorMessage: string)
 }
 
 function isFile(databaseUrl: string) {
-  return Uri.parse(databaseUrl).scheme === 'file';
+  return Uri.parse(databaseUrl).scheme === "file";
 }
 
 /**
@@ -381,6 +502,94 @@ export async function findDirWithFile(
   return;
 }
 
+/**
+ * The URL pattern is https://github.com/{owner}/{name}/{subpages}.
+ *
+ * This function accepts any URL that matches the pattern above. It also accepts just the
+ * name with owner (NWO): `<owner>/<repo>`.
+ *
+ * @param githubRepo The GitHub repository URL or NWO
+ *
+ * @return true if this looks like a valid GitHub repository URL or NWO
+ */
+export function looksLikeGithubRepo(
+  githubRepo: string | undefined,
+): githubRepo is string {
+  if (!githubRepo) {
+    return false;
+  }
+  if (REPO_REGEX.test(githubRepo) || convertGitHubUrlToNwo(githubRepo)) {
+    return true;
+  }
+  return false;
+}
+
+/**
+ * Converts a GitHub repository URL to the corresponding NWO.
+ * @param githubUrl The GitHub repository URL
+ * @return The corresponding NWO, or undefined if the URL is not valid
+ */
+function convertGitHubUrlToNwo(githubUrl: string): string | undefined {
+  try {
+    const uri = Uri.parse(githubUrl, true);
+    if (uri.scheme !== "https") {
+      return;
+    }
+    if (uri.authority !== "github.com" && uri.authority !== "www.github.com") {
+      return;
+    }
+    const paths = uri.path.split("/").filter((segment: string) => segment);
+    const nwo = `${paths[0]}/${paths[1]}`;
+    if (REPO_REGEX.test(nwo)) {
+      return nwo;
+    }
+    return;
+  } catch (e) {
+    // Ignore the error here, since we catch failures at a higher level.
+    // In particular: returning undefined leads to an error in 'promptImportGithubDatabase'.
+    return;
+  }
+}
+
+export async function convertGithubNwoToDatabaseUrl(
+  githubRepo: string,
+  octokit: Octokit.Octokit,
+  progress: ProgressCallback,
+): Promise<
+  | {
+      databaseUrl: string;
+      owner: string;
+      name: string;
+    }
+  | undefined
+> {
+  try {
+    const nwo = convertGitHubUrlToNwo(githubRepo) || githubRepo;
+    const [owner, repo] = nwo.split("/");
+
+    const response = await octokit.request(
+      "GET /repos/:owner/:repo/code-scanning/codeql/databases",
+      { owner, repo },
+    );
+
+    const languages = response.data.map((db: any) => db.language);
+
+    const language = await promptForLanguage(languages, progress);
+    if (!language) {
+      return;
+    }
+
+    return {
+      databaseUrl: `https://api.github.com/repos/${owner}/${repo}/code-scanning/codeql/databases/${language}`,
+      owner,
+      name: repo,
+    };
+  } catch (e) {
+    void logger.log(`Error: ${getErrorMessage(e)}`);
+    throw new Error(`Unable to get database for '${githubRepo}'`);
+  }
+}
+
 /**
  * The URL pattern is https://lgtm.com/projects/{provider}/{org}/{name}/{irrelevant-subpages}.
  * There are several possibilities for the provider: in addition to GitHub.com (g),
@@ -397,7 +606,9 @@ export async function findDirWithFile(
  * @return true if this looks like an LGTM project url
  */
 // exported for testing
-export function looksLikeLgtmUrl(lgtmUrl: string | undefined): lgtmUrl is string {
+export function looksLikeLgtmUrl(
+  lgtmUrl: string | undefined,
+): lgtmUrl is string {
   if (!lgtmUrl) {
     return false;
   }
@@ -408,16 +619,16 @@ export function looksLikeLgtmUrl(lgtmUrl: string | undefined): lgtmUrl is string
 
   try {
     const uri = Uri.parse(lgtmUrl, true);
-    if (uri.scheme !== 'https') {
+    if (uri.scheme !== "https") {
       return false;
     }
 
-    if (uri.authority !== 'lgtm.com' && uri.authority !== 'www.lgtm.com') {
+    if (uri.authority !== "lgtm.com" && uri.authority !== "www.lgtm.com") {
       return false;
     }
 
-    const paths = uri.path.split('/').filter((segment) => segment);
-    return paths.length >= 4 && paths[0] === 'projects';
+    const paths = uri.path.split("/").filter((segment: string) => segment);
+    return paths.length >= 4 && paths[0] === "projects";
   } catch (e) {
     return false;
   }
@@ -427,17 +638,17 @@ function convertRawLgtmSlug(maybeSlug: string): string | undefined {
   if (!maybeSlug) {
     return;
   }
-  const segments = maybeSlug.split('/');
-  const providers = ['g', 'gl', 'b', 'git'];
+  const segments = maybeSlug.split("/");
+  const providers = ["g", "gl", "b", "git"];
   if (segments.length === 3 && providers.includes(segments[0])) {
     return `https://lgtm.com/projects/${maybeSlug}`;
   }
   return;
 }
- 
+
 function extractProjectSlug(lgtmUrl: string): string | undefined {
   // Only matches the '/g/' provider (github)
-  const re = new RegExp('https://lgtm.com/projects/g/(.*[^/])');
+  const re = new RegExp("https://lgtm.com/projects/g/(.*[^/])");
   const match = lgtmUrl.match(re);
   if (!match) {
     return;
@@ -446,9 +657,10 @@ function extractProjectSlug(lgtmUrl: string): string | undefined {
 }
 
 // exported for testing
-export async function convertToDatabaseUrl(
+export async function convertLgtmUrlToDatabaseUrl(
   lgtmUrl: string,
-  progress: ProgressCallback) {
+  progress: ProgressCallback,
+) {
   try {
     lgtmUrl = convertRawLgtmSlug(lgtmUrl) || lgtmUrl;
     let projectJson = await downloadLgtmProjectMetadata(lgtmUrl);
@@ -463,58 +675,62 @@ export async function convertToDatabaseUrl(
       canonicalName = convertRawLgtmSlug(`g/${canonicalName}`);
       projectJson = await downloadLgtmProjectMetadata(canonicalName);
       if (projectJson.code === 404) {
-        throw new Error('Failed to download project from LGTM.');
+        throw new Error("Failed to download project from LGTM.");
       }
     }
 
-    const language = await promptForLanguage(projectJson, progress);
+    const languages =
+      projectJson?.languages?.map(
+        (lang: { language: string }) => lang.language,
+      ) || [];
+
+    const language = await promptForLanguage(languages, progress);
     if (!language) {
       return;
     }
     return `https://lgtm.com/${[
-      'api',
-      'v1.0',
-      'snapshots',
+      "api",
+      "v1.0",
+      "snapshots",
       projectJson.id,
       language,
-    ].join('/')}`;
+    ].join("/")}`;
   } catch (e) {
-    void logger.log(`Error: ${e.message}`);
+    void logger.log(`Error: ${getErrorMessage(e)}`);
     throw new Error(`Invalid LGTM URL: ${lgtmUrl}`);
   }
 }
 
 async function downloadLgtmProjectMetadata(lgtmUrl: string): Promise<any> {
   const uri = Uri.parse(lgtmUrl, true);
-  const paths = ['api', 'v1.0'].concat(
-    uri.path.split('/').filter((segment) => segment)
-  ).slice(0, 6);
-  const projectUrl = `https://lgtm.com/${paths.join('/')}`;
+  const paths = ["api", "v1.0"]
+    .concat(uri.path.split("/").filter((segment: string) => segment))
+    .slice(0, 6);
+  const projectUrl = `https://lgtm.com/${paths.join("/")}`;
   const projectResponse = await fetch(projectUrl);
   return projectResponse.json();
 }
 
 async function promptForLanguage(
-  projectJson: any,
-  progress: ProgressCallback
+  languages: string[],
+  progress: ProgressCallback,
 ): Promise<string | undefined> {
   progress({
-    message: 'Choose language',
+    message: "Choose language",
     step: 2,
-    maxStep: 2
+    maxStep: 2,
   });
-  if (!projectJson?.languages?.length) {
-    return;
+  if (!languages.length) {
+    throw new Error("No databases found");
   }
-  if (projectJson.languages.length === 1) {
-    return projectJson.languages[0].language;
+  if (languages.length === 1) {
+    return languages[0];
   }
 
-  return await window.showQuickPick(
-    projectJson.languages.map((lang: { language: string }) => lang.language), {
-    placeHolder: 'Select the database language to download:'
-  }
-  );
+  return await window.showQuickPick(languages, {
+    placeHolder: "Select the database language to download:",
+    ignoreFocusOut: true,
+  });
 }
 
 /**
@@ -529,10 +745,13 @@ async function promptForLanguage(
  * @param databasePath The full path to the unzipped database
  */
 async function ensureZippedSourceLocation(databasePath: string): Promise<void> {
-  const srcFolderPath = path.join(databasePath, 'src');
-  const srcZipPath = srcFolderPath + '.zip';
+  const srcFolderPath = path.join(databasePath, "src");
+  const srcZipPath = srcFolderPath + ".zip";
 
-  if ((await fs.pathExists(srcFolderPath)) && !(await fs.pathExists(srcZipPath))) {
+  if (
+    (await fs.pathExists(srcFolderPath)) &&
+    !(await fs.pathExists(srcZipPath))
+  ) {
     await zip(srcFolderPath, srcZipPath);
     await fs.remove(srcFolderPath);
   }

extensions/ql-vscode/src/databases-ui.ts

@@ -1,5 +1,5 @@
-import * as path from 'path';
-import { DisposableObject } from './pure/disposable-object';
+import * as path from "path";
+import { DisposableObject } from "./pure/disposable-object";
 import {
   Event,
   EventEmitter,
@@ -9,35 +9,36 @@ import {
   Uri,
   window,
   env,
-} from 'vscode';
-import * as fs from 'fs-extra';
+} from "vscode";
+import * as fs from "fs-extra";
 
 import {
   DatabaseChangedEvent,
   DatabaseItem,
   DatabaseManager,
-} from './databases';
+} from "./databases";
 import {
   commandRunner,
   commandRunnerWithProgress,
   ProgressCallback,
-} from './commandRunner';
+} from "./commandRunner";
 import {
   isLikelyDatabaseRoot,
   isLikelyDbLanguageFolder,
-  showAndLogErrorMessage
-} from './helpers';
-import { logger } from './logging';
-import { clearCacheInDatabase } from './run-queries';
-import * as qsClient from './queryserver-client';
-import { upgradeDatabaseExplicit } from './upgrades';
+  showAndLogErrorMessage,
+} from "./helpers";
+import { logger } from "./logging";
 import {
   importArchiveDatabase,
+  promptImportGithubDatabase,
   promptImportInternetDatabase,
   promptImportLgtmDatabase,
-} from './databaseFetcher';
-import { CancellationToken } from 'vscode';
-import { asyncFilter } from './pure/helpers-pure';
+} from "./databaseFetcher";
+import { CancellationToken } from "vscode";
+import { asyncFilter, getErrorMessage } from "./pure/helpers-pure";
+import { Credentials } from "./authentication";
+import { QueryRunner } from "./queryRunner";
+import { isCanary } from "./config";
 
 type ThemableIconPath = { light: string; dark: string } | string;
 
@@ -45,20 +46,20 @@ type ThemableIconPath = { light: string; dark: string } | string;
  * Path to icons to display next to currently selected database.
  */
 const SELECTED_DATABASE_ICON: ThemableIconPath = {
-  light: 'media/light/check.svg',
-  dark: 'media/dark/check.svg',
+  light: "media/light/check.svg",
+  dark: "media/dark/check.svg",
 };
 
 /**
  * Path to icon to display next to an invalid database.
  */
-const INVALID_DATABASE_ICON: ThemableIconPath = 'media/red-x.svg';
+const INVALID_DATABASE_ICON: ThemableIconPath = "media/red-x.svg";
 
 function joinThemableIconPath(
   base: string,
-  iconPath: ThemableIconPath
+  iconPath: ThemableIconPath,
 ): ThemableIconPath {
-  if (typeof iconPath == 'object')
+  if (typeof iconPath == "object")
     return {
       light: path.join(base, iconPath.light),
       dark: path.join(base, iconPath.dark),
@@ -67,25 +68,29 @@ function joinThemableIconPath(
 }
 
 enum SortOrder {
-  NameAsc = 'NameAsc',
-  NameDesc = 'NameDesc',
-  DateAddedAsc = 'DateAddedAsc',
-  DateAddedDesc = 'DateAddedDesc',
+  NameAsc = "NameAsc",
+  NameDesc = "NameDesc",
+  DateAddedAsc = "DateAddedAsc",
+  DateAddedDesc = "DateAddedDesc",
 }
 
 /**
  * Tree data provider for the databases view.
  */
-class DatabaseTreeDataProvider extends DisposableObject
-  implements TreeDataProvider<DatabaseItem> {
+class DatabaseTreeDataProvider
+  extends DisposableObject
+  implements TreeDataProvider<DatabaseItem>
+{
   private _sortOrder = SortOrder.NameAsc;
 
-  private readonly _onDidChangeTreeData = this.push(new EventEmitter<DatabaseItem | undefined>());
+  private readonly _onDidChangeTreeData = this.push(
+    new EventEmitter<DatabaseItem | undefined>(),
+  );
   private currentDatabaseItem: DatabaseItem | undefined;
 
   constructor(
     private databaseManager: DatabaseManager,
-    private readonly extensionPath: string
+    private readonly extensionPath: string,
   ) {
     super();
 
@@ -93,13 +98,13 @@ class DatabaseTreeDataProvider extends DisposableObject
 
     this.push(
       this.databaseManager.onDidChangeDatabaseItem(
-        this.handleDidChangeDatabaseItem
-      )
+        this.handleDidChangeDatabaseItem,
+      ),
     );
     this.push(
       this.databaseManager.onDidChangeCurrentDatabaseItem(
-        this.handleDidChangeCurrentDatabaseItem
-      )
+        this.handleDidChangeCurrentDatabaseItem,
+      ),
     );
   }
 
@@ -117,7 +122,7 @@ class DatabaseTreeDataProvider extends DisposableObject
   };
 
   private handleDidChangeCurrentDatabaseItem = (
-    event: DatabaseChangedEvent
+    event: DatabaseChangedEvent,
   ): void => {
     if (this.currentDatabaseItem) {
       this._onDidChangeTreeData.fire(this.currentDatabaseItem);
@@ -133,13 +138,13 @@ class DatabaseTreeDataProvider extends DisposableObject
     if (element === this.currentDatabaseItem) {
       item.iconPath = joinThemableIconPath(
         this.extensionPath,
-        SELECTED_DATABASE_ICON
+        SELECTED_DATABASE_ICON,
       );
-      item.contextValue = 'currentDatabase';
+      item.contextValue = "currentDatabase";
     } else if (element.error !== undefined) {
       item.iconPath = joinThemableIconPath(
         this.extensionPath,
-        INVALID_DATABASE_ICON
+        INVALID_DATABASE_ICON,
       );
     }
     item.tooltip = element.databaseUri.fsPath;
@@ -203,11 +208,11 @@ function getFirst(list: Uri[] | undefined): Uri | undefined {
  */
 async function chooseDatabaseDir(byFolder: boolean): Promise<Uri | undefined> {
   const chosen = await window.showOpenDialog({
-    openLabel: byFolder ? 'Choose Database folder' : 'Choose Database archive',
+    openLabel: byFolder ? "Choose Database folder" : "Choose Database archive",
     canSelectFiles: !byFolder,
     canSelectFolders: byFolder,
     canSelectMany: false,
-    filters: byFolder ? {} : { Archives: ['zip'] },
+    filters: byFolder ? {} : { Archives: ["zip"] },
   });
   return getFirst(chosen);
 }
@@ -217,179 +222,187 @@ export class DatabaseUI extends DisposableObject {
 
   public constructor(
     private databaseManager: DatabaseManager,
-    private readonly queryServer: qsClient.QueryServerClient | undefined,
+    private readonly queryServer: QueryRunner | undefined,
     private readonly storagePath: string,
-    readonly extensionPath: string
+    readonly extensionPath: string,
+    private readonly getCredentials: () => Promise<Credentials>,
   ) {
     super();
 
     this.treeDataProvider = this.push(
-      new DatabaseTreeDataProvider(databaseManager, extensionPath)
+      new DatabaseTreeDataProvider(databaseManager, extensionPath),
     );
     this.push(
-      window.createTreeView('codeQLDatabases', {
+      window.createTreeView("codeQLDatabases", {
         treeDataProvider: this.treeDataProvider,
         canSelectMany: true,
-      })
+      }),
     );
   }
 
   init() {
-    void logger.log('Registering database panel commands.');
+    void logger.log("Registering database panel commands.");
     this.push(
       commandRunnerWithProgress(
-        'codeQL.setCurrentDatabase',
+        "codeQL.setCurrentDatabase",
         this.handleSetCurrentDatabase,
         {
-          title: 'Importing database from archive',
-        }
-      )
+          title: "Importing database from archive",
+        },
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQL.upgradeCurrentDatabase',
+        "codeQL.upgradeCurrentDatabase",
         this.handleUpgradeCurrentDatabase,
         {
-          title: 'Upgrading current database',
+          title: "Upgrading current database",
           cancellable: true,
-        }
-      )
+        },
+      ),
     );
     this.push(
-      commandRunnerWithProgress(
-        'codeQL.clearCache',
-        this.handleClearCache,
-        {
-          title: 'Clearing Cache',
-        })
+      commandRunnerWithProgress("codeQL.clearCache", this.handleClearCache, {
+        title: "Clearing Cache",
+      }),
     );
 
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.chooseDatabaseFolder',
+        "codeQLDatabases.chooseDatabaseFolder",
         this.handleChooseDatabaseFolder,
         {
-          title: 'Adding database from folder',
-        }
-      )
+          title: "Adding database from folder",
+        },
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.chooseDatabaseArchive',
+        "codeQLDatabases.chooseDatabaseArchive",
         this.handleChooseDatabaseArchive,
         {
-          title: 'Adding database from archive',
-        }
-      )
+          title: "Adding database from archive",
+        },
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.chooseDatabaseInternet',
+        "codeQLDatabases.chooseDatabaseInternet",
         this.handleChooseDatabaseInternet,
         {
-          title: 'Adding database from URL',
-        }
-      )
+          title: "Adding database from URL",
+        },
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.chooseDatabaseLgtm',
+        "codeQLDatabases.chooseDatabaseGithub",
+        async (progress: ProgressCallback, token: CancellationToken) => {
+          const credentials = isCanary()
+            ? await this.getCredentials()
+            : undefined;
+          await this.handleChooseDatabaseGithub(credentials, progress, token);
+        },
+        {
+          title: "Adding database from GitHub",
+        },
+      ),
+    );
+    this.push(
+      commandRunnerWithProgress(
+        "codeQLDatabases.chooseDatabaseLgtm",
         this.handleChooseDatabaseLgtm,
         {
-          title: 'Adding database from LGTM',
-        })
+          title: "Adding database from LGTM",
+        },
+      ),
     );
     this.push(
       commandRunner(
-        'codeQLDatabases.setCurrentDatabase',
-        this.handleMakeCurrentDatabase
-      )
+        "codeQLDatabases.setCurrentDatabase",
+        this.handleMakeCurrentDatabase,
+      ),
+    );
+    this.push(
+      commandRunner("codeQLDatabases.sortByName", this.handleSortByName),
     );
     this.push(
       commandRunner(
-        'codeQLDatabases.sortByName',
-        this.handleSortByName
-      )
-    );
-    this.push(
-      commandRunner(
-        'codeQLDatabases.sortByDateAdded',
-        this.handleSortByDateAdded
-      )
+        "codeQLDatabases.sortByDateAdded",
+        this.handleSortByDateAdded,
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.removeDatabase',
+        "codeQLDatabases.removeDatabase",
         this.handleRemoveDatabase,
         {
-          title: 'Removing database',
-          cancellable: false
-        }
-      )
+          title: "Removing database",
+          cancellable: false,
+        },
+      ),
     );
     this.push(
       commandRunnerWithProgress(
-        'codeQLDatabases.upgradeDatabase',
+        "codeQLDatabases.upgradeDatabase",
         this.handleUpgradeDatabase,
         {
-          title: 'Upgrading database',
+          title: "Upgrading database",
           cancellable: true,
-        }
-      )
+        },
+      ),
     );
     this.push(
       commandRunner(
-        'codeQLDatabases.renameDatabase',
-        this.handleRenameDatabase
-      )
+        "codeQLDatabases.renameDatabase",
+        this.handleRenameDatabase,
+      ),
     );
     this.push(
       commandRunner(
-        'codeQLDatabases.openDatabaseFolder',
-        this.handleOpenFolder
-      )
+        "codeQLDatabases.openDatabaseFolder",
+        this.handleOpenFolder,
+      ),
+    );
+    this.push(
+      commandRunner("codeQLDatabases.addDatabaseSource", this.handleAddSource),
     );
     this.push(
       commandRunner(
-        'codeQLDatabases.addDatabaseSource',
-        this.handleAddSource
-      )
-    );
-    this.push(
-      commandRunner(
-        'codeQLDatabases.removeOrphanedDatabases',
-        this.handleRemoveOrphanedDatabases
-      )
+        "codeQLDatabases.removeOrphanedDatabases",
+        this.handleRemoveOrphanedDatabases,
+      ),
     );
   }
 
   private handleMakeCurrentDatabase = async (
-    databaseItem: DatabaseItem
+    databaseItem: DatabaseItem,
   ): Promise<void> => {
     await this.databaseManager.setCurrentDatabaseItem(databaseItem);
   };
 
   handleChooseDatabaseFolder = async (
     progress: ProgressCallback,
-    token: CancellationToken
-  ): Promise<DatabaseItem | undefined> => {
+    token: CancellationToken,
+  ): Promise<void> => {
     try {
-      return await this.chooseAndSetDatabase(true, progress, token);
+      await this.chooseAndSetDatabase(true, progress, token);
     } catch (e) {
-      void showAndLogErrorMessage(e.message);
-      return undefined;
+      void showAndLogErrorMessage(getErrorMessage(e));
     }
   };
 
   handleRemoveOrphanedDatabases = async (): Promise<void> => {
-    void logger.log('Removing orphaned databases from workspace storage.');
+    void logger.log("Removing orphaned databases from workspace storage.");
     let dbDirs = undefined;
 
     if (
       !(await fs.pathExists(this.storagePath)) ||
       !(await fs.stat(this.storagePath)).isDirectory()
     ) {
-      void logger.log('Missing or invalid storage directory. Not trying to remove orphaned databases.');
+      void logger.log(
+        "Missing or invalid storage directory. Not trying to remove orphaned databases.",
+      );
       return;
     }
 
@@ -397,87 +410,103 @@ export class DatabaseUI extends DisposableObject {
       // read directory
       (await fs.readdir(this.storagePath, { withFileTypes: true }))
         // remove non-directories
-        .filter(dirent => dirent.isDirectory())
+        .filter((dirent) => dirent.isDirectory())
         // get the full path
-        .map(dirent => path.join(this.storagePath, dirent.name))
+        .map((dirent) => path.join(this.storagePath, dirent.name))
         // remove databases still in workspace
-        .filter(dbDir => {
+        .filter((dbDir) => {
           const dbUri = Uri.file(dbDir);
-          return this.databaseManager.databaseItems.every(item => item.databaseUri.fsPath !== dbUri.fsPath);
+          return this.databaseManager.databaseItems.every(
+            (item) => item.databaseUri.fsPath !== dbUri.fsPath,
+          );
         });
 
     // remove non-databases
     dbDirs = await asyncFilter(dbDirs, isLikelyDatabaseRoot);
 
     if (!dbDirs.length) {
-      void logger.log('No orphaned databases found.');
+      void logger.log("No orphaned databases found.");
       return;
     }
 
     // delete
     const failures = [] as string[];
     await Promise.all(
-      dbDirs.map(async dbDir => {
+      dbDirs.map(async (dbDir) => {
         try {
           void logger.log(`Deleting orphaned database '${dbDir}'.`);
           await fs.remove(dbDir);
         } catch (e) {
           failures.push(`${path.basename(dbDir)}`);
         }
-      })
+      }),
     );
 
     if (failures.length) {
       const dirname = path.dirname(failures[0]);
       void showAndLogErrorMessage(
-        `Failed to delete unused databases (${failures.join(', ')
-        }).\nTo delete unused databases, please remove them manually from the storage folder ${dirname}.`
+        `Failed to delete unused databases (${failures.join(
+          ", ",
+        )}).\nTo delete unused databases, please remove them manually from the storage folder ${dirname}.`,
       );
     }
   };
 
-
   handleChooseDatabaseArchive = async (
     progress: ProgressCallback,
-    token: CancellationToken
-  ): Promise<DatabaseItem | undefined> => {
+    token: CancellationToken,
+  ): Promise<void> => {
     try {
-      return await this.chooseAndSetDatabase(false, progress, token);
+      await this.chooseAndSetDatabase(false, progress, token);
     } catch (e) {
-      void showAndLogErrorMessage(e.message);
-      return undefined;
+      void showAndLogErrorMessage(getErrorMessage(e));
     }
   };
 
   handleChooseDatabaseInternet = async (
     progress: ProgressCallback,
-    token: CancellationToken
+    token: CancellationToken,
   ): Promise<DatabaseItem | undefined> => {
     return await promptImportInternetDatabase(
       this.databaseManager,
       this.storagePath,
       progress,
       token,
-      this.queryServer?.cliServer
+      this.queryServer?.cliServer,
+    );
+  };
+
+  handleChooseDatabaseGithub = async (
+    credentials: Credentials | undefined,
+    progress: ProgressCallback,
+    token: CancellationToken,
+  ): Promise<DatabaseItem | undefined> => {
+    return await promptImportGithubDatabase(
+      this.databaseManager,
+      this.storagePath,
+      credentials,
+      progress,
+      token,
+      this.queryServer?.cliServer,
     );
   };
 
   handleChooseDatabaseLgtm = async (
     progress: ProgressCallback,
-    token: CancellationToken
+    token: CancellationToken,
   ): Promise<DatabaseItem | undefined> => {
     return await promptImportLgtmDatabase(
       this.databaseManager,
       this.storagePath,
       progress,
       token,
-      this.queryServer?.cliServer
+      this.queryServer?.cliServer,
     );
   };
 
   async tryUpgradeCurrentDatabase(
     progress: ProgressCallback,
-    token: CancellationToken
+    token: CancellationToken,
   ) {
     await this.handleUpgradeCurrentDatabase(progress, token);
   }
@@ -503,9 +532,10 @@ export class DatabaseUI extends DisposableObject {
     token: CancellationToken,
   ): Promise<void> => {
     await this.handleUpgradeDatabase(
-      progress, token,
+      progress,
+      token,
       this.databaseManager.currentDatabaseItem,
-      []
+      [],
     );
   };
 
@@ -517,37 +547,38 @@ export class DatabaseUI extends DisposableObject {
   ): Promise<void> => {
     if (multiSelect?.length) {
       await Promise.all(
-        multiSelect.map((dbItem) => this.handleUpgradeDatabase(progress, token, dbItem, []))
+        multiSelect.map((dbItem) =>
+          this.handleUpgradeDatabase(progress, token, dbItem, []),
+        ),
       );
     }
     if (this.queryServer === undefined) {
       throw new Error(
-        'Received request to upgrade database, but there is no running query server.'
+        "Received request to upgrade database, but there is no running query server.",
       );
     }
     if (databaseItem === undefined) {
       throw new Error(
-        'Received request to upgrade database, but no database was provided.'
+        "Received request to upgrade database, but no database was provided.",
       );
     }
     if (databaseItem.contents === undefined) {
       throw new Error(
-        'Received request to upgrade database, but database contents could not be found.'
+        "Received request to upgrade database, but database contents could not be found.",
       );
     }
     if (databaseItem.contents.dbSchemeUri === undefined) {
       throw new Error(
-        'Received request to upgrade database, but database has no schema.'
+        "Received request to upgrade database, but database has no schema.",
       );
     }
 
     // Search for upgrade scripts in any workspace folders available
 
-    await upgradeDatabaseExplicit(
-      this.queryServer,
+    await this.queryServer.upgradeDatabaseExplicit(
       databaseItem,
       progress,
-      token
+      token,
     );
   };
 
@@ -559,11 +590,10 @@ export class DatabaseUI extends DisposableObject {
       this.queryServer !== undefined &&
       this.databaseManager.currentDatabaseItem !== undefined
     ) {
-      await clearCacheInDatabase(
-        this.queryServer,
+      await this.queryServer.clearCacheInDatabase(
         this.databaseManager.currentDatabaseItem,
         progress,
-        token
+        token,
       );
     }
   };
@@ -575,14 +605,14 @@ export class DatabaseUI extends DisposableObject {
   ): Promise<void> => {
     try {
       // Assume user has selected an archive if the file has a .zip extension
-      if (uri.path.endsWith('.zip')) {
+      if (uri.path.endsWith(".zip")) {
         await importArchiveDatabase(
           uri.toString(true),
           this.databaseManager,
           this.storagePath,
           progress,
           token,
-          this.queryServer?.cliServer
+          this.queryServer?.cliServer,
         );
       } else {
         await this.setCurrentDatabase(progress, token, uri);
@@ -590,8 +620,9 @@ export class DatabaseUI extends DisposableObject {
     } catch (e) {
       // rethrow and let this be handled by default error handling.
       throw new Error(
-        `Could not set database to ${path.basename(uri.fsPath)}. Reason: ${e.message
-        }`
+        `Could not set database to ${path.basename(
+          uri.fsPath,
+        )}. Reason: ${getErrorMessage(e)}`,
       );
     }
   };
@@ -600,25 +631,31 @@ export class DatabaseUI extends DisposableObject {
     progress: ProgressCallback,
     token: CancellationToken,
     databaseItem: DatabaseItem,
-    multiSelect: DatabaseItem[] | undefined
+    multiSelect: DatabaseItem[] | undefined,
   ): Promise<void> => {
     if (multiSelect?.length) {
-      await Promise.all(multiSelect.map((dbItem) =>
-        this.databaseManager.removeDatabaseItem(progress, token, dbItem)
-      ));
+      await Promise.all(
+        multiSelect.map((dbItem) =>
+          this.databaseManager.removeDatabaseItem(progress, token, dbItem),
+        ),
+      );
     } else {
-      await this.databaseManager.removeDatabaseItem(progress, token, databaseItem);
+      await this.databaseManager.removeDatabaseItem(
+        progress,
+        token,
+        databaseItem,
+      );
     }
   };
 
   private handleRenameDatabase = async (
     databaseItem: DatabaseItem,
-    multiSelect: DatabaseItem[] | undefined
+    multiSelect: DatabaseItem[] | undefined,
   ): Promise<void> => {
     this.assertSingleDatabase(multiSelect);
 
     const newName = await window.showInputBox({
-      prompt: 'Choose new database name',
+      prompt: "Choose new database name",
       value: databaseItem.name,
     });
 
@@ -629,11 +666,11 @@ export class DatabaseUI extends DisposableObject {
 
   private handleOpenFolder = async (
     databaseItem: DatabaseItem,
-    multiSelect: DatabaseItem[] | undefined
+    multiSelect: DatabaseItem[] | undefined,
   ): Promise<void> => {
     if (multiSelect?.length) {
       await Promise.all(
-        multiSelect.map((dbItem) => env.openExternal(dbItem.databaseUri))
+        multiSelect.map((dbItem) => env.openExternal(dbItem.databaseUri)),
       );
     } else {
       await env.openExternal(databaseItem.databaseUri);
@@ -647,7 +684,7 @@ export class DatabaseUI extends DisposableObject {
    */
   private handleAddSource = async (
     databaseItem: DatabaseItem,
-    multiSelect: DatabaseItem[] | undefined
+    multiSelect: DatabaseItem[] | undefined,
   ): Promise<void> => {
     if (multiSelect?.length) {
       for (const dbItem of multiSelect) {
@@ -665,7 +702,7 @@ export class DatabaseUI extends DisposableObject {
    */
   public async getDatabaseItem(
     progress: ProgressCallback,
-    token: CancellationToken
+    token: CancellationToken,
   ): Promise<DatabaseItem | undefined> {
     if (this.databaseManager.currentDatabaseItem === undefined) {
       await this.chooseAndSetDatabase(false, progress, token);
@@ -677,11 +714,15 @@ export class DatabaseUI extends DisposableObject {
   private async setCurrentDatabase(
     progress: ProgressCallback,
     token: CancellationToken,
-    uri: Uri
+    uri: Uri,
   ): Promise<DatabaseItem | undefined> {
     let databaseItem = this.databaseManager.findDatabaseItem(uri);
     if (databaseItem === undefined) {
-      databaseItem = await this.databaseManager.openDatabase(progress, token, uri);
+      databaseItem = await this.databaseManager.openDatabase(
+        progress,
+        token,
+        uri,
+      );
     }
     await this.databaseManager.setCurrentDatabaseItem(databaseItem);
 
@@ -715,7 +756,7 @@ export class DatabaseUI extends DisposableObject {
         this.storagePath,
         progress,
         token,
-        this.queryServer?.cliServer
+        this.queryServer?.cliServer,
       );
     }
   }
@@ -724,7 +765,7 @@ export class DatabaseUI extends DisposableObject {
    * Perform some heuristics to ensure a proper database location is chosen.
    *
    * 1. If the selected URI to add is a file, choose the containing directory
-   * 2. If the selected URI is a directory matching db-*, choose the containing directory
+   * 2. If the selected URI appears to be a db language folder, choose the containing directory
    * 3. choose the current directory
    *
    * @param uri a URI that is a database folder or inside it
@@ -737,7 +778,7 @@ export class DatabaseUI extends DisposableObject {
       dbPath = path.dirname(dbPath);
     }
 
-    if (isLikelyDbLanguageFolder(dbPath)) {
+    if (await isLikelyDbLanguageFolder(dbPath)) {
       dbPath = path.dirname(dbPath);
     }
     return Uri.file(dbPath);
@@ -745,7 +786,7 @@ export class DatabaseUI extends DisposableObject {
 
   private assertSingleDatabase(
     multiSelect: DatabaseItem[] = [],
-    message = 'Please select a single database.'
+    message = "Please select a single database.",
   ) {
     if (multiSelect.length > 1) {
       throw new Error(message);

extensions/ql-vscode/src/databases.ts

@@ -1,24 +1,26 @@
-import * as fs from 'fs-extra';
-import * as glob from 'glob-promise';
-import * as path from 'path';
-import * as vscode from 'vscode';
-import * as cli from './cli';
-import { ExtensionContext } from 'vscode';
+import * as fs from "fs-extra";
+import * as glob from "glob-promise";
+import * as path from "path";
+import * as vscode from "vscode";
+import * as cli from "./cli";
+import { ExtensionContext } from "vscode";
 import {
   showAndLogErrorMessage,
   showAndLogWarningMessage,
   showAndLogInformationMessage,
-  isLikelyDatabaseRoot
-} from './helpers';
+  isLikelyDatabaseRoot,
+} from "./helpers";
+import { ProgressCallback, withProgress } from "./commandRunner";
 import {
-  ProgressCallback,
-  withProgress
-} from './commandRunner';
-import { zipArchiveScheme, encodeArchiveBasePath, decodeSourceArchiveUri, encodeSourceArchiveUri } from './archive-filesystem-provider';
-import { DisposableObject } from './pure/disposable-object';
-import { Logger, logger } from './logging';
-import { registerDatabases, Dataset, deregisterDatabases } from './pure/messages';
-import { QueryServerClient } from './queryserver-client';
+  zipArchiveScheme,
+  encodeArchiveBasePath,
+  decodeSourceArchiveUri,
+  encodeSourceArchiveUri,
+} from "./archive-filesystem-provider";
+import { DisposableObject } from "./pure/disposable-object";
+import { Logger, logger } from "./logging";
+import { getErrorMessage } from "./pure/helpers-pure";
+import { QueryRunner } from "./queryRunner";
 
 /**
  * databases.ts
@@ -34,13 +36,13 @@ import { QueryServerClient } from './queryserver-client';
  * The name of the key in the workspaceState dictionary in which we
  * persist the current database across sessions.
  */
-const CURRENT_DB = 'currentDatabase';
+const CURRENT_DB = "currentDatabase";
 
 /**
  * The name of the key in the workspaceState dictionary in which we
  * persist the list of databases across sessions.
  */
-const DB_LIST = 'databaseList';
+const DB_LIST = "databaseList";
 
 export interface DatabaseOptions {
   displayName?: string;
@@ -67,7 +69,7 @@ export enum DatabaseKind {
   /** A CodeQL database */
   Database,
   /** A raw QL dataset */
-  RawDataset
+  RawDataset,
 }
 
 export interface DatabaseContents {
@@ -89,33 +91,35 @@ export interface DatabaseContents {
  * An error thrown when we cannot find a valid database in a putative
  * database directory.
  */
-class InvalidDatabaseError extends Error {
-}
-
+class InvalidDatabaseError extends Error {}
 
 async function findDataset(parentDirectory: string): Promise<vscode.Uri> {
   /*
    * Look directly in the root
    */
-  let dbRelativePaths = await glob('db-*/', {
-    cwd: parentDirectory
+  let dbRelativePaths = await glob("db-*/", {
+    cwd: parentDirectory,
   });
 
   if (dbRelativePaths.length === 0) {
     /*
      * Check If they are in the old location
      */
-    dbRelativePaths = await glob('working/db-*/', {
-      cwd: parentDirectory
+    dbRelativePaths = await glob("working/db-*/", {
+      cwd: parentDirectory,
     });
   }
   if (dbRelativePaths.length === 0) {
-    throw new InvalidDatabaseError(`'${parentDirectory}' does not contain a dataset directory.`);
+    throw new InvalidDatabaseError(
+      `'${parentDirectory}' does not contain a dataset directory.`,
+    );
   }
 
   const dbAbsolutePath = path.join(parentDirectory, dbRelativePaths[0]);
   if (dbRelativePaths.length > 1) {
-    void showAndLogWarningMessage(`Found multiple dataset directories in database, using '${dbAbsolutePath}'.`);
+    void showAndLogWarningMessage(
+      `Found multiple dataset directories in database, using '${dbAbsolutePath}'.`,
+    );
   }
 
   return vscode.Uri.file(dbAbsolutePath);
@@ -123,13 +127,13 @@ async function findDataset(parentDirectory: string): Promise<vscode.Uri> {
 
 // exported for testing
 export async function findSourceArchive(
-  databasePath: string, silent = false
+  databasePath: string,
 ): Promise<vscode.Uri | undefined> {
-  const relativePaths = ['src', 'output/src_archive'];
+  const relativePaths = ["src", "output/src_archive"];
 
   for (const relativePath of relativePaths) {
     const basePath = path.join(databasePath, relativePath);
-    const zipPath = basePath + '.zip';
+    const zipPath = basePath + ".zip";
 
     // Prefer using a zip archive over a directory.
     if (await fs.pathExists(zipPath)) {
@@ -138,18 +142,16 @@ export async function findSourceArchive(
       return vscode.Uri.file(basePath);
     }
   }
-  if (!silent) {
-    void showAndLogInformationMessage(
-      `Could not find source archive for database '${databasePath}'. Assuming paths are absolute.`
-    );
-  }
+
+  void showAndLogInformationMessage(
+    `Could not find source archive for database '${databasePath}'. Assuming paths are absolute.`,
+  );
   return undefined;
 }
 
 async function resolveDatabase(
-  databasePath: string
+  databasePath: string,
 ): Promise<DatabaseContents> {
-
   const name = path.basename(databasePath);
 
   // Look for dataset and source archive.
@@ -160,28 +162,36 @@ async function resolveDatabase(
     kind: DatabaseKind.Database,
     name,
     datasetUri,
-    sourceArchiveUri
+    sourceArchiveUri,
   };
 }
 
 /** Gets the relative paths of all `.dbscheme` files in the given directory. */
 async function getDbSchemeFiles(dbDirectory: string): Promise<string[]> {
-  return await glob('*.dbscheme', { cwd: dbDirectory });
+  return await glob("*.dbscheme", { cwd: dbDirectory });
 }
 
-async function resolveDatabaseContents(uri: vscode.Uri): Promise<DatabaseContents> {
-  if (uri.scheme !== 'file') {
-    throw new Error(`Database URI scheme '${uri.scheme}' not supported; only 'file' URIs are supported.`);
+async function resolveDatabaseContents(
+  uri: vscode.Uri,
+): Promise<DatabaseContents> {
+  if (uri.scheme !== "file") {
+    throw new Error(
+      `Database URI scheme '${uri.scheme}' not supported; only 'file' URIs are supported.`,
+    );
   }
   const databasePath = uri.fsPath;
-  if (!await fs.pathExists(databasePath)) {
-    throw new InvalidDatabaseError(`Database '${databasePath}' does not exist.`);
+  if (!(await fs.pathExists(databasePath))) {
+    throw new InvalidDatabaseError(
+      `Database '${databasePath}' does not exist.`,
+    );
   }
 
   const contents = await resolveDatabase(databasePath);
 
   if (contents === undefined) {
-    throw new InvalidDatabaseError(`'${databasePath}' is not a valid database.`);
+    throw new InvalidDatabaseError(
+      `'${databasePath}' is not a valid database.`,
+    );
   }
 
   // Look for a single dbscheme file within the database.
@@ -189,12 +199,17 @@ async function resolveDatabaseContents(uri: vscode.Uri): Promise<DatabaseContent
   const dbPath = contents.datasetUri.fsPath;
   const dbSchemeFiles = await getDbSchemeFiles(dbPath);
   if (dbSchemeFiles.length === 0) {
-    throw new InvalidDatabaseError(`Database '${databasePath}' does not contain a CodeQL dbscheme under '${dbPath}'.`);
-  }
-  else if (dbSchemeFiles.length > 1) {
-    throw new InvalidDatabaseError(`Database '${databasePath}' contains multiple CodeQL dbschemes under '${dbPath}'.`);
+    throw new InvalidDatabaseError(
+      `Database '${databasePath}' does not contain a CodeQL dbscheme under '${dbPath}'.`,
+    );
+  } else if (dbSchemeFiles.length > 1) {
+    throw new InvalidDatabaseError(
+      `Database '${databasePath}' contains multiple CodeQL dbschemes under '${dbPath}'.`,
+    );
   } else {
-    contents.dbSchemeUri = vscode.Uri.file(path.resolve(dbPath, dbSchemeFiles[0]));
+    contents.dbSchemeUri = vscode.Uri.file(
+      path.resolve(dbPath, dbSchemeFiles[0]),
+    );
   }
   return contents;
 }
@@ -282,16 +297,16 @@ export interface DatabaseItem {
 }
 
 export enum DatabaseEventKind {
-  Add = 'Add',
-  Remove = 'Remove',
+  Add = "Add",
+  Remove = "Remove",
 
   // Fired when databases are refreshed from persisted state
-  Refresh = 'Refresh',
+  Refresh = "Refresh",
 
   // Fired when the current database changes
-  Change = 'Change',
+  Change = "Change",
 
-  Rename = 'Rename'
+  Rename = "Rename",
 }
 
 export interface DatabaseChangedEvent {
@@ -310,7 +325,7 @@ export class DatabaseItemImpl implements DatabaseItem {
     public readonly databaseUri: vscode.Uri,
     contents: DatabaseContents | undefined,
     private options: FullDatabaseOptions,
-    private readonly onChanged: (event: DatabaseChangedEvent) => void
+    private readonly onChanged: (event: DatabaseChangedEvent) => void,
   ) {
     this._contents = contents;
   }
@@ -318,11 +333,9 @@ export class DatabaseItemImpl implements DatabaseItem {
   public get name(): string {
     if (this.options.displayName) {
       return this.options.displayName;
-    }
-    else if (this._contents) {
+    } else if (this._contents) {
       return this._contents.name;
-    }
-    else {
+    } else {
       return path.basename(this.databaseUri.fsPath);
     }
   }
@@ -332,7 +345,7 @@ export class DatabaseItemImpl implements DatabaseItem {
   }
 
   public get sourceArchive(): vscode.Uri | undefined {
-    if (this.options.ignoreSourceArchive || (this._contents === undefined)) {
+    if (this.options.ignoreSourceArchive || this._contents === undefined) {
       return undefined;
     } else {
       return this._contents.sourceArchiveUri;
@@ -356,17 +369,15 @@ export class DatabaseItemImpl implements DatabaseItem {
       try {
         this._contents = await resolveDatabaseContents(this.databaseUri);
         this._error = undefined;
-      }
-      catch (e) {
+      } catch (e) {
         this._contents = undefined;
-        this._error = e;
+        this._error = e instanceof Error ? e : new Error(String(e));
         throw e;
       }
-    }
-    finally {
+    } finally {
       this.onChanged({
         kind: DatabaseEventKind.Refresh,
-        item: this
+        item: this,
       });
     }
   }
@@ -374,8 +385,10 @@ export class DatabaseItemImpl implements DatabaseItem {
   public resolveSourceFile(uriStr: string | undefined): vscode.Uri {
     const sourceArchive = this.sourceArchive;
     const uri = uriStr ? vscode.Uri.parse(uriStr, true) : undefined;
-    if (uri && uri.scheme !== 'file') {
-      throw new Error(`Invalid uri scheme in ${uriStr}. Only 'file' is allowed.`);
+    if (uri && uri.scheme !== "file") {
+      throw new Error(
+        `Invalid uri scheme in ${uriStr}. Only 'file' is allowed.`,
+      );
     }
     if (!sourceArchive) {
       if (uri) {
@@ -386,28 +399,29 @@ export class DatabaseItemImpl implements DatabaseItem {
     }
 
     if (uri) {
-      const relativeFilePath = decodeURI(uri.path).replace(':', '_').replace(/^\/*/, '');
+      const relativeFilePath = decodeURI(uri.path)
+        .replace(":", "_")
+        .replace(/^\/*/, "");
       if (sourceArchive.scheme === zipArchiveScheme) {
         const zipRef = decodeSourceArchiveUri(sourceArchive);
-        const pathWithinSourceArchive = zipRef.pathWithinSourceArchive === '/'
-          ? relativeFilePath
-          : zipRef.pathWithinSourceArchive + '/' + relativeFilePath;
+        const pathWithinSourceArchive =
+          zipRef.pathWithinSourceArchive === "/"
+            ? relativeFilePath
+            : zipRef.pathWithinSourceArchive + "/" + relativeFilePath;
         return encodeSourceArchiveUri({
           pathWithinSourceArchive,
           sourceArchiveZipPath: zipRef.sourceArchiveZipPath,
         });
-
       } else {
         let newPath = sourceArchive.path;
-        if (!newPath.endsWith('/')) {
+        if (!newPath.endsWith("/")) {
           // Ensure a trailing slash.
-          newPath += '/';
+          newPath += "/";
         }
         newPath += relativeFilePath;
 
         return sourceArchive.with({ path: newPath });
       }
-
     } else {
       return sourceArchive;
     }
@@ -419,7 +433,7 @@ export class DatabaseItemImpl implements DatabaseItem {
   public getPersistedState(): PersistedDatabaseItem {
     return {
       uri: this.databaseUri.toString(true),
-      options: this.options
+      options: this.options,
     };
   }
 
@@ -444,7 +458,9 @@ export class DatabaseItemImpl implements DatabaseItem {
    * Returns `sourceLocationPrefix` of database. Requires that the database
    * has a `.dbinfo` file, which is the source of the prefix.
    */
-  public async getSourceLocationPrefix(server: cli.CodeQLCliServer): Promise<string> {
+  public async getSourceLocationPrefix(
+    server: cli.CodeQLCliServer,
+  ): Promise<string> {
     const dbInfo = await this.getDbInfo(server);
     return dbInfo.sourceLocationPrefix;
   }
@@ -458,7 +474,7 @@ export class DatabaseItemImpl implements DatabaseItem {
   }
 
   public get language() {
-    return this.options.language || '';
+    return this.options.language || "";
   }
 
   /**
@@ -466,7 +482,7 @@ export class DatabaseItemImpl implements DatabaseItem {
    */
   public getSourceArchiveExplorerUri(): vscode.Uri {
     const sourceArchive = this.sourceArchive;
-    if (sourceArchive === undefined || !sourceArchive.fsPath.endsWith('.zip')) {
+    if (sourceArchive === undefined || !sourceArchive.fsPath.endsWith(".zip")) {
       throw new Error(this.verifyZippedSources());
     }
     return encodeArchiveBasePath(sourceArchive.fsPath);
@@ -478,7 +494,7 @@ export class DatabaseItemImpl implements DatabaseItem {
       return `${this.name} has no source archive.`;
     }
 
-    if (!sourceArchive.fsPath.endsWith('.zip')) {
+    if (!sourceArchive.fsPath.endsWith(".zip")) {
       return `${this.name} has a source folder that is unzipped.`;
     }
     return;
@@ -488,26 +504,28 @@ export class DatabaseItemImpl implements DatabaseItem {
    * Holds if `uri` belongs to this database's source archive.
    */
   public belongsToSourceArchiveExplorerUri(uri: vscode.Uri): boolean {
-    if (this.sourceArchive === undefined)
-      return false;
-    return uri.scheme === zipArchiveScheme &&
-      decodeSourceArchiveUri(uri).sourceArchiveZipPath === this.sourceArchive.fsPath;
+    if (this.sourceArchive === undefined) return false;
+    return (
+      uri.scheme === zipArchiveScheme &&
+      decodeSourceArchiveUri(uri).sourceArchiveZipPath ===
+        this.sourceArchive.fsPath
+    );
   }
 
   public async isAffectedByTest(testPath: string): Promise<boolean> {
     const databasePath = this.databaseUri.fsPath;
-    if (!databasePath.endsWith('.testproj')) {
+    if (!databasePath.endsWith(".testproj")) {
       return false;
     }
     try {
       const stats = await fs.stat(testPath);
       if (stats.isDirectory()) {
-        return !path.relative(testPath, databasePath).startsWith('..');
+        return !path.relative(testPath, databasePath).startsWith("..");
       } else {
         // database for /one/two/three/test.ql is at /one/two/three/three.testproj
         const testdir = path.dirname(testPath);
         const testdirbase = path.basename(testdir);
-        return databasePath == path.join(testdir, testdirbase + '.testproj');
+        return databasePath == path.join(testdir, testdirbase + ".testproj");
       }
     } catch {
       // No information available for test path - assume database is unaffected.
@@ -521,14 +539,19 @@ export class DatabaseItemImpl implements DatabaseItem {
  * `event` fires. If waiting for the event takes too long (by default
  * >1000ms) log a warning, and resolve to undefined.
  */
-function eventFired<T>(event: vscode.Event<T>, timeoutMs = 1000): Promise<T | undefined> {
+function eventFired<T>(
+  event: vscode.Event<T>,
+  timeoutMs = 1000,
+): Promise<T | undefined> {
   return new Promise((res, _rej) => {
     const timeout = setTimeout(() => {
-      void logger.log(`Waiting for event ${event} timed out after ${timeoutMs}ms`);
+      void logger.log(
+        `Waiting for event ${event} timed out after ${timeoutMs}ms`,
+      );
       res(undefined);
       dispose();
     }, timeoutMs);
-    const disposable = event(e => {
+    const disposable = event((e) => {
       res(e);
       dispose();
     });
@@ -540,48 +563,56 @@ function eventFired<T>(event: vscode.Event<T>, timeoutMs = 1000): Promise<T | un
 }
 
 export class DatabaseManager extends DisposableObject {
-  private readonly _onDidChangeDatabaseItem = this.push(new vscode.EventEmitter<DatabaseChangedEvent>());
+  private readonly _onDidChangeDatabaseItem = this.push(
+    new vscode.EventEmitter<DatabaseChangedEvent>(),
+  );
 
   readonly onDidChangeDatabaseItem = this._onDidChangeDatabaseItem.event;
 
-  private readonly _onDidChangeCurrentDatabaseItem = this.push(new vscode.EventEmitter<DatabaseChangedEvent>());
-  readonly onDidChangeCurrentDatabaseItem = this._onDidChangeCurrentDatabaseItem.event;
+  private readonly _onDidChangeCurrentDatabaseItem = this.push(
+    new vscode.EventEmitter<DatabaseChangedEvent>(),
+  );
+  readonly onDidChangeCurrentDatabaseItem =
+    this._onDidChangeCurrentDatabaseItem.event;
 
   private readonly _databaseItems: DatabaseItem[] = [];
   private _currentDatabaseItem: DatabaseItem | undefined = undefined;
 
   constructor(
     private readonly ctx: ExtensionContext,
-    private readonly qs: QueryServerClient,
+    private readonly qs: QueryRunner,
     private readonly cli: cli.CodeQLCliServer,
-    public logger: Logger
+    public logger: Logger,
   ) {
     super();
 
-    qs.onDidStartQueryServer(this.reregisterDatabases.bind(this));
-
-    // Let this run async.
-    void this.loadPersistedState();
+    qs.onStart(this.reregisterDatabases.bind(this));
   }
 
   public async openDatabase(
     progress: ProgressCallback,
     token: vscode.CancellationToken,
     uri: vscode.Uri,
+    displayName?: string,
   ): Promise<DatabaseItem> {
     const contents = await resolveDatabaseContents(uri);
     // Ignore the source archive for QLTest databases by default.
-    const isQLTestDatabase = path.extname(uri.fsPath) === '.testproj';
+    const isQLTestDatabase = path.extname(uri.fsPath) === ".testproj";
     const fullOptions: FullDatabaseOptions = {
       ignoreSourceArchive: isQLTestDatabase,
-      // displayName is only set if a user explicitly renames a database
-      displayName: undefined,
+      // If a displayName is not passed in, the basename of folder containing the database is used.
+      displayName,
       dateAdded: Date.now(),
-      language: await this.getPrimaryLanguage(uri.fsPath)
+      language: await this.getPrimaryLanguage(uri.fsPath),
     };
-    const databaseItem = new DatabaseItemImpl(uri, contents, fullOptions, (event) => {
-      this._onDidChangeDatabaseItem.fire(event);
-    });
+    const databaseItem = new DatabaseItemImpl(
+      uri,
+      contents,
+      fullOptions,
+      (event) => {
+        this._onDidChangeDatabaseItem.fire(event);
+      },
+    );
 
     await this.addDatabaseItem(progress, token, databaseItem);
     await this.addDatabaseSourceArchiveFolder(databaseItem);
@@ -591,18 +622,20 @@ export class DatabaseManager extends DisposableObject {
 
   private async reregisterDatabases(
     progress: ProgressCallback,
-    token: vscode.CancellationToken
+    token: vscode.CancellationToken,
   ) {
     let completed = 0;
-    await Promise.all(this._databaseItems.map(async (databaseItem) => {
-      await this.registerDatabase(progress, token, databaseItem);
-      completed++;
-      progress({
-        maxStep: this._databaseItems.length,
-        step: completed,
-        message: 'Re-registering databases'
-      });
-    }));
+    await Promise.all(
+      this._databaseItems.map(async (databaseItem) => {
+        await this.registerDatabase(progress, token, databaseItem);
+        completed++;
+        progress({
+          maxStep: this._databaseItems.length,
+          step: completed,
+          message: "Re-registering databases",
+        });
+      }),
+    );
   }
 
   public async addDatabaseSourceArchiveFolder(item: DatabaseItem) {
@@ -629,12 +662,16 @@ export class DatabaseManager extends DisposableObject {
       }
 
       const uri = item.getSourceArchiveExplorerUri();
-      void logger.log(`Adding workspace folder for ${item.name} source archive at index ${end}`);
+      void logger.log(
+        `Adding workspace folder for ${item.name} source archive at index ${end}`,
+      );
       if ((vscode.workspace.workspaceFolders || []).length < 2) {
         // Adding this workspace folder makes the workspace
         // multi-root, which may surprise the user. Let them know
         // we're doing this.
-        void vscode.window.showInformationMessage(`Adding workspace folder for source archive of database ${item.name}.`);
+        void vscode.window.showInformationMessage(
+          `Adding workspace folder for source archive of database ${item.name}.`,
+        );
       }
       vscode.workspace.updateWorkspaceFolders(end, 0, {
         name: `[${item.name} source archive]`,
@@ -649,21 +686,20 @@ export class DatabaseManager extends DisposableObject {
   private async createDatabaseItemFromPersistedState(
     progress: ProgressCallback,
     token: vscode.CancellationToken,
-    state: PersistedDatabaseItem
+    state: PersistedDatabaseItem,
   ): Promise<DatabaseItem> {
-
     let displayName: string | undefined = undefined;
     let ignoreSourceArchive = false;
     let dateAdded = undefined;
     let language = undefined;
     if (state.options) {
-      if (typeof state.options.displayName === 'string') {
+      if (typeof state.options.displayName === "string") {
         displayName = state.options.displayName;
       }
-      if (typeof state.options.ignoreSourceArchive === 'boolean') {
+      if (typeof state.options.ignoreSourceArchive === "boolean") {
         ignoreSourceArchive = state.options.ignoreSourceArchive;
       }
-      if (typeof state.options.dateAdded === 'number') {
+      if (typeof state.options.dateAdded === "number") {
         dateAdded = state.options.dateAdded;
       }
       language = state.options.language;
@@ -679,56 +715,90 @@ export class DatabaseManager extends DisposableObject {
       ignoreSourceArchive,
       displayName,
       dateAdded,
-      language
+      language,
     };
-    const item = new DatabaseItemImpl(dbBaseUri, undefined, fullOptions,
+    const item = new DatabaseItemImpl(
+      dbBaseUri,
+      undefined,
+      fullOptions,
       (event) => {
         this._onDidChangeDatabaseItem.fire(event);
-      });
+      },
+    );
 
-    await this.addDatabaseItem(progress, token, item);
+    // Avoid persisting the database state after adding since that should happen only after
+    // all databases have been added.
+    await this.addDatabaseItem(progress, token, item, false);
     return item;
   }
 
-  private async loadPersistedState(): Promise<void> {
-    return withProgress({
-      location: vscode.ProgressLocation.Notification
-    },
+  public async loadPersistedState(): Promise<void> {
+    return withProgress(
+      {
+        location: vscode.ProgressLocation.Notification,
+      },
       async (progress, token) => {
-        const currentDatabaseUri = this.ctx.workspaceState.get<string>(CURRENT_DB);
-        const databases = this.ctx.workspaceState.get<PersistedDatabaseItem[]>(DB_LIST, []);
+        const currentDatabaseUri =
+          this.ctx.workspaceState.get<string>(CURRENT_DB);
+        const databases = this.ctx.workspaceState.get<PersistedDatabaseItem[]>(
+          DB_LIST,
+          [],
+        );
         let step = 0;
         progress({
           maxStep: databases.length,
-          message: 'Loading persisted databases',
-          step
+          message: "Loading persisted databases",
+          step,
         });
         try {
+          void this.logger.log(
+            `Found ${databases.length} persisted databases: ${databases
+              .map((db) => db.uri)
+              .join(", ")}`,
+          );
           for (const database of databases) {
             progress({
               maxStep: databases.length,
-              message: `Loading ${database.options?.displayName || 'databases'}`,
-              step: ++step
+              message: `Loading ${
+                database.options?.displayName || "databases"
+              }`,
+              step: ++step,
             });
 
-            const databaseItem = await this.createDatabaseItemFromPersistedState(progress, token, database);
+            const databaseItem =
+              await this.createDatabaseItemFromPersistedState(
+                progress,
+                token,
+                database,
+              );
             try {
               await databaseItem.refresh();
               await this.registerDatabase(progress, token, databaseItem);
               if (currentDatabaseUri === database.uri) {
                 await this.setCurrentDatabaseItem(databaseItem, true);
               }
-            }
-            catch (e) {
+              void this.logger.log(
+                `Loaded database ${databaseItem.name} at URI ${database.uri}.`,
+              );
+            } catch (e) {
               // When loading from persisted state, leave invalid databases in the list. They will be
               // marked as invalid, and cannot be set as the current database.
+              void this.logger.log(
+                `Error loading database ${database.uri}: ${e}.`,
+              );
             }
           }
+          await this.updatePersistedDatabaseList();
         } catch (e) {
           // database list had an unexpected type - nothing to be done?
-          void showAndLogErrorMessage(`Database list loading failed: ${e.message}`);
+          void showAndLogErrorMessage(
+            `Database list loading failed: ${getErrorMessage(e)}`,
+          );
         }
-      });
+
+        void this.logger.log("Finished loading persisted databases.");
+      },
+    );
   }
 
   public get databaseItems(): readonly DatabaseItem[] {
@@ -741,21 +811,24 @@ export class DatabaseManager extends DisposableObject {
 
   public async setCurrentDatabaseItem(
     item: DatabaseItem | undefined,
-    skipRefresh = false
+    skipRefresh = false,
   ): Promise<void> {
-
-    if (!skipRefresh && (item !== undefined)) {
-      await item.refresh();  // Will throw on invalid database.
+    if (!skipRefresh && item !== undefined) {
+      await item.refresh(); // Will throw on invalid database.
     }
     if (this._currentDatabaseItem !== item) {
       this._currentDatabaseItem = item;
       this.updatePersistedCurrentDatabaseItem();
 
-      await vscode.commands.executeCommand('setContext', 'codeQL.currentDatabaseItem', item?.name);
+      await vscode.commands.executeCommand(
+        "setContext",
+        "codeQL.currentDatabaseItem",
+        item?.name,
+      );
 
       this._onDidChangeCurrentDatabaseItem.fire({
         item,
-        kind: DatabaseEventKind.Change
+        kind: DatabaseEventKind.Change,
       });
     }
   }
@@ -765,27 +838,39 @@ export class DatabaseManager extends DisposableObject {
    * if there is one, and -1 otherwise.
    */
   private getDatabaseWorkspaceFolderIndex(item: DatabaseItem): number {
-    return (vscode.workspace.workspaceFolders || [])
-      .findIndex(folder => item.belongsToSourceArchiveExplorerUri(folder.uri));
+    return (vscode.workspace.workspaceFolders || []).findIndex((folder) =>
+      item.belongsToSourceArchiveExplorerUri(folder.uri),
+    );
   }
 
   public findDatabaseItem(uri: vscode.Uri): DatabaseItem | undefined {
     const uriString = uri.toString(true);
-    return this._databaseItems.find(item => item.databaseUri.toString(true) === uriString);
+    return this._databaseItems.find(
+      (item) => item.databaseUri.toString(true) === uriString,
+    );
   }
 
-  public findDatabaseItemBySourceArchive(uri: vscode.Uri): DatabaseItem | undefined {
+  public findDatabaseItemBySourceArchive(
+    uri: vscode.Uri,
+  ): DatabaseItem | undefined {
     const uriString = uri.toString(true);
-    return this._databaseItems.find(item => item.sourceArchive && item.sourceArchive.toString(true) === uriString);
+    return this._databaseItems.find(
+      (item) =>
+        item.sourceArchive && item.sourceArchive.toString(true) === uriString,
+    );
   }
 
   private async addDatabaseItem(
     progress: ProgressCallback,
     token: vscode.CancellationToken,
-    item: DatabaseItem
+    item: DatabaseItem,
+    updatePersistedState = true,
   ) {
     this._databaseItems.push(item);
-    await this.updatePersistedDatabaseList();
+
+    if (updatePersistedState) {
+      await this.updatePersistedDatabaseList();
+    }
 
     // Add this database item to the allow-list
     // Database items reconstituted from persisted state
@@ -796,7 +881,7 @@ export class DatabaseManager extends DisposableObject {
     // note that we use undefined as the item in order to reset the entire tree
     this._onDidChangeDatabaseItem.fire({
       item: undefined,
-      kind: DatabaseEventKind.Add
+      kind: DatabaseEventKind.Add,
     });
   }
 
@@ -806,19 +891,21 @@ export class DatabaseManager extends DisposableObject {
     this._onDidChangeDatabaseItem.fire({
       // pass undefined so that the entire tree is rebuilt in order to re-sort
       item: undefined,
-      kind: DatabaseEventKind.Rename
+      kind: DatabaseEventKind.Rename,
     });
   }
 
   public async removeDatabaseItem(
     progress: ProgressCallback,
     token: vscode.CancellationToken,
-    item: DatabaseItem
+    item: DatabaseItem,
   ) {
     if (this._currentDatabaseItem == item) {
       this._currentDatabaseItem = undefined;
     }
-    const index = this.databaseItems.findIndex(searchItem => searchItem === item);
+    const index = this.databaseItems.findIndex(
+      (searchItem) => searchItem === item,
+    );
     if (index >= 0) {
       this._databaseItems.splice(index, 1);
     }
@@ -826,7 +913,7 @@ export class DatabaseManager extends DisposableObject {
 
     // Delete folder from workspace, if it is still there
     const folderIndex = (vscode.workspace.workspaceFolders || []).findIndex(
-      folder => item.belongsToSourceArchiveExplorerUri(folder.uri)
+      (folder) => item.belongsToSourceArchiveExplorerUri(folder.uri),
     );
     if (folderIndex >= 0) {
       void logger.log(`Removing workspace folder at index ${folderIndex}`);
@@ -838,16 +925,22 @@ export class DatabaseManager extends DisposableObject {
 
     // Delete folder from file system only if it is controlled by the extension
     if (this.isExtensionControlledLocation(item.databaseUri)) {
-      void logger.log('Deleting database from filesystem.');
+      void logger.log("Deleting database from filesystem.");
       fs.remove(item.databaseUri.fsPath).then(
         () => void logger.log(`Deleted '${item.databaseUri.fsPath}'`),
-        e => void logger.log(`Failed to delete '${item.databaseUri.fsPath}'. Reason: ${e.message}`));
+        (e) =>
+          void logger.log(
+            `Failed to delete '${
+              item.databaseUri.fsPath
+            }'. Reason: ${getErrorMessage(e)}`,
+          ),
+      );
     }
 
     // note that we use undefined as the item in order to reset the entire tree
     this._onDidChangeDatabaseItem.fire({
       item: undefined,
-      kind: DatabaseEventKind.Remove
+      kind: DatabaseEventKind.Remove,
     });
   }
 
@@ -856,36 +949,30 @@ export class DatabaseManager extends DisposableObject {
     token: vscode.CancellationToken,
     dbItem: DatabaseItem,
   ) {
-    if (dbItem.contents && (await this.cli.cliConstraints.supportsDatabaseRegistration())) {
-      const databases: Dataset[] = [{
-        dbDir: dbItem.contents.datasetUri.fsPath,
-        workingSet: 'default'
-      }];
-      await this.qs.sendRequest(deregisterDatabases, { databases }, token, progress);
-    }
+    await this.qs.deregisterDatabase(progress, token, dbItem);
   }
-
   private async registerDatabase(
     progress: ProgressCallback,
     token: vscode.CancellationToken,
     dbItem: DatabaseItem,
   ) {
-    if (dbItem.contents && (await this.cli.cliConstraints.supportsDatabaseRegistration())) {
-      const databases: Dataset[] = [{
-        dbDir: dbItem.contents.datasetUri.fsPath,
-        workingSet: 'default'
-      }];
-      await this.qs.sendRequest(registerDatabases, { databases }, token, progress);
-    }
+    await this.qs.registerDatabase(progress, token, dbItem);
   }
 
   private updatePersistedCurrentDatabaseItem(): void {
-    void this.ctx.workspaceState.update(CURRENT_DB, this._currentDatabaseItem ?
-      this._currentDatabaseItem.databaseUri.toString(true) : undefined);
+    void this.ctx.workspaceState.update(
+      CURRENT_DB,
+      this._currentDatabaseItem
+        ? this._currentDatabaseItem.databaseUri.toString(true)
+        : undefined,
+    );
   }
 
   private async updatePersistedDatabaseList(): Promise<void> {
-    await this.ctx.workspaceState.update(DB_LIST, this._databaseItems.map(item => item.getPersistedState()));
+    await this.ctx.workspaceState.update(
+      DB_LIST,
+      this._databaseItems.map((item) => item.getPersistedState()),
+    );
   }
 
   private isExtensionControlledLocation(uri: vscode.Uri) {
@@ -907,7 +994,7 @@ export class DatabaseManager extends DisposableObject {
       return undefined;
     }
     const dbInfo = await this.cli.resolveDatabase(dbPath);
-    return dbInfo.languages?.[0] || '';
+    return dbInfo.languages?.[0] || "";
   }
 }
 
@@ -916,7 +1003,9 @@ export class DatabaseManager extends DisposableObject {
  * scripts returned by the cli's upgrade resolution.
  */
 export function getUpgradesDirectories(scripts: string[]): vscode.Uri[] {
-  const parentDirs = scripts.map(dir => path.dirname(dir));
+  const parentDirs = scripts.map((dir) => path.dirname(dir));
   const uniqueParentDirs = new Set(parentDirs);
-  return Array.from(uniqueParentDirs).map(filePath => vscode.Uri.file(filePath));
+  return Array.from(uniqueParentDirs).map((filePath) =>
+    vscode.Uri.file(filePath),
+  );
 }

extensions/ql-vscode/src/databases/README.md

@@ -0,0 +1,3 @@
+### Databases
+
+This folder contains code for the new experimental databases panel and new query run experience.

extensions/ql-vscode/src/databases/config/db-config-store.ts

@@ -0,0 +1,121 @@
+import * as fs from "fs-extra";
+import * as path from "path";
+import { cloneDbConfig, DbConfig } from "./db-config";
+import * as chokidar from "chokidar";
+import { DisposableObject } from "../../pure/disposable-object";
+import { DbConfigValidator } from "./db-config-validator";
+import { ValueResult } from "../../common/value-result";
+import { App } from "../../common/app";
+import { AppEvent, AppEventEmitter } from "../../common/events";
+
+export class DbConfigStore extends DisposableObject {
+  public readonly onDidChangeConfig: AppEvent<void>;
+  private readonly onDidChangeConfigEventEmitter: AppEventEmitter<void>;
+
+  private readonly configPath: string;
+  private readonly configValidator: DbConfigValidator;
+
+  private config: DbConfig | undefined;
+  private configErrors: string[];
+  private configWatcher: chokidar.FSWatcher | undefined;
+
+  public constructor(app: App) {
+    super();
+
+    const storagePath = app.workspaceStoragePath || app.globalStoragePath;
+    this.configPath = path.join(storagePath, "workspace-databases.json");
+
+    this.config = this.createEmptyConfig();
+    this.configErrors = [];
+    this.configWatcher = undefined;
+    this.configValidator = new DbConfigValidator(app.extensionPath);
+    this.onDidChangeConfigEventEmitter = app.createEventEmitter<void>();
+    this.onDidChangeConfig = this.onDidChangeConfigEventEmitter.event;
+  }
+
+  public async initialize(): Promise<void> {
+    await this.loadConfig();
+    this.watchConfig();
+  }
+
+  public dispose(): void {
+    this.configWatcher?.unwatch(this.configPath);
+  }
+
+  public getConfig(): ValueResult<DbConfig> {
+    if (this.config) {
+      // Clone the config so that it's not modified outside of this class.
+      return ValueResult.ok(cloneDbConfig(this.config));
+    } else {
+      return ValueResult.fail(this.configErrors);
+    }
+  }
+
+  public getConfigPath(): string {
+    return this.configPath;
+  }
+
+  private async loadConfig(): Promise<void> {
+    if (!(await fs.pathExists(this.configPath))) {
+      await fs.writeJSON(this.configPath, this.createEmptyConfig(), {
+        spaces: 2,
+      });
+    }
+
+    await this.readConfig();
+  }
+
+  private async readConfig(): Promise<void> {
+    let newConfig: DbConfig | undefined = undefined;
+    try {
+      newConfig = await fs.readJSON(this.configPath);
+    } catch (e) {
+      this.configErrors = [`Failed to read config file: ${this.configPath}`];
+    }
+
+    if (newConfig) {
+      this.configErrors = this.configValidator.validate(newConfig);
+    }
+
+    this.config = this.configErrors.length === 0 ? newConfig : undefined;
+  }
+
+  private readConfigSync(): void {
+    let newConfig: DbConfig | undefined = undefined;
+    try {
+      newConfig = fs.readJSONSync(this.configPath);
+    } catch (e) {
+      this.configErrors = [`Failed to read config file: ${this.configPath}`];
+    }
+
+    if (newConfig) {
+      this.configErrors = this.configValidator.validate(newConfig);
+    }
+
+    this.config = this.configErrors.length === 0 ? newConfig : undefined;
+
+    this.onDidChangeConfigEventEmitter.fire();
+  }
+
+  private watchConfig(): void {
+    this.configWatcher = chokidar.watch(this.configPath).on("change", () => {
+      this.readConfigSync();
+    });
+  }
+
+  private createEmptyConfig(): DbConfig {
+    return {
+      databases: {
+        remote: {
+          repositoryLists: [],
+          owners: [],
+          repositories: [],
+        },
+        local: {
+          lists: [],
+          databases: [],
+        },
+      },
+    };
+  }
+}

extensions/ql-vscode/src/databases/config/db-config-validator.ts

@@ -0,0 +1,29 @@
+import * as fs from "fs-extra";
+import * as path from "path";
+import Ajv from "ajv";
+import { DbConfig } from "./db-config";
+
+export class DbConfigValidator {
+  private readonly schema: any;
+
+  constructor(extensionPath: string) {
+    const schemaPath = path.resolve(
+      extensionPath,
+      "workspace-databases-schema.json",
+    );
+    this.schema = fs.readJsonSync(schemaPath);
+  }
+
+  public validate(dbConfig: DbConfig): string[] {
+    const ajv = new Ajv({ allErrors: true });
+    ajv.validate(this.schema, dbConfig);
+
+    if (ajv.errors) {
+      return ajv.errors.map(
+        (error) => `${error.instancePath} ${error.message}`,
+      );
+    }
+
+    return [];
+  }
+}

extensions/ql-vscode/src/databases/config/db-config.ts

@@ -0,0 +1,79 @@
+// Contains models for the data we want to store in the database config
+
+export interface DbConfig {
+  databases: DbConfigDatabases;
+  selected?: SelectedDbItem;
+}
+
+export interface DbConfigDatabases {
+  remote: RemoteDbConfig;
+  local: LocalDbConfig;
+}
+
+export interface SelectedDbItem {
+  kind: SelectedDbItemKind;
+  value: string;
+}
+
+export enum SelectedDbItemKind {
+  ConfigDefined = "configDefined",
+  RemoteSystemDefinedList = "remoteSystemDefinedList",
+}
+
+export interface RemoteDbConfig {
+  repositoryLists: RemoteRepositoryList[];
+  owners: string[];
+  repositories: string[];
+}
+
+export interface RemoteRepositoryList {
+  name: string;
+  repositories: string[];
+}
+
+export interface LocalDbConfig {
+  lists: LocalList[];
+  databases: LocalDatabase[];
+}
+
+export interface LocalList {
+  name: string;
+  databases: LocalDatabase[];
+}
+
+export interface LocalDatabase {
+  name: string;
+  dateAdded: number;
+  language: string;
+  storagePath: string;
+}
+
+export function cloneDbConfig(config: DbConfig): DbConfig {
+  return {
+    databases: {
+      remote: {
+        repositoryLists: config.databases.remote.repositoryLists.map(
+          (list) => ({
+            name: list.name,
+            repositories: [...list.repositories],
+          }),
+        ),
+        owners: [...config.databases.remote.owners],
+        repositories: [...config.databases.remote.repositories],
+      },
+      local: {
+        lists: config.databases.local.lists.map((list) => ({
+          name: list.name,
+          databases: list.databases.map((db) => ({ ...db })),
+        })),
+        databases: config.databases.local.databases.map((db) => ({ ...db })),
+      },
+    },
+    selected: config.selected
+      ? {
+          kind: config.selected.kind,
+          value: config.selected.value,
+        }
+      : undefined,
+  };
+}

extensions/ql-vscode/src/databases/db-item.ts

@@ -0,0 +1,73 @@
+// This file contains models that are used to represent the databases.
+
+export enum DbItemKind {
+  RootLocal = "RootLocal",
+  LocalList = "LocalList",
+  LocalDatabase = "LocalDatabase",
+  RootRemote = "RootRemote",
+  RemoteSystemDefinedList = "RemoteSystemDefinedList",
+  RemoteUserDefinedList = "RemoteUserDefinedList",
+  RemoteOwner = "RemoteOwner",
+  RemoteRepo = "RemoteRepo",
+}
+
+export interface RootLocalDbItem {
+  kind: DbItemKind.RootLocal;
+  children: LocalDbItem[];
+}
+
+export type LocalDbItem = LocalListDbItem | LocalDatabaseDbItem;
+
+export interface LocalListDbItem {
+  kind: DbItemKind.LocalList;
+  listName: string;
+  databases: LocalDatabaseDbItem[];
+}
+
+export interface LocalDatabaseDbItem {
+  kind: DbItemKind.LocalDatabase;
+  databaseName: string;
+  dateAdded: number;
+  language: string;
+  storagePath: string;
+}
+
+export interface RootRemoteDbItem {
+  kind: DbItemKind.RootRemote;
+  children: RemoteDbItem[];
+}
+
+export type DbItem =
+  | RootLocalDbItem
+  | RootRemoteDbItem
+  | RemoteDbItem
+  | LocalDbItem;
+
+export type RemoteDbItem =
+  | RemoteSystemDefinedListDbItem
+  | RemoteUserDefinedListDbItem
+  | RemoteOwnerDbItem
+  | RemoteRepoDbItem;
+
+export interface RemoteSystemDefinedListDbItem {
+  kind: DbItemKind.RemoteSystemDefinedList;
+  listName: string;
+  listDisplayName: string;
+  listDescription: string;
+}
+
+export interface RemoteUserDefinedListDbItem {
+  kind: DbItemKind.RemoteUserDefinedList;
+  listName: string;
+  repos: RemoteRepoDbItem[];
+}
+
+export interface RemoteOwnerDbItem {
+  kind: DbItemKind.RemoteOwner;
+  ownerName: string;
+}
+
+export interface RemoteRepoDbItem {
+  kind: DbItemKind.RemoteRepo;
+  repoFullName: string;
+}

extensions/ql-vscode/src/databases/db-manager.ts

@@ -0,0 +1,36 @@
+import { App } from "../common/app";
+import { AppEvent, AppEventEmitter } from "../common/events";
+import { ValueResult } from "../common/value-result";
+import { DbConfigStore } from "./config/db-config-store";
+import { DbItem } from "./db-item";
+import { createLocalTree, createRemoteTree } from "./db-tree-creator";
+
+export class DbManager {
+  public readonly onDbItemsChanged: AppEvent<void>;
+  private readonly onDbItemsChangesEventEmitter: AppEventEmitter<void>;
+
+  constructor(app: App, private readonly dbConfigStore: DbConfigStore) {
+    this.onDbItemsChangesEventEmitter = app.createEventEmitter<void>();
+    this.onDbItemsChanged = this.onDbItemsChangesEventEmitter.event;
+
+    this.dbConfigStore.onDidChangeConfig(() => {
+      this.onDbItemsChangesEventEmitter.fire();
+    });
+  }
+
+  public getDbItems(): ValueResult<DbItem[]> {
+    const configResult = this.dbConfigStore.getConfig();
+    if (configResult.isFailure) {
+      return ValueResult.fail(configResult.errors);
+    }
+
+    return ValueResult.ok([
+      createRemoteTree(configResult.value),
+      createLocalTree(configResult.value),
+    ]);
+  }
+
+  public getConfigPath(): string {
+    return this.dbConfigStore.getConfigPath();
+  }
+}

extensions/ql-vscode/src/databases/db-module.ts

@@ -0,0 +1,40 @@
+import { App, AppMode } from "../common/app";
+import { isCanary, isNewQueryRunExperienceEnabled } from "../config";
+import { logger } from "../logging";
+import { DisposableObject } from "../pure/disposable-object";
+import { DbConfigStore } from "./config/db-config-store";
+import { DbManager } from "./db-manager";
+import { DbPanel } from "./ui/db-panel";
+
+export class DbModule extends DisposableObject {
+  public async initialize(app: App): Promise<void> {
+    if (
+      app.mode !== AppMode.Development ||
+      !isCanary() ||
+      !isNewQueryRunExperienceEnabled()
+    ) {
+      // Currently, we only want to expose the new database panel when we
+      // are in development and canary mode and the developer has enabled the
+      // new query run experience.
+      return;
+    }
+
+    void logger.log("Initializing database module");
+
+    const dbConfigStore = new DbConfigStore(app);
+    await dbConfigStore.initialize();
+
+    const dbManager = new DbManager(app, dbConfigStore);
+    const dbPanel = new DbPanel(dbManager);
+    await dbPanel.initialize();
+
+    this.push(dbPanel);
+    this.push(dbConfigStore);
+  }
+}
+
+export async function initializeDbModule(app: App): Promise<DbModule> {
+  const dbModule = new DbModule();
+  await dbModule.initialize(app);
+  return dbModule;
+}

extensions/ql-vscode/src/databases/db-tree-creator.ts

@@ -0,0 +1,102 @@
+import {
+  DbConfig,
+  LocalDatabase,
+  LocalList,
+  RemoteRepositoryList,
+} from "./config/db-config";
+import {
+  DbItemKind,
+  LocalDatabaseDbItem,
+  LocalListDbItem,
+  RemoteOwnerDbItem,
+  RemoteRepoDbItem,
+  RemoteSystemDefinedListDbItem,
+  RemoteUserDefinedListDbItem,
+  RootLocalDbItem,
+  RootRemoteDbItem,
+} from "./db-item";
+
+export function createRemoteTree(dbConfig: DbConfig): RootRemoteDbItem {
+  const systemDefinedLists = [
+    createSystemDefinedList(10),
+    createSystemDefinedList(100),
+    createSystemDefinedList(1000),
+  ];
+
+  const userDefinedRepoLists = dbConfig.databases.remote.repositoryLists.map(
+    createUserDefinedList,
+  );
+  const owners = dbConfig.databases.remote.owners.map(createOwnerItem);
+  const repos = dbConfig.databases.remote.repositories.map(createRepoItem);
+
+  return {
+    kind: DbItemKind.RootRemote,
+    children: [
+      ...systemDefinedLists,
+      ...owners,
+      ...userDefinedRepoLists,
+      ...repos,
+    ],
+  };
+}
+
+export function createLocalTree(dbConfig: DbConfig): RootLocalDbItem {
+  const localLists = dbConfig.databases.local.lists.map(createLocalList);
+  const localDbs = dbConfig.databases.local.databases.map(createLocalDb);
+
+  return {
+    kind: DbItemKind.RootLocal,
+    children: [...localLists, ...localDbs],
+  };
+}
+
+function createSystemDefinedList(n: number): RemoteSystemDefinedListDbItem {
+  return {
+    kind: DbItemKind.RemoteSystemDefinedList,
+    listName: `top_${n}`,
+    listDisplayName: `Top ${n} repositories`,
+    listDescription: `Top ${n} repositories of a language`,
+  };
+}
+
+function createUserDefinedList(
+  list: RemoteRepositoryList,
+): RemoteUserDefinedListDbItem {
+  return {
+    kind: DbItemKind.RemoteUserDefinedList,
+    listName: list.name,
+    repos: list.repositories.map((r) => createRepoItem(r)),
+  };
+}
+
+function createOwnerItem(owner: string): RemoteOwnerDbItem {
+  return {
+    kind: DbItemKind.RemoteOwner,
+    ownerName: owner,
+  };
+}
+
+function createRepoItem(repo: string): RemoteRepoDbItem {
+  return {
+    kind: DbItemKind.RemoteRepo,
+    repoFullName: repo,
+  };
+}
+
+function createLocalList(list: LocalList): LocalListDbItem {
+  return {
+    kind: DbItemKind.LocalList,
+    listName: list.name,
+    databases: list.databases.map(createLocalDb),
+  };
+}
+
+function createLocalDb(db: LocalDatabase): LocalDatabaseDbItem {
+  return {
+    kind: DbItemKind.LocalDatabase,
+    databaseName: db.name,
+    dateAdded: db.dateAdded,
+    language: db.language,
+    storagePath: db.storagePath,
+  };
+}

extensions/ql-vscode/src/databases/ui/db-item-mapper.ts

@@ -0,0 +1,64 @@
+import { DbItem, DbItemKind } from "../db-item";
+import {
+  createDbTreeViewItemLocalDatabase,
+  createDbTreeViewItemOwner,
+  createDbTreeViewItemRepo,
+  createDbTreeViewItemRoot,
+  createDbTreeViewItemSystemDefinedList,
+  createDbTreeViewItemUserDefinedList,
+  DbTreeViewItem,
+} from "./db-tree-view-item";
+
+export function mapDbItemToTreeViewItem(dbItem: DbItem): DbTreeViewItem {
+  switch (dbItem.kind) {
+    case DbItemKind.RootLocal:
+      return createDbTreeViewItemRoot(
+        dbItem,
+        "local",
+        "Local databases",
+        dbItem.children.map((c) => mapDbItemToTreeViewItem(c)),
+      );
+
+    case DbItemKind.RootRemote:
+      return createDbTreeViewItemRoot(
+        dbItem,
+        "remote",
+        "Remote databases",
+        dbItem.children.map((c) => mapDbItemToTreeViewItem(c)),
+      );
+
+    case DbItemKind.RemoteSystemDefinedList:
+      return createDbTreeViewItemSystemDefinedList(
+        dbItem,
+        dbItem.listDisplayName,
+        dbItem.listDescription,
+      );
+
+    case DbItemKind.RemoteUserDefinedList:
+      return createDbTreeViewItemUserDefinedList(
+        dbItem,
+        dbItem.listName,
+        dbItem.repos.map(mapDbItemToTreeViewItem),
+      );
+
+    case DbItemKind.RemoteOwner:
+      return createDbTreeViewItemOwner(dbItem, dbItem.ownerName);
+
+    case DbItemKind.RemoteRepo:
+      return createDbTreeViewItemRepo(dbItem, dbItem.repoFullName);
+
+    case DbItemKind.LocalList:
+      return createDbTreeViewItemUserDefinedList(
+        dbItem,
+        dbItem.listName,
+        dbItem.databases.map(mapDbItemToTreeViewItem),
+      );
+
+    case DbItemKind.LocalDatabase:
+      return createDbTreeViewItemLocalDatabase(
+        dbItem,
+        dbItem.databaseName,
+        dbItem.language,
+      );
+  }
+}

extensions/ql-vscode/src/databases/ui/db-panel.ts

@@ -0,0 +1,39 @@
+import * as vscode from "vscode";
+import { commandRunner } from "../../commandRunner";
+import { DisposableObject } from "../../pure/disposable-object";
+import { DbManager } from "../db-manager";
+import { DbTreeDataProvider } from "./db-tree-data-provider";
+
+export class DbPanel extends DisposableObject {
+  private readonly dataProvider: DbTreeDataProvider;
+
+  public constructor(private readonly dbManager: DbManager) {
+    super();
+
+    this.dataProvider = new DbTreeDataProvider(dbManager);
+
+    const treeView = vscode.window.createTreeView(
+      "codeQLDatabasesExperimental",
+      {
+        treeDataProvider: this.dataProvider,
+        canSelectMany: false,
+      },
+    );
+
+    this.push(treeView);
+  }
+
+  public async initialize(): Promise<void> {
+    this.push(
+      commandRunner("codeQLDatabasesExperimental.openConfigFile", () =>
+        this.openConfigFile(),
+      ),
+    );
+  }
+
+  private async openConfigFile(): Promise<void> {
+    const configPath = this.dbManager.getConfigPath();
+    const document = await vscode.workspace.openTextDocument(configPath);
+    await vscode.window.showTextDocument(document);
+  }
+}

extensions/ql-vscode/src/databases/ui/db-tree-data-provider.ts

@@ -0,0 +1,74 @@
+import {
+  Event,
+  EventEmitter,
+  ProviderResult,
+  TreeDataProvider,
+  TreeItem,
+} from "vscode";
+import { createDbTreeViewItemError, DbTreeViewItem } from "./db-tree-view-item";
+import { DbManager } from "../db-manager";
+import { mapDbItemToTreeViewItem } from "./db-item-mapper";
+import { DisposableObject } from "../../pure/disposable-object";
+
+export class DbTreeDataProvider
+  extends DisposableObject
+  implements TreeDataProvider<DbTreeViewItem>
+{
+  // This is an event to signal that there's been a change in the tree which
+  // will case the view to refresh. It is part of the TreeDataProvider interface.
+  public readonly onDidChangeTreeData: Event<DbTreeViewItem | undefined>;
+
+  private _onDidChangeTreeData = this.push(
+    new EventEmitter<DbTreeViewItem | undefined>(),
+  );
+  private dbTreeItems: DbTreeViewItem[];
+
+  public constructor(private readonly dbManager: DbManager) {
+    super();
+    this.dbTreeItems = this.createTree();
+    this.onDidChangeTreeData = this._onDidChangeTreeData.event;
+
+    dbManager.onDbItemsChanged(() => {
+      this.dbTreeItems = this.createTree();
+      this._onDidChangeTreeData.fire(undefined);
+    });
+  }
+
+  /**
+   * Called when expanding a node (including the root node).
+   * @param node The node to expand.
+   * @returns The children of the node.
+   */
+  public getChildren(node?: DbTreeViewItem): ProviderResult<DbTreeViewItem[]> {
+    if (!node) {
+      // We're at the root.
+      return Promise.resolve(this.dbTreeItems);
+    } else {
+      return Promise.resolve(node.children);
+    }
+  }
+
+  /**
+   * Returns the UI presentation of the element that gets displayed in the view.
+   * @param node The node to represent.
+   * @returns The UI presentation of the node.
+   */
+  public getTreeItem(node: DbTreeViewItem): TreeItem | Thenable<TreeItem> {
+    return node;
+  }
+
+  private createTree(): DbTreeViewItem[] {
+    const dbItemsResult = this.dbManager.getDbItems();
+
+    if (dbItemsResult.isFailure) {
+      const errorTreeViewItem = createDbTreeViewItemError(
+        "Error when reading databases config",
+        "Please open your databases config and address errors",
+      );
+
+      return [errorTreeViewItem];
+    }
+
+    return dbItemsResult.value.map(mapDbItemToTreeViewItem);
+  }
+}

extensions/ql-vscode/src/databases/ui/db-tree-view-item.ts

@@ -0,0 +1,138 @@
+import * as vscode from "vscode";
+import {
+  DbItem,
+  LocalDatabaseDbItem,
+  LocalListDbItem,
+  RemoteOwnerDbItem,
+  RemoteRepoDbItem,
+  RemoteSystemDefinedListDbItem,
+  RemoteUserDefinedListDbItem,
+  RootLocalDbItem,
+  RootRemoteDbItem,
+} from "../db-item";
+
+/**
+ * Represents an item in the database tree view. This item could be
+ * representing an actual database item or a warning.
+ */
+export class DbTreeViewItem extends vscode.TreeItem {
+  constructor(
+    // iconPath and tooltip must have those names because
+    // they are part of the vscode.TreeItem interface
+
+    public readonly dbItem: DbItem | undefined,
+    public readonly iconPath: vscode.ThemeIcon | undefined,
+    public readonly label: string,
+    public readonly tooltip: string | undefined,
+    public readonly collapsibleState: vscode.TreeItemCollapsibleState,
+    public readonly children: DbTreeViewItem[],
+  ) {
+    super(label, collapsibleState);
+  }
+}
+
+export function createDbTreeViewItemError(
+  label: string,
+  tooltip: string,
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    undefined,
+    new vscode.ThemeIcon(
+      "error",
+      new vscode.ThemeColor("problemsErrorIcon.foreground"),
+    ),
+    label,
+    tooltip,
+    vscode.TreeItemCollapsibleState.None,
+    [],
+  );
+}
+
+export function createDbTreeViewItemRoot(
+  dbItem: RootLocalDbItem | RootRemoteDbItem,
+  label: string,
+  tooltip: string,
+  children: DbTreeViewItem[],
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    undefined,
+    label,
+    tooltip,
+    vscode.TreeItemCollapsibleState.Collapsed,
+    children,
+  );
+}
+
+export function createDbTreeViewItemSystemDefinedList(
+  dbItem: RemoteSystemDefinedListDbItem,
+  label: string,
+  tooltip: string,
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    new vscode.ThemeIcon("github"),
+    label,
+    tooltip,
+    vscode.TreeItemCollapsibleState.None,
+    [],
+  );
+}
+
+export function createDbTreeViewItemUserDefinedList(
+  dbItem: LocalListDbItem | RemoteUserDefinedListDbItem,
+  listName: string,
+  children: DbTreeViewItem[],
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    undefined,
+    listName,
+    undefined,
+    vscode.TreeItemCollapsibleState.Collapsed,
+    children,
+  );
+}
+
+export function createDbTreeViewItemOwner(
+  dbItem: RemoteOwnerDbItem,
+  ownerName: string,
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    new vscode.ThemeIcon("organization"),
+    ownerName,
+    undefined,
+    vscode.TreeItemCollapsibleState.None,
+    [],
+  );
+}
+
+export function createDbTreeViewItemRepo(
+  dbItem: RemoteRepoDbItem,
+  repoName: string,
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    new vscode.ThemeIcon("database"),
+    repoName,
+    undefined,
+    vscode.TreeItemCollapsibleState.None,
+    [],
+  );
+}
+
+export function createDbTreeViewItemLocalDatabase(
+  dbItem: LocalDatabaseDbItem,
+  databaseName: string,
+  language: string,
+): DbTreeViewItem {
+  return new DbTreeViewItem(
+    dbItem,
+    new vscode.ThemeIcon("database"),
+    databaseName,
+    `Language: ${language}`,
+    vscode.TreeItemCollapsibleState.None,
+    [],
+  );
+}

extensions/ql-vscode/src/discovery.ts

@@ -1,5 +1,5 @@
-import { DisposableObject } from './pure/disposable-object';
-import { logger } from './logging';
+import { DisposableObject } from "./pure/disposable-object";
+import { logger } from "./logging";
 
 /**
  * Base class for "discovery" operations, which scan the file system to find specific kinds of
@@ -38,8 +38,7 @@ export abstract class Discovery<T> extends DisposableObject {
     if (this.discoveryInProgress) {
       // There's already a discovery operation in progress. Tell it to restart when it's done.
       this.retry = true;
-    }
-    else {
+    } else {
       // No discovery in progress, so start one now.
       this.discoveryInProgress = true;
       this.launchDiscovery();
@@ -53,15 +52,16 @@ export abstract class Discovery<T> extends DisposableObject {
    */
   private launchDiscovery(): void {
     const discoveryPromise = this.discover();
-    discoveryPromise.then(results => {
-      if (!this.retry) {
-        // Update any listeners with the results of the discovery.
-        this.discoveryInProgress = false;
-        this.update(results);
-      }
-    })
+    discoveryPromise
+      .then((results) => {
+        if (!this.retry) {
+          // Update any listeners with the results of the discovery.
+          this.discoveryInProgress = false;
+          this.update(results);
+        }
+      })
 
-      .catch(err => {
+      .catch((err) => {
         void logger.log(`${this.name} failed. Reason: ${err.message}`);
       })
 

extensions/ql-vscode/src/distribution.ts

@@ -1,21 +1,21 @@
-import * as fetch from 'node-fetch';
-import * as fs from 'fs-extra';
-import * as os from 'os';
-import * as path from 'path';
-import * as semver from 'semver';
-import * as unzipper from 'unzipper';
-import * as url from 'url';
-import { ExtensionContext, Event } from 'vscode';
-import { DistributionConfig } from './config';
+import * as fetch from "node-fetch";
+import * as fs from "fs-extra";
+import * as os from "os";
+import * as path from "path";
+import * as semver from "semver";
+import * as unzipper from "unzipper";
+import * as url from "url";
+import { ExtensionContext, Event } from "vscode";
+import { DistributionConfig } from "./config";
 import {
   InvocationRateLimiter,
   InvocationRateLimiterResultKind,
   showAndLogErrorMessage,
-  showAndLogWarningMessage
-} from './helpers';
-import { logger } from './logging';
-import { getCodeQlCliVersion } from './cli-version';
-import { ProgressCallback, reportStreamProgress } from './commandRunner';
+  showAndLogWarningMessage,
+} from "./helpers";
+import { logger } from "./logging";
+import { getCodeQlCliVersion } from "./cli-version";
+import { ProgressCallback, reportStreamProgress } from "./commandRunner";
 
 /**
  * distribution.ts
@@ -30,7 +30,7 @@ import { ProgressCallback, reportStreamProgress } from './commandRunner';
  * We set the default here rather than as a default config value so that this default is invoked
  * upon blanking the setting.
  */
-const DEFAULT_DISTRIBUTION_OWNER_NAME = 'github';
+const DEFAULT_DISTRIBUTION_OWNER_NAME = "github";
 
 /**
  * Default value for the repository name of the extension-managed distribution on GitHub.
@@ -38,14 +38,15 @@ const DEFAULT_DISTRIBUTION_OWNER_NAME = 'github';
  * We set the default here rather than as a default config value so that this default is invoked
  * upon blanking the setting.
  */
-const DEFAULT_DISTRIBUTION_REPOSITORY_NAME = 'codeql-cli-binaries';
+const DEFAULT_DISTRIBUTION_REPOSITORY_NAME = "codeql-cli-binaries";
 
 /**
  * Range of versions of the CLI that are compatible with the extension.
  *
  * This applies to both extension-managed and CLI distributions.
  */
-export const DEFAULT_DISTRIBUTION_VERSION_RANGE: semver.Range = new semver.Range('2.x');
+export const DEFAULT_DISTRIBUTION_VERSION_RANGE: semver.Range =
+  new semver.Range("2.x");
 
 export interface DistributionProvider {
   getCodeQlPathWithoutVersionCheck(): Promise<string | undefined>;
@@ -54,35 +55,39 @@ export interface DistributionProvider {
 }
 
 export class DistributionManager implements DistributionProvider {
-
   /**
    * Get the name of the codeql cli installation we prefer to install, based on our current platform.
    */
   public static getRequiredAssetName(): string {
     switch (os.platform()) {
-      case 'linux':
-        return 'codeql-linux64.zip';
-      case 'darwin':
-        return 'codeql-osx64.zip';
-      case 'win32':
-        return 'codeql-win64.zip';
+      case "linux":
+        return "codeql-linux64.zip";
+      case "darwin":
+        return "codeql-osx64.zip";
+      case "win32":
+        return "codeql-win64.zip";
       default:
-        return 'codeql.zip';
+        return "codeql.zip";
     }
   }
 
   constructor(
     public readonly config: DistributionConfig,
     private readonly versionRange: semver.Range,
-    extensionContext: ExtensionContext
+    extensionContext: ExtensionContext,
   ) {
     this._onDidChangeDistribution = config.onDidChangeConfiguration;
     this.extensionSpecificDistributionManager =
-      new ExtensionSpecificDistributionManager(config, versionRange, extensionContext);
+      new ExtensionSpecificDistributionManager(
+        config,
+        versionRange,
+        extensionContext,
+      );
     this.updateCheckRateLimiter = new InvocationRateLimiter(
       extensionContext,
-      'extensionSpecificDistributionUpdateCheck',
-      () => this.extensionSpecificDistributionManager.checkForUpdatesToDistribution()
+      "extensionSpecificDistributionUpdateCheck",
+      () =>
+        this.extensionSpecificDistributionManager.checkForUpdatesToDistribution(),
     );
   }
 
@@ -120,7 +125,9 @@ export class DistributionManager implements DistributionProvider {
      * - If the user is using an extension-managed CLI, then prereleases are only accepted when the
      * includePrerelease config option is set.
      */
-    const includePrerelease = distribution.kind !== DistributionKind.ExtensionManaged || this.config.includePrerelease;
+    const includePrerelease =
+      distribution.kind !== DistributionKind.ExtensionManaged ||
+      this.config.includePrerelease;
 
     if (!semver.satisfies(version, this.versionRange, { includePrerelease })) {
       return {
@@ -132,7 +139,7 @@ export class DistributionManager implements DistributionProvider {
     return {
       distribution,
       kind: FindDistributionResultKind.CompatibleDistribution,
-      version
+      version,
     };
   }
 
@@ -149,49 +156,58 @@ export class DistributionManager implements DistributionProvider {
   /**
    * Returns the path to a possibly-compatible CodeQL launcher binary, or undefined if a binary not be found.
    */
-  async getDistributionWithoutVersionCheck(): Promise<Distribution | undefined> {
+  async getDistributionWithoutVersionCheck(): Promise<
+    Distribution | undefined
+  > {
     // Check config setting, then extension specific distribution, then PATH.
     if (this.config.customCodeQlPath) {
-      if (!await fs.pathExists(this.config.customCodeQlPath)) {
-        void showAndLogErrorMessage(`The CodeQL executable path is specified as "${this.config.customCodeQlPath}" ` +
-          'by a configuration setting, but a CodeQL executable could not be found at that path. Please check ' +
-          'that a CodeQL executable exists at the specified path or remove the setting.');
+      if (!(await fs.pathExists(this.config.customCodeQlPath))) {
+        void showAndLogErrorMessage(
+          `The CodeQL executable path is specified as "${this.config.customCodeQlPath}" ` +
+            "by a configuration setting, but a CodeQL executable could not be found at that path. Please check " +
+            "that a CodeQL executable exists at the specified path or remove the setting.",
+        );
         return undefined;
       }
 
       // emit a warning if using a deprecated launcher and a non-deprecated launcher exists
       if (
         deprecatedCodeQlLauncherName() &&
-        this.config.customCodeQlPath.endsWith(deprecatedCodeQlLauncherName()!) &&
-        await this.hasNewLauncherName()
+        this.config.customCodeQlPath.endsWith(
+          deprecatedCodeQlLauncherName()!,
+        ) &&
+        (await this.hasNewLauncherName())
       ) {
         warnDeprecatedLauncher();
       }
       return {
         codeQlPath: this.config.customCodeQlPath,
-        kind: DistributionKind.CustomPathConfig
+        kind: DistributionKind.CustomPathConfig,
       };
     }
 
-    const extensionSpecificCodeQlPath = await this.extensionSpecificDistributionManager.getCodeQlPathWithoutVersionCheck();
+    const extensionSpecificCodeQlPath =
+      await this.extensionSpecificDistributionManager.getCodeQlPathWithoutVersionCheck();
     if (extensionSpecificCodeQlPath !== undefined) {
       return {
         codeQlPath: extensionSpecificCodeQlPath,
-        kind: DistributionKind.ExtensionManaged
+        kind: DistributionKind.ExtensionManaged,
       };
     }
 
     if (process.env.PATH) {
       for (const searchDirectory of process.env.PATH.split(path.delimiter)) {
-        const expectedLauncherPath = await getExecutableFromDirectory(searchDirectory);
+        const expectedLauncherPath = await getExecutableFromDirectory(
+          searchDirectory,
+        );
         if (expectedLauncherPath) {
           return {
             codeQlPath: expectedLauncherPath,
-            kind: DistributionKind.PathEnvironmentVariable
+            kind: DistributionKind.PathEnvironmentVariable,
           };
         }
       }
-      void logger.log('INFO: Could not find CodeQL on path.');
+      void logger.log("INFO: Could not find CodeQL on path.");
     }
 
     return undefined;
@@ -204,14 +220,19 @@ export class DistributionManager implements DistributionProvider {
    * Returns a failed promise if an unexpected error occurs during installation.
    */
   public async checkForUpdatesToExtensionManagedDistribution(
-    minSecondsSinceLastUpdateCheck: number): Promise<DistributionUpdateCheckResult> {
+    minSecondsSinceLastUpdateCheck: number,
+  ): Promise<DistributionUpdateCheckResult> {
     const distribution = await this.getDistributionWithoutVersionCheck();
-    const extensionManagedCodeQlPath = await this.extensionSpecificDistributionManager.getCodeQlPathWithoutVersionCheck();
+    const extensionManagedCodeQlPath =
+      await this.extensionSpecificDistributionManager.getCodeQlPathWithoutVersionCheck();
     if (distribution?.codeQlPath !== extensionManagedCodeQlPath) {
       // A distribution is present but it isn't managed by the extension.
       return createInvalidLocationResult();
     }
-    const updateCheckResult = await this.updateCheckRateLimiter.invokeFunctionIfIntervalElapsed(minSecondsSinceLastUpdateCheck);
+    const updateCheckResult =
+      await this.updateCheckRateLimiter.invokeFunctionIfIntervalElapsed(
+        minSecondsSinceLastUpdateCheck,
+      );
     switch (updateCheckResult.kind) {
       case InvocationRateLimiterResultKind.Invoked:
         return updateCheckResult.result;
@@ -227,9 +248,12 @@ export class DistributionManager implements DistributionProvider {
    */
   public installExtensionManagedDistributionRelease(
     release: Release,
-    progressCallback?: ProgressCallback
+    progressCallback?: ProgressCallback,
   ): Promise<void> {
-    return this.extensionSpecificDistributionManager.installDistributionRelease(release, progressCallback);
+    return this.extensionSpecificDistributionManager.installDistributionRelease(
+      release,
+      progressCallback,
+    );
   }
 
   public get onDidChangeDistribution(): Event<void> | undefined {
@@ -260,7 +284,7 @@ class ExtensionSpecificDistributionManager {
   constructor(
     private readonly config: DistributionConfig,
     private readonly versionRange: semver.Range,
-    private readonly extensionContext: ExtensionContext
+    private readonly extensionContext: ExtensionContext,
   ) {
     /**/
   }
@@ -268,7 +292,10 @@ class ExtensionSpecificDistributionManager {
   public async getCodeQlPathWithoutVersionCheck(): Promise<string | undefined> {
     if (this.getInstalledRelease() !== undefined) {
       // An extension specific distribution has been installed.
-      const expectedLauncherPath = await getExecutableFromDirectory(this.getDistributionRootPath(), true);
+      const expectedLauncherPath = await getExecutableFromDirectory(
+        this.getDistributionRootPath(),
+        true,
+      );
       if (expectedLauncherPath) {
         return expectedLauncherPath;
       }
@@ -276,8 +303,10 @@ class ExtensionSpecificDistributionManager {
       try {
         await this.removeDistribution();
       } catch (e) {
-        void logger.log('WARNING: Tried to remove corrupted CodeQL CLI at ' +
-          `${this.getDistributionStoragePath()} but encountered an error: ${e}.`);
+        void logger.log(
+          "WARNING: Tried to remove corrupted CodeQL CLI at " +
+            `${this.getDistributionStoragePath()} but encountered an error: ${e}.`,
+        );
       }
     }
     return undefined;
@@ -309,53 +338,80 @@ class ExtensionSpecificDistributionManager {
    *
    * Returns a failed promise if an unexpected error occurs during installation.
    */
-  public async installDistributionRelease(release: Release,
-    progressCallback?: ProgressCallback): Promise<void> {
+  public async installDistributionRelease(
+    release: Release,
+    progressCallback?: ProgressCallback,
+  ): Promise<void> {
     await this.downloadDistribution(release, progressCallback);
     // Store the installed release within the global extension state.
     await this.storeInstalledRelease(release);
   }
 
-  private async downloadDistribution(release: Release,
-    progressCallback?: ProgressCallback): Promise<void> {
+  private async downloadDistribution(
+    release: Release,
+    progressCallback?: ProgressCallback,
+  ): Promise<void> {
     try {
       await this.removeDistribution();
     } catch (e) {
-      void logger.log(`Tried to clean up old version of CLI at ${this.getDistributionStoragePath()} ` +
-        `but encountered an error: ${e}.`);
+      void logger.log(
+        `Tried to clean up old version of CLI at ${this.getDistributionStoragePath()} ` +
+          `but encountered an error: ${e}.`,
+      );
     }
 
     // Filter assets to the unique one that we require.
     const requiredAssetName = DistributionManager.getRequiredAssetName();
-    const assets = release.assets.filter(asset => asset.name === requiredAssetName);
+    const assets = release.assets.filter(
+      (asset) => asset.name === requiredAssetName,
+    );
     if (assets.length === 0) {
-      throw new Error(`Invariant violation: chose a release to install that didn't have ${requiredAssetName}`);
+      throw new Error(
+        `Invariant violation: chose a release to install that didn't have ${requiredAssetName}`,
+      );
     }
     if (assets.length > 1) {
-      void logger.log('WARNING: chose a release with more than one asset to install, found ' +
-        assets.map(asset => asset.name).join(', '));
+      void logger.log(
+        "WARNING: chose a release with more than one asset to install, found " +
+          assets.map((asset) => asset.name).join(", "),
+      );
     }
 
-    const assetStream = await this.createReleasesApiConsumer().streamBinaryContentOfAsset(assets[0]);
-    const tmpDirectory = await fs.mkdtemp(path.join(os.tmpdir(), 'vscode-codeql'));
+    const assetStream =
+      await this.createReleasesApiConsumer().streamBinaryContentOfAsset(
+        assets[0],
+      );
+    const tmpDirectory = await fs.mkdtemp(
+      path.join(os.tmpdir(), "vscode-codeql"),
+    );
 
     try {
-      const archivePath = path.join(tmpDirectory, 'distributionDownload.zip');
+      const archivePath = path.join(tmpDirectory, "distributionDownload.zip");
       const archiveFile = fs.createWriteStream(archivePath);
 
-      const contentLength = assetStream.headers.get('content-length');
-      const totalNumBytes = contentLength ? parseInt(contentLength, 10) : undefined;
-      reportStreamProgress(assetStream.body, `Downloading CodeQL CLI ${release.name}…`, totalNumBytes, progressCallback);
+      const contentLength = assetStream.headers.get("content-length");
+      const totalNumBytes = contentLength
+        ? parseInt(contentLength, 10)
+        : undefined;
+      reportStreamProgress(
+        assetStream.body,
+        `Downloading CodeQL CLI ${release.name}…`,
+        totalNumBytes,
+        progressCallback,
+      );
 
       await new Promise((resolve, reject) =>
-        assetStream.body.pipe(archiveFile)
-          .on('finish', resolve)
-          .on('error', reject)
+        assetStream.body
+          .pipe(archiveFile)
+          .on("finish", resolve)
+          .on("error", reject),
       );
 
       await this.bumpDistributionFolderIndex();
 
-      void logger.log(`Extracting CodeQL CLI to ${this.getDistributionStoragePath()}`);
+      void logger.log(
+        `Extracting CodeQL CLI to ${this.getDistributionStoragePath()}`,
+      );
       await extractZipArchive(archivePath, this.getDistributionStoragePath());
     } finally {
       await fs.remove(tmpDirectory);
@@ -376,111 +432,167 @@ class ExtensionSpecificDistributionManager {
 
   private async getLatestRelease(): Promise<Release> {
     const requiredAssetName = DistributionManager.getRequiredAssetName();
-    void logger.log(`Searching for latest release including ${requiredAssetName}.`);
+    void logger.log(
+      `Searching for latest release including ${requiredAssetName}.`,
+    );
     return this.createReleasesApiConsumer().getLatestRelease(
       this.versionRange,
       this.config.includePrerelease,
-      release => {
-        const matchingAssets = release.assets.filter(asset => asset.name === requiredAssetName);
+      (release) => {
+        const matchingAssets = release.assets.filter(
+          (asset) => asset.name === requiredAssetName,
+        );
         if (matchingAssets.length === 0) {
           // For example, this could be a release with no platform-specific assets.
-          void logger.log(`INFO: Ignoring a release with no assets named ${requiredAssetName}`);
+          void logger.log(
+            `INFO: Ignoring a release with no assets named ${requiredAssetName}`,
+          );
           return false;
         }
         if (matchingAssets.length > 1) {
-          void logger.log(`WARNING: Ignoring a release with more than one asset named ${requiredAssetName}`);
+          void logger.log(
+            `WARNING: Ignoring a release with more than one asset named ${requiredAssetName}`,
+          );
           return false;
         }
         return true;
-      }
+      },
     );
   }
 
   private createReleasesApiConsumer(): ReleasesApiConsumer {
-    const ownerName = this.config.ownerName ? this.config.ownerName : DEFAULT_DISTRIBUTION_OWNER_NAME;
-    const repositoryName = this.config.repositoryName ? this.config.repositoryName : DEFAULT_DISTRIBUTION_REPOSITORY_NAME;
-    return new ReleasesApiConsumer(ownerName, repositoryName, this.config.personalAccessToken);
+    const ownerName = this.config.ownerName
+      ? this.config.ownerName
+      : DEFAULT_DISTRIBUTION_OWNER_NAME;
+    const repositoryName = this.config.repositoryName
+      ? this.config.repositoryName
+      : DEFAULT_DISTRIBUTION_REPOSITORY_NAME;
+    return new ReleasesApiConsumer(
+      ownerName,
+      repositoryName,
+      this.config.personalAccessToken,
+    );
   }
 
   private async bumpDistributionFolderIndex(): Promise<void> {
     const index = this.extensionContext.globalState.get(
-      ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey, 0);
+      ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey,
+      0,
+    );
     await this.extensionContext.globalState.update(
-      ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey, index + 1);
+      ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey,
+      index + 1,
+    );
   }
 
   private getDistributionStoragePath(): string {
     // Use an empty string for the initial distribution for backwards compatibility.
-    const distributionFolderIndex = this.extensionContext.globalState.get(
-      ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey, 0) || '';
-    return path.join(this.extensionContext.globalStoragePath,
-      ExtensionSpecificDistributionManager._currentDistributionFolderBaseName + distributionFolderIndex);
+    const distributionFolderIndex =
+      this.extensionContext.globalState.get(
+        ExtensionSpecificDistributionManager._currentDistributionFolderIndexStateKey,
+        0,
+      ) || "";
+    return path.join(
+      this.extensionContext.globalStoragePath,
+      ExtensionSpecificDistributionManager._currentDistributionFolderBaseName +
+        distributionFolderIndex,
+    );
   }
 
   private getDistributionRootPath(): string {
-    return path.join(this.getDistributionStoragePath(),
-      ExtensionSpecificDistributionManager._codeQlExtractedFolderName);
+    return path.join(
+      this.getDistributionStoragePath(),
+      ExtensionSpecificDistributionManager._codeQlExtractedFolderName,
+    );
   }
 
   private getInstalledRelease(): Release | undefined {
-    return this.extensionContext.globalState.get(ExtensionSpecificDistributionManager._installedReleaseStateKey);
+    return this.extensionContext.globalState.get(
+      ExtensionSpecificDistributionManager._installedReleaseStateKey,
+    );
   }
 
-  private async storeInstalledRelease(release: Release | undefined): Promise<void> {
-    await this.extensionContext.globalState.update(ExtensionSpecificDistributionManager._installedReleaseStateKey, release);
+  private async storeInstalledRelease(
+    release: Release | undefined,
+  ): Promise<void> {
+    await this.extensionContext.globalState.update(
+      ExtensionSpecificDistributionManager._installedReleaseStateKey,
+      release,
+    );
   }
 
-  private static readonly _currentDistributionFolderBaseName = 'distribution';
-  private static readonly _currentDistributionFolderIndexStateKey = 'distributionFolderIndex';
-  private static readonly _installedReleaseStateKey = 'distributionRelease';
-  private static readonly _codeQlExtractedFolderName = 'codeql';
+  private static readonly _currentDistributionFolderBaseName = "distribution";
+  private static readonly _currentDistributionFolderIndexStateKey =
+    "distributionFolderIndex";
+  private static readonly _installedReleaseStateKey = "distributionRelease";
+  private static readonly _codeQlExtractedFolderName = "codeql";
 }
 
 export class ReleasesApiConsumer {
-  constructor(ownerName: string, repoName: string, personalAccessToken?: string) {
+  constructor(
+    ownerName: string,
+    repoName: string,
+    personalAccessToken?: string,
+  ) {
     // Specify version of the GitHub API
-    this._defaultHeaders['accept'] = 'application/vnd.github.v3+json';
+    this._defaultHeaders["accept"] = "application/vnd.github.v3+json";
 
     if (personalAccessToken) {
-      this._defaultHeaders['authorization'] = `token ${personalAccessToken}`;
+      this._defaultHeaders["authorization"] = `token ${personalAccessToken}`;
     }
 
     this._ownerName = ownerName;
     this._repoName = repoName;
   }
 
-  public async getLatestRelease(versionRange: semver.Range, includePrerelease = false, additionalCompatibilityCheck?: (release: GithubRelease) => boolean): Promise<Release> {
+  public async getLatestRelease(
+    versionRange: semver.Range,
+    includePrerelease = false,
+    additionalCompatibilityCheck?: (release: GithubRelease) => boolean,
+  ): Promise<Release> {
     const apiPath = `/repos/${this._ownerName}/${this._repoName}/releases`;
-    const allReleases: GithubRelease[] = await (await this.makeApiCall(apiPath)).json();
-    const compatibleReleases = allReleases.filter(release => {
+    const allReleases: GithubRelease[] = await (
+      await this.makeApiCall(apiPath)
+    ).json();
+    const compatibleReleases = allReleases.filter((release) => {
       if (release.prerelease && !includePrerelease) {
         return false;
       }
 
       const version = semver.parse(release.tag_name);
-      if (version === null || !semver.satisfies(version, versionRange, { includePrerelease })) {
+      if (
+        version === null ||
+        !semver.satisfies(version, versionRange, { includePrerelease })
+      ) {
         return false;
       }
 
-      return !additionalCompatibilityCheck || additionalCompatibilityCheck(release);
+      return (
+        !additionalCompatibilityCheck || additionalCompatibilityCheck(release)
+      );
     });
     // Tag names must all be parsable to semvers due to the previous filtering step.
     const latestRelease = compatibleReleases.sort((a, b) => {
-      const versionComparison = semver.compare(semver.parse(b.tag_name)!, semver.parse(a.tag_name)!);
+      const versionComparison = semver.compare(
+        semver.parse(b.tag_name)!,
+        semver.parse(a.tag_name)!,
+      );
       if (versionComparison !== 0) {
         return versionComparison;
       }
-      return b.created_at.localeCompare(a.created_at, 'en-US');
+      return b.created_at.localeCompare(a.created_at, "en-US");
     })[0];
     if (latestRelease === undefined) {
-      throw new Error('No compatible CodeQL CLI releases were found. ' +
-        'Please check that the CodeQL extension is up to date.');
+      throw new Error(
+        "No compatible CodeQL CLI releases were found. " +
+          "Please check that the CodeQL extension is up to date.",
+      );
     }
-    const assets: ReleaseAsset[] = latestRelease.assets.map(asset => {
+    const assets: ReleaseAsset[] = latestRelease.assets.map((asset) => {
       return {
         id: asset.id,
         name: asset.name,
-        size: asset.size
+        size: asset.size,
       };
     });
 
@@ -488,29 +600,42 @@ export class ReleasesApiConsumer {
       assets,
       createdAt: latestRelease.created_at,
       id: latestRelease.id,
-      name: latestRelease.name
+      name: latestRelease.name,
     };
   }
 
-  public async streamBinaryContentOfAsset(asset: ReleaseAsset): Promise<fetch.Response> {
+  public async streamBinaryContentOfAsset(
+    asset: ReleaseAsset,
+  ): Promise<fetch.Response> {
     const apiPath = `/repos/${this._ownerName}/${this._repoName}/releases/assets/${asset.id}`;
 
     return await this.makeApiCall(apiPath, {
-      'accept': 'application/octet-stream'
+      accept: "application/octet-stream",
     });
   }
 
-  protected async makeApiCall(apiPath: string, additionalHeaders: { [key: string]: string } = {}): Promise<fetch.Response> {
-    const response = await this.makeRawRequest(ReleasesApiConsumer._apiBase + apiPath,
-      Object.assign({}, this._defaultHeaders, additionalHeaders));
+  protected async makeApiCall(
+    apiPath: string,
+    additionalHeaders: { [key: string]: string } = {},
+  ): Promise<fetch.Response> {
+    const response = await this.makeRawRequest(
+      ReleasesApiConsumer._apiBase + apiPath,
+      Object.assign({}, this._defaultHeaders, additionalHeaders),
+    );
 
     if (!response.ok) {
       // Check for rate limiting
-      const rateLimitResetValue = response.headers.get('X-RateLimit-Reset');
+      const rateLimitResetValue = response.headers.get("X-RateLimit-Reset");
       if (response.status === 403 && rateLimitResetValue) {
         const secondsToMillisecondsFactor = 1000;
-        const rateLimitResetDate = new Date(parseInt(rateLimitResetValue, 10) * secondsToMillisecondsFactor);
-        throw new GithubRateLimitedError(response.status, await response.text(), rateLimitResetDate);
+        const rateLimitResetDate = new Date(
+          parseInt(rateLimitResetValue, 10) * secondsToMillisecondsFactor,
+        );
+        throw new GithubRateLimitedError(
+          response.status,
+          await response.text(),
+          rateLimitResetDate,
+        );
       }
       throw new GithubApiError(response.status, await response.text());
     }
@@ -520,24 +645,29 @@ export class ReleasesApiConsumer {
   private async makeRawRequest(
     requestUrl: string,
     headers: { [key: string]: string },
-    redirectCount = 0): Promise<fetch.Response> {
+    redirectCount = 0,
+  ): Promise<fetch.Response> {
     const response = await fetch.default(requestUrl, {
       headers,
-      redirect: 'manual'
+      redirect: "manual",
     });
 
-    const redirectUrl = response.headers.get('location');
-    if (isRedirectStatusCode(response.status) && redirectUrl && redirectCount < ReleasesApiConsumer._maxRedirects) {
+    const redirectUrl = response.headers.get("location");
+    if (
+      isRedirectStatusCode(response.status) &&
+      redirectUrl &&
+      redirectCount < ReleasesApiConsumer._maxRedirects
+    ) {
       const parsedRedirectUrl = url.parse(redirectUrl);
-      if (parsedRedirectUrl.protocol != 'https:') {
-        throw new Error('Encountered a non-https redirect, rejecting');
+      if (parsedRedirectUrl.protocol != "https:") {
+        throw new Error("Encountered a non-https redirect, rejecting");
       }
-      if (parsedRedirectUrl.host != 'api.github.com') {
+      if (parsedRedirectUrl.host != "api.github.com") {
         // Remove authorization header if we are redirected outside of the GitHub API.
         //
         // This is necessary to stream release assets since AWS fails if more than one auth
         // mechanism is provided.
-        delete headers['authorization'];
+        delete headers["authorization"];
       }
       return await this.makeRawRequest(redirectUrl, headers, redirectCount + 1);
     }
@@ -549,37 +679,51 @@ export class ReleasesApiConsumer {
   private readonly _ownerName: string;
   private readonly _repoName: string;
 
-  private static readonly _apiBase = 'https://api.github.com';
+  private static readonly _apiBase = "https://api.github.com";
   private static readonly _maxRedirects = 20;
 }
 
-export async function extractZipArchive(archivePath: string, outPath: string): Promise<void> {
+export async function extractZipArchive(
+  archivePath: string,
+  outPath: string,
+): Promise<void> {
   const archive = await unzipper.Open.file(archivePath);
   await archive.extract({
     concurrency: 4,
-    path: outPath
+    path: outPath,
   });
   // Set file permissions for extracted files
-  await Promise.all(archive.files.map(async file => {
-    // Only change file permissions if within outPath (path.join normalises the path)
-    const extractedPath = path.join(outPath, file.path);
-    if (extractedPath.indexOf(outPath) !== 0 || !(await fs.pathExists(extractedPath))) {
-      return Promise.resolve();
-    }
-    return fs.chmod(extractedPath, file.externalFileAttributes >>> 16);
-  }));
+  await Promise.all(
+    archive.files.map(async (file) => {
+      // Only change file permissions if within outPath (path.join normalises the path)
+      const extractedPath = path.join(outPath, file.path);
+      if (
+        extractedPath.indexOf(outPath) !== 0 ||
+        !(await fs.pathExists(extractedPath))
+      ) {
+        return Promise.resolve();
+      }
+      return fs.chmod(extractedPath, file.externalFileAttributes >>> 16);
+    }),
+  );
 }
 
 export function codeQlLauncherName(): string {
-  return (os.platform() === 'win32') ? 'codeql.exe' : 'codeql';
+  return os.platform() === "win32" ? "codeql.exe" : "codeql";
 }
 
 function deprecatedCodeQlLauncherName(): string | undefined {
-  return (os.platform() === 'win32') ? 'codeql.cmd' : undefined;
+  return os.platform() === "win32" ? "codeql.cmd" : undefined;
 }
 
 function isRedirectStatusCode(statusCode: number): boolean {
-  return statusCode === 301 || statusCode === 302 || statusCode === 303 || statusCode === 307 || statusCode === 308;
+  return (
+    statusCode === 301 ||
+    statusCode === 302 ||
+    statusCode === 303 ||
+    statusCode === 307 ||
+    statusCode === 308
+  );
 }
 
 /*
@@ -589,7 +733,7 @@ function isRedirectStatusCode(statusCode: number): boolean {
 export enum DistributionKind {
   CustomPathConfig,
   ExtensionManaged,
-  PathEnvironmentVariable
+  PathEnvironmentVariable,
 }
 
 export interface Distribution {
@@ -601,7 +745,7 @@ export enum FindDistributionResultKind {
   CompatibleDistribution,
   UnknownCompatibilityDistribution,
   IncompatibleDistribution,
-  NoDistribution
+  NoDistribution,
 }
 
 export type FindDistributionResult =
@@ -641,7 +785,7 @@ export enum DistributionUpdateCheckResultKind {
   AlreadyCheckedRecentlyResult,
   AlreadyUpToDate,
   InvalidLocation,
-  UpdateAvailable
+  UpdateAvailable,
 }
 
 type DistributionUpdateCheckResult =
@@ -672,43 +816,55 @@ export interface UpdateAvailableResult {
 
 function createAlreadyCheckedRecentlyResult(): AlreadyCheckedRecentlyResult {
   return {
-    kind: DistributionUpdateCheckResultKind.AlreadyCheckedRecentlyResult
+    kind: DistributionUpdateCheckResultKind.AlreadyCheckedRecentlyResult,
   };
 }
 
 function createAlreadyUpToDateResult(): AlreadyUpToDateResult {
   return {
-    kind: DistributionUpdateCheckResultKind.AlreadyUpToDate
+    kind: DistributionUpdateCheckResultKind.AlreadyUpToDate,
   };
 }
 
 function createInvalidLocationResult(): InvalidLocationResult {
   return {
-    kind: DistributionUpdateCheckResultKind.InvalidLocation
+    kind: DistributionUpdateCheckResultKind.InvalidLocation,
   };
 }
 
-function createUpdateAvailableResult(updatedRelease: Release): UpdateAvailableResult {
+function createUpdateAvailableResult(
+  updatedRelease: Release,
+): UpdateAvailableResult {
   return {
     kind: DistributionUpdateCheckResultKind.UpdateAvailable,
-    updatedRelease
+    updatedRelease,
   };
 }
 
 // Exported for testing
-export async function getExecutableFromDirectory(directory: string, warnWhenNotFound = false): Promise<string | undefined> {
+export async function getExecutableFromDirectory(
+  directory: string,
+  warnWhenNotFound = false,
+): Promise<string | undefined> {
   const expectedLauncherPath = path.join(directory, codeQlLauncherName());
   const deprecatedLauncherName = deprecatedCodeQlLauncherName();
-  const alternateExpectedLauncherPath = deprecatedLauncherName ? path.join(directory, deprecatedLauncherName) : undefined;
+  const alternateExpectedLauncherPath = deprecatedLauncherName
+    ? path.join(directory, deprecatedLauncherName)
+    : undefined;
   if (await fs.pathExists(expectedLauncherPath)) {
     return expectedLauncherPath;
-  } else if (alternateExpectedLauncherPath && (await fs.pathExists(alternateExpectedLauncherPath))) {
+  } else if (
+    alternateExpectedLauncherPath &&
+    (await fs.pathExists(alternateExpectedLauncherPath))
+  ) {
     warnDeprecatedLauncher();
     return alternateExpectedLauncherPath;
   }
   if (warnWhenNotFound) {
-    void logger.log(`WARNING: Expected to find a CodeQL CLI executable at ${expectedLauncherPath} but one was not found. ` +
-      'Will try PATH.');
+    void logger.log(
+      `WARNING: Expected to find a CodeQL CLI executable at ${expectedLauncherPath} but one was not found. ` +
+        "Will try PATH.",
+    );
   }
   return undefined;
 }
@@ -716,7 +872,7 @@ export async function getExecutableFromDirectory(directory: string, warnWhenNotF
 function warnDeprecatedLauncher() {
   void showAndLogWarningMessage(
     `The "${deprecatedCodeQlLauncherName()!}" launcher has been deprecated and will be removed in a future version. ` +
-    `Please use "${codeQlLauncherName()}" instead. It is recommended to update to the latest CodeQL binaries.`
+      `Please use "${codeQlLauncherName()}" instead. It is recommended to update to the latest CodeQL binaries.`,
   );
 }
 
@@ -762,7 +918,6 @@ export interface ReleaseAsset {
   size: number;
 }
 
-
 /**
  * The json returned from github for a release.
  */
@@ -822,7 +977,11 @@ export class GithubApiError extends Error {
 }
 
 export class GithubRateLimitedError extends GithubApiError {
-  constructor(public status: number, public body: string, public rateLimitResetDate: Date) {
+  constructor(
+    public status: number,
+    public body: string,
+    public rateLimitResetDate: Date,
+  ) {
     super(status, body);
   }
 }

extensions/ql-vscode/src/eval-log-tree-builder.ts

@@ -0,0 +1,67 @@
+import { ChildEvalLogTreeItem, EvalLogTreeItem } from "./eval-log-viewer";
+import { EvalLogData as EvalLogData } from "./pure/log-summary-parser";
+
+/** Builds the tree data for the evaluator log viewer for a single query run. */
+export default class EvalLogTreeBuilder {
+  private queryName: string;
+  private evalLogDataItems: EvalLogData[];
+
+  constructor(queryName: string, evaluatorLogDataItems: EvalLogData[]) {
+    this.queryName = queryName;
+    this.evalLogDataItems = evaluatorLogDataItems;
+  }
+
+  async getRoots(): Promise<EvalLogTreeItem[]> {
+    return await this.parseRoots();
+  }
+
+  private async parseRoots(): Promise<EvalLogTreeItem[]> {
+    const roots: EvalLogTreeItem[] = [];
+
+    // Once the viewer can show logs for multiple queries, there will be more than 1 item at the root
+    // level. For now, there will always be one root (the one query being shown).
+    const queryItem: EvalLogTreeItem = {
+      label: this.queryName,
+      children: [], // Will assign predicate items as children shortly.
+    };
+
+    // Display descriptive message when no data exists
+    if (this.evalLogDataItems.length === 0) {
+      const noResultsItem: ChildEvalLogTreeItem = {
+        label: "No predicates evaluated in this query run.",
+        parent: queryItem,
+        children: [],
+      };
+      queryItem.children.push(noResultsItem);
+    }
+
+    // For each predicate, create a TreeItem object with appropriate parents/children
+    this.evalLogDataItems.forEach((logDataItem) => {
+      const predicateLabel = `${logDataItem.predicateName} (${logDataItem.resultSize} tuples, ${logDataItem.millis} ms)`;
+      const predicateItem: ChildEvalLogTreeItem = {
+        label: predicateLabel,
+        parent: queryItem,
+        children: [], // Will assign pipeline items as children shortly.
+      };
+      for (const [pipelineName, steps] of Object.entries(logDataItem.ra)) {
+        const pipelineLabel = `Pipeline: ${pipelineName}`;
+        const pipelineItem: ChildEvalLogTreeItem = {
+          label: pipelineLabel,
+          parent: predicateItem,
+          children: [], // Will assign step items as children shortly.
+        };
+        predicateItem.children.push(pipelineItem);
+
+        pipelineItem.children = steps.map((step: string) => ({
+          label: step,
+          parent: pipelineItem,
+          children: [],
+        }));
+      }
+      queryItem.children.push(predicateItem);
+    });
+
+    roots.push(queryItem);
+    return roots;
+  }
+}

extensions/ql-vscode/src/eval-log-viewer.ts

@@ -0,0 +1,110 @@
+import {
+  window,
+  TreeDataProvider,
+  TreeView,
+  TreeItem,
+  ProviderResult,
+  Event,
+  EventEmitter,
+  TreeItemCollapsibleState,
+} from "vscode";
+import { commandRunner } from "./commandRunner";
+import { DisposableObject } from "./pure/disposable-object";
+import { showAndLogErrorMessage } from "./helpers";
+
+export interface EvalLogTreeItem {
+  label?: string;
+  children: ChildEvalLogTreeItem[];
+}
+
+export interface ChildEvalLogTreeItem extends EvalLogTreeItem {
+  parent: ChildEvalLogTreeItem | EvalLogTreeItem;
+}
+
+/** Provides data from parsed CodeQL evaluator logs to be rendered in a tree view. */
+class EvalLogDataProvider
+  extends DisposableObject
+  implements TreeDataProvider<EvalLogTreeItem>
+{
+  public roots: EvalLogTreeItem[] = [];
+
+  private _onDidChangeTreeData: EventEmitter<
+    EvalLogTreeItem | undefined | null | void
+  > = new EventEmitter<EvalLogTreeItem | undefined | null | void>();
+  readonly onDidChangeTreeData: Event<
+    EvalLogTreeItem | undefined | null | void
+  > = this._onDidChangeTreeData.event;
+
+  refresh(): void {
+    this._onDidChangeTreeData.fire();
+  }
+
+  getTreeItem(element: EvalLogTreeItem): TreeItem | Thenable<TreeItem> {
+    const state = element.children.length
+      ? TreeItemCollapsibleState.Collapsed
+      : TreeItemCollapsibleState.None;
+    const treeItem = new TreeItem(element.label || "", state);
+    treeItem.tooltip = `${treeItem.label} || ''}`;
+    return treeItem;
+  }
+
+  getChildren(element?: EvalLogTreeItem): ProviderResult<EvalLogTreeItem[]> {
+    // If no item is passed, return the root.
+    if (!element) {
+      return this.roots || [];
+    }
+    // Otherwise it is called with an existing item, to load its children.
+    return element.children;
+  }
+
+  getParent(element: ChildEvalLogTreeItem): ProviderResult<EvalLogTreeItem> {
+    return element.parent;
+  }
+}
+
+/** Manages a tree viewer of structured evaluator logs. */
+export class EvalLogViewer extends DisposableObject {
+  private treeView: TreeView<EvalLogTreeItem>;
+  private treeDataProvider: EvalLogDataProvider;
+
+  constructor() {
+    super();
+
+    this.treeDataProvider = new EvalLogDataProvider();
+    this.treeView = window.createTreeView("codeQLEvalLogViewer", {
+      treeDataProvider: this.treeDataProvider,
+      showCollapseAll: true,
+    });
+
+    this.push(this.treeView);
+    this.push(this.treeDataProvider);
+    this.push(
+      commandRunner("codeQLEvalLogViewer.clear", async () => {
+        this.clear();
+      }),
+    );
+  }
+
+  private clear(): void {
+    this.treeDataProvider.roots = [];
+    this.treeDataProvider.refresh();
+    this.treeView.message = undefined;
+  }
+
+  // Called when the Show Evaluator Log (UI) command is run on a new query.
+  updateRoots(roots: EvalLogTreeItem[]): void {
+    this.treeDataProvider.roots = roots;
+    this.treeDataProvider.refresh();
+
+    this.treeView.message = "Viewer for query run:"; // Currently only one query supported at a time.
+
+    // Handle error on reveal. This could happen if
+    // the tree view is disposed during the reveal.
+    this.treeView.reveal(roots[0], { focus: false })?.then(
+      () => {
+        /**/
+      },
+      (err) => showAndLogErrorMessage(err),
+    );
+  }
+}