Merge branch 'main' into aeisenberg/fix-flakes

2022-10-20 17:07:39 -07:00
parent 7637f9428a a625a39999
commit ccdffc296c
26 changed files with 2701 additions and 566 deletions
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@@ -139,7 +139,7 @@ jobs:
    strategy:
      matrix:
        os: [ubuntu-latest, windows-latest]
-        version: ['v2.6.3', 'v2.7.6', 'v2.8.5', 'v2.9.4', 'v2.10.5', 'v2.11.1', 'nightly']
+        version: ['v2.7.6', 'v2.8.5', 'v2.9.4', 'v2.10.5', 'v2.11.1', 'nightly']
    env:
      CLI_VERSION: ${{ matrix.version }}
      NIGHTLY_URL: ${{ needs.find-nightly.outputs.url }}
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -91,29 +91,58 @@ Alternatively, you can start Storybook inside of VSCode. There is a VSCode launc

 More information about Storybook can be found inside the **Overview** page once you have launched Storybook.

-### Running the unit tests and integration tests that do not require a CLI instance
+### Testing

-Unit tests and many integration tests do not require a copy of the CodeQL CLI.
+We have several types of tests:

-Outside of vscode, in the `extensions/ql-vscode` directory, run:
+* 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`

-```shell
-npm run test && npm run 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.

-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.
+#### Running the tests

-Only the _With CLI_ tests require a CLI instance to run. See below on how to do that.
+##### 1. From the terminal

-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.
+First move into the `extensions/ql-vscode` directory. Then, depending on which tests you want to run, use the appropriate command to run the tests:

-### Running the integration tests
+* Unit tests: `npm run test:unit`
+* View Tests: `npm test:view`
+* VSCode integration tests: `npm run integration`

-You will need to run CLI tests using a task from inside of VS Code called _Launch Integration Tests - With CLI_.
+###### 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.

-From inside of VSCode, open the `launch.json` file and in the _Launch Integration Tests - With CLI_ task, uncomment the `"${workspaceRoot}/../codeql"` line. If necessary, replace value with a path to your checkout, and then run the task.
+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_.

 ## Releasing (write access required)

@@ -137,7 +166,7 @@ From inside of VSCode, open the `launch.json` file and in the _Launch Integratio
    git tag v1.3.6
    ```

-   If you've accidentally created a badly named tag, you can delete it via 
+   If you've accidentally created a badly named tag, you can delete it via
    ```bash
    git tag -d badly-named-tag
    ```
@@ -148,13 +177,13 @@ From inside of VSCode, open the `launch.json` file and in the _Launch Integratio
    ```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.
--- a/extensions/ql-vscode/.storybook/preview.ts
+++ b/extensions/ql-vscode/.storybook/preview.ts
@@ -4,7 +4,7 @@ import { action } from '@storybook/addon-actions';
 // Allow all stories/components to use Codicons
 import '@vscode/codicons/dist/codicon.css';

-import '../src/stories/vscode-theme.css';
+import '../src/stories/vscode-theme-dark.css';

 // https://storybook.js.org/docs/react/configure/overview#configure-story-rendering
 export const parameters = {
--- a/extensions/ql-vscode/package-lock.json
+++ b/extensions/ql-vscode/package-lock.json
--- a/extensions/ql-vscode/package.json
+++ b/extensions/ql-vscode/package.json
@@ -1230,6 +1230,7 @@
    "minimist": "~1.2.6",
    "nanoid": "^3.2.0",
    "node-fetch": "~2.6.7",
+    "p-queue": "^6.0.0",
    "path-browserify": "^1.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
@@ -1322,13 +1323,14 @@
    "gulp-replace": "^1.1.3",
    "gulp-sourcemaps": "^3.0.0",
    "gulp-typescript": "^5.0.1",
-    "husky": "~4.3.8",
+    "husky": "~8.0.1",
    "jest": "^29.0.3",
    "jest-environment-jsdom": "^29.0.3",
    "lint-staged": "~10.2.2",
    "mini-css-extract-plugin": "^2.6.1",
    "mocha": "^10.0.0",
    "mocha-sinon": "~2.1.2",
+    "msw": "^0.47.4",
    "npm-run-all": "^4.1.5",
    "prettier": "~2.0.5",
    "proxyquire": "~2.1.3",
--- a/extensions/ql-vscode/src/config.ts
+++ b/extensions/ql-vscode/src/config.ts
@@ -437,3 +437,23 @@ const LIVE_RESULTS = new Setting('liveResults', REMOTE_QUERIES_SETTING);
 export function isVariantAnalysisLiveResultsEnabled(): boolean {
  return !!LIVE_RESULTS.getValue<boolean>();
 }
+
+/**
+ * A flag indicating whether to enable a mock GitHub API server.
+ */
+const MOCK_GH_API_SERVER = new Setting('mockGitHubApiServer', REMOTE_QUERIES_SETTING);
+
+export interface MockGitHubApiConfig {
+  mockServerEnabled: boolean;
+  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.getValue<boolean>();
+  }
+}
--- a/extensions/ql-vscode/src/extension.ts
+++ b/extensions/ql-vscode/src/extension.ts
@@ -951,7 +951,7 @@ async function activateWithInstalledDistribution(
      variantAnalysisSummary: VariantAnalysisApiResponse,
      token: CancellationToken
    ) => {
-      await variantAnalysisManager.autoDownloadVariantAnalysisResult(scannedRepo, variantAnalysisSummary, token);
+      await variantAnalysisManager.enqueueDownload(scannedRepo, variantAnalysisSummary, token);
    })
  );

--- a/extensions/ql-vscode/src/legacy-query-server/run-queries.ts
+++ b/extensions/ql-vscode/src/legacy-query-server/run-queries.ts
@@ -54,7 +54,7 @@ export class QueryInProgress {
  }

  get compiledQueryPath() {
-    return path.join(this.querySaveDir, 'compiledQuery.qlo');
+    return this.queryEvalInfo.compileQueryPath;
  }


--- a/extensions/ql-vscode/src/mocks/gh-api-request.ts
+++ b/extensions/ql-vscode/src/mocks/gh-api-request.ts
@@ -0,0 +1,72 @@
+import { Repository } from '../remote-queries/gh-api/repository';
+import { VariantAnalysis, VariantAnalysisRepoTask } from '../remote-queries/gh-api/variant-analysis';
+
+// Types that represent requests/responses from the GitHub API
+// that we need to mock.
+
+export enum RequestKind {
+  GetRepo = 'getRepo',
+  SubmitVariantAnalysis = 'submitVariantAnalysis',
+  GetVariantAnalysis = 'getVariantAnalysis',
+  GetVariantAnalysisRepo = 'getVariantAnalysisRepo',
+  GetVariantAnalysisRepoResult = 'getVariantAnalysisRepoResult',
+}
+
+export interface GetRepoRequest {
+  request: {
+    kind: RequestKind.GetRepo
+  },
+  response: {
+    status: number,
+    body: Repository
+  }
+}
+
+export interface SubmitVariantAnalysisRequest {
+  request: {
+    kind: RequestKind.SubmitVariantAnalysis
+  },
+  response: {
+    status: number,
+    body: VariantAnalysis
+  }
+}
+
+export interface GetVariantAnalysisRequest {
+  request: {
+    kind: RequestKind.GetVariantAnalysis
+  },
+  response: {
+    status: number,
+    body: VariantAnalysis
+  }
+}
+
+export interface GetVariantAnalysisRepoRequest {
+  request: {
+    kind: RequestKind.GetVariantAnalysisRepo,
+    repositoryId: number
+  },
+  response: {
+    status: number,
+    body: VariantAnalysisRepoTask
+  }
+}
+
+export interface GetVariantAnalysisRepoResultRequest {
+  request: {
+    kind: RequestKind.GetVariantAnalysisRepoResult,
+    repositoryId: number
+  },
+  response: {
+    status: number,
+    body: ArrayBuffer
+  }
+}
+
+export type GitHubApiRequest =
+  | GetRepoRequest
+  | SubmitVariantAnalysisRequest
+  | GetVariantAnalysisRequest
+  | GetVariantAnalysisRepoRequest
+  | GetVariantAnalysisRepoResultRequest;
--- a/extensions/ql-vscode/src/mocks/mock-gh-api-server.ts
+++ b/extensions/ql-vscode/src/mocks/mock-gh-api-server.ts
@@ -0,0 +1,49 @@
+import { MockGitHubApiConfigListener } from '../config';
+
+/**
+ * Enables mocking of the GitHub API server via HTTP interception, using msw.
+ */
+export class MockGitHubApiServer {
+  private isListening: boolean;
+  private config: MockGitHubApiConfigListener;
+
+  constructor() {
+    this.isListening = false;
+    this.config = new MockGitHubApiConfigListener();
+    this.setupConfigListener();
+  }
+
+  public startServer(): void {
+    this.isListening = true;
+
+    // TODO: Enable HTTP interception.
+  }
+
+  public stopServer(): void {
+    this.isListening = false;
+
+    // TODO: Disable HTTP interception.
+  }
+
+  public loadScenario(): void {
+    // TODO: Implement logic to load a scenario from a directory.
+  }
+
+  public listScenarios(): void {
+    // TODO: Implement logic to list all available scenarios.
+  }
+
+  public recordScenario(): void {
+    // TODO: Implement logic to record a new scenario to a directory.
+  }
+
+  private setupConfigListener(): void {
+    this.config.onDidChangeConfiguration(() => {
+      if (this.config.mockServerEnabled && !this.isListening) {
+        this.startServer();
+      } else if (!this.config.mockServerEnabled && this.isListening) {
+        this.stopServer();
+      }
+    });
+  }
+}
--- a/extensions/ql-vscode/src/query-history-info.ts
+++ b/extensions/ql-vscode/src/query-history-info.ts
@@ -17,3 +17,29 @@ export function getRawQueryName(item: QueryHistoryInfo): string {
      assertNever(item);
  }
 }
+
+export function getQueryHistoryItemId(item: QueryHistoryInfo): string {
+  switch (item.t) {
+    case 'local':
+      return item.initialInfo.id;
+    case 'remote':
+      return item.queryId;
+    case 'variant-analysis':
+      return item.historyItemId;
+    default:
+      assertNever(item);
+  }
+}
+
+export function getQueryText(item: QueryHistoryInfo): string {
+  switch (item.t) {
+    case 'local':
+      return item.initialInfo.queryText;
+    case 'remote':
+      return item.remoteQuery.queryText;
+    case 'variant-analysis':
+      return item.variantAnalysis.query.text;
+    default:
+      assertNever(item);
+  }
+}
--- a/extensions/ql-vscode/src/query-history.ts
+++ b/extensions/ql-vscode/src/query-history.ts
@@ -31,7 +31,7 @@ import { commandRunner } from './commandRunner';
 import { ONE_HOUR_IN_MS, TWO_HOURS_IN_MS } from './pure/time';
 import { assertNever, getErrorMessage, getErrorStack } from './pure/helpers-pure';
 import { CompletedLocalQueryInfo, LocalQueryInfo } from './query-results';
-import { QueryHistoryInfo } from './query-history-info';
+import { getQueryHistoryItemId, getQueryText, QueryHistoryInfo } from './query-history-info';
 import { DatabaseManager } from './databases';
 import { registerQueryHistoryScrubber } from './query-history-scrubber';
 import { QueryStatus } from './query-status';
@@ -51,6 +51,7 @@ import { EvalLogData, parseViewerData } from './pure/log-summary-parser';
 import { QueryWithResults } from './run-queries-shared';
 import { QueryRunner } from './queryRunner';
 import { VariantAnalysisManager } from './remote-queries/variant-analysis-manager';
+import { nanoid } from 'nanoid';

 /**
 * query-history.ts
@@ -603,6 +604,7 @@ export class QueryHistoryManager extends DisposableObject {
        t: 'variant-analysis',
        status: QueryStatus.InProgress,
        completed: false,
+        historyItemId: nanoid(),
        variantAnalysis,
      });

@@ -909,6 +911,8 @@ export class QueryHistoryManager extends DisposableObject {
      }
    } else if (queryHistoryItem.t === 'remote') {
      return path.join(this.queryStorageDir, queryHistoryItem.queryId);
+    } else if (queryHistoryItem.t === 'variant-analysis') {
+      return this.variantAnalysisManager.getVariantAnalysisStorageLocation(queryHistoryItem.variantAnalysis.id);
    }

    throw new Error('Unable to get query directory');
@@ -931,6 +935,8 @@ export class QueryHistoryManager extends DisposableObject {
      }
    } else if (finalSingleItem.t === 'remote') {
      externalFilePath = path.join(this.queryStorageDir, finalSingleItem.queryId, 'timestamp');
+    } else if (finalSingleItem.t === 'variant-analysis') {
+      externalFilePath = path.join(this.variantAnalysisManager.getVariantAnalysisStorageLocation(finalSingleItem.variantAnalysis.id), 'timestamp');
    }

    if (externalFilePath) {
@@ -1065,22 +1071,16 @@ export class QueryHistoryManager extends DisposableObject {

    const params = new URLSearchParams({
      isQuickEval: String(!!(finalSingleItem.t === 'local' && finalSingleItem.initialInfo.quickEvalPosition)),
-      queryText: encodeURIComponent(await this.getQueryText(finalSingleItem)),
+      queryText: encodeURIComponent(getQueryText(finalSingleItem)),
    });

-    if (finalSingleItem.t === 'variant-analysis') {
-      // TODO
-    } else {
-      const queryId = finalSingleItem.t === 'local'
-        ? finalSingleItem.initialInfo.id
-        : finalSingleItem.queryId;
+    const queryId = getQueryHistoryItemId(finalSingleItem);

-      const uri = Uri.parse(
-        `codeql:${queryId}?${params.toString()}`, true
-      );
-      const doc = await workspace.openTextDocument(uri);
-      await window.showTextDocument(doc, { preview: false });
-    }
+    const uri = Uri.parse(
+      `codeql:${queryId}.ql?${params.toString()}`, true
+    );
+    const doc = await workspace.openTextDocument(uri);
+    await window.showTextDocument(doc, { preview: false });
  }

  async handleViewSarifAlerts(
@@ -1195,19 +1195,6 @@ export class QueryHistoryManager extends DisposableObject {
    await commands.executeCommand('codeQL.copyRepoList', finalSingleItem.queryId);
  }

-  async getQueryText(item: QueryHistoryInfo): Promise<string> {
-    switch (item.t) {
-      case 'local':
-        return item.initialInfo.queryText;
-      case 'remote':
-        return item.remoteQuery.queryText;
-      case 'variant-analysis':
-        return 'TODO';
-      default:
-        assertNever(item);
-    }
-  }
-
  async handleExportResults(): Promise<void> {
    await commands.executeCommand('codeQL.exportVariantAnalysisResults');
  }
--- a/extensions/ql-vscode/src/query-server/run-queries.ts
+++ b/extensions/ql-vscode/src/query-server/run-queries.ts
@@ -78,6 +78,7 @@ export async function compileAndRunQueryAgainstDatabase(
    singletonExternalInputs: templates || {},
    outputPath: query.resultsPaths.resultsPath,
    queryPath: initialInfo.queryPath,
+    dilPath: query.dilPath,
    logPath,
    target,
  };
--- a/extensions/ql-vscode/src/remote-queries/run-remote-query.ts
+++ b/extensions/ql-vscode/src/remote-queries/run-remote-query.ts
@@ -278,7 +278,7 @@ export async function runRemoteQuery(

      const processedVariantAnalysis = processVariantAnalysis(variantAnalysisSubmission, variantAnalysisResponse);

-      variantAnalysisManager.onVariantAnalysisSubmitted(processedVariantAnalysis);
+      await variantAnalysisManager.onVariantAnalysisSubmitted(processedVariantAnalysis);

      void logger.log(`Variant analysis:\n${JSON.stringify(processedVariantAnalysis, null, 2)}`);

--- a/extensions/ql-vscode/src/remote-queries/variant-analysis-history-item.ts
+++ b/extensions/ql-vscode/src/remote-queries/variant-analysis-history-item.ts
@@ -10,6 +10,7 @@ export interface VariantAnalysisHistoryItem {
  resultCount?: number;
  status: QueryStatus;
  completed: boolean;
+  readonly historyItemId: string,
  variantAnalysis: VariantAnalysis;
  userSpecifiedLabel?: string;
 }
--- a/extensions/ql-vscode/src/remote-queries/variant-analysis-manager.ts
+++ b/extensions/ql-vscode/src/remote-queries/variant-analysis-manager.ts
@@ -1,3 +1,5 @@
+import * as path from 'path';
+
 import * as ghApiClient from './gh-api/gh-api-client';
 import { CancellationToken, commands, EventEmitter, ExtensionContext, window } from 'vscode';
 import { DisposableObject } from '../pure/disposable-object';
@@ -22,6 +24,8 @@ import { VariantAnalysisResultsManager } from './variant-analysis-results-manage
 import { CodeQLCliServer } from '../cli';
 import { getControllerRepo } from './run-remote-query';
 import { processUpdatedVariantAnalysis } from './variant-analysis-processor';
+import PQueue from 'p-queue';
+import { createTimestampFile } from '../helpers';

 export class VariantAnalysisManager extends DisposableObject implements VariantAnalysisViewManager<VariantAnalysisView> {
  private readonly _onVariantAnalysisAdded = this.push(new EventEmitter<VariantAnalysis>());
@@ -31,18 +35,20 @@ export class VariantAnalysisManager extends DisposableObject implements VariantA
  private readonly variantAnalysisResultsManager: VariantAnalysisResultsManager;
  private readonly variantAnalyses = new Map<number, VariantAnalysis>();
  private readonly views = new Map<number, VariantAnalysisView>();
+  private static readonly maxConcurrentDownloads = 3;
+  private readonly queue = new PQueue({ concurrency: VariantAnalysisManager.maxConcurrentDownloads });

  constructor(
    private readonly ctx: ExtensionContext,
    cliServer: CodeQLCliServer,
-    storagePath: string,
+    private readonly storagePath: string,
    logger: Logger,
  ) {
    super();
    this.variantAnalysisMonitor = this.push(new VariantAnalysisMonitor(ctx));
    this.variantAnalysisMonitor.onVariantAnalysisChange(this.onVariantAnalysisUpdated.bind(this));

-    this.variantAnalysisResultsManager = this.push(new VariantAnalysisResultsManager(cliServer, storagePath, logger));
+    this.variantAnalysisResultsManager = this.push(new VariantAnalysisResultsManager(cliServer, logger));
    this.variantAnalysisResultsManager.onResultLoaded(this.onRepoResultLoaded.bind(this));
  }

@@ -83,7 +89,7 @@ export class VariantAnalysisManager extends DisposableObject implements VariantA
      throw new Error(`No variant analysis with id: ${variantAnalysisId}`);
    }

-    await this.variantAnalysisResultsManager.loadResults(variantAnalysisId, repositoryFullName);
+    await this.variantAnalysisResultsManager.loadResults(variantAnalysisId, this.getVariantAnalysisStorageLocation(variantAnalysisId), repositoryFullName);
  }

  private async onVariantAnalysisUpdated(variantAnalysis: VariantAnalysis | undefined): Promise<void> {
@@ -96,7 +102,9 @@ export class VariantAnalysisManager extends DisposableObject implements VariantA
    await this.getView(variantAnalysis.id)?.updateView(variantAnalysis);
  }

-  public onVariantAnalysisSubmitted(variantAnalysis: VariantAnalysis): void {
+  public async onVariantAnalysisSubmitted(variantAnalysis: VariantAnalysis): Promise<void> {
+    await this.prepareStorageDirectory(variantAnalysis.id);
+
    this._onVariantAnalysisAdded.fire(variantAnalysis);
  }

@@ -154,13 +162,42 @@ export class VariantAnalysisManager extends DisposableObject implements VariantA
      repoState.downloadStatus = VariantAnalysisScannedRepositoryDownloadStatus.InProgress;
      await this.onRepoStateUpdated(variantAnalysisSummary.id, repoState);

-      await this.variantAnalysisResultsManager.download(credentials, variantAnalysisSummary.id, repoTask);
+      await this.variantAnalysisResultsManager.download(credentials, variantAnalysisSummary.id, repoTask, this.getVariantAnalysisStorageLocation(variantAnalysisSummary.id));
    }

    repoState.downloadStatus = VariantAnalysisScannedRepositoryDownloadStatus.Succeeded;
    await this.onRepoStateUpdated(variantAnalysisSummary.id, repoState);
  }

+  public async enqueueDownload(
+    scannedRepo: ApiVariantAnalysisScannedRepository,
+    variantAnalysisSummary: VariantAnalysisApiResponse,
+    token: CancellationToken
+  ): Promise<void> {
+    await this.queue.add(() => this.autoDownloadVariantAnalysisResult(scannedRepo, variantAnalysisSummary, token));
+  }
+
+  public downloadsQueueSize(): number {
+    return this.queue.pending;
+  }
+
+  public getVariantAnalysisStorageLocation(variantAnalysisId: number): string {
+    return path.join(
+      this.storagePath,
+      `${variantAnalysisId}`
+    );
+  }
+
+  /**
+   * Prepares a directory for storing results for a variant analysis.
+   * This directory contains a timestamp file, which will be
+   * used by the query history manager to determine when the directory
+   * should be deleted.
+   */
+  private async prepareStorageDirectory(variantAnalysisId: number): Promise<void> {
+    await createTimestampFile(this.getVariantAnalysisStorageLocation(variantAnalysisId));
+  }
+
  public async promptOpenVariantAnalysis() {
    const credentials = await Credentials.initialize(this.ctx);
    if (!credentials) { throw Error('Error authenticating with GitHub'); }
--- a/extensions/ql-vscode/src/remote-queries/variant-analysis-monitor.ts
+++ b/extensions/ql-vscode/src/remote-queries/variant-analysis-monitor.ts
@@ -4,7 +4,8 @@ import * as ghApiClient from './gh-api/gh-api-client';

 import { VariantAnalysis, VariantAnalysisStatus } from './shared/variant-analysis';
 import {
-  VariantAnalysis as VariantAnalysisApiResponse
+  VariantAnalysis as VariantAnalysisApiResponse,
+  VariantAnalysisScannedRepository
 } from './gh-api/variant-analysis';
 import { VariantAnalysisMonitorResult } from './shared/variant-analysis-monitor-result';
 import { processFailureReason, processUpdatedVariantAnalysis } from './variant-analysis-processor';
@@ -71,14 +72,8 @@ export class VariantAnalysisMonitor extends DisposableObject {

      this._onVariantAnalysisChange.fire(variantAnalysis);

-      if (variantAnalysisSummary.scanned_repositories) {
-        variantAnalysisSummary.scanned_repositories.forEach(scannedRepo => {
-          if (!scannedReposDownloaded.includes(scannedRepo.repository.id) && scannedRepo.analysis_status === 'succeeded') {
-            void commands.executeCommand('codeQL.autoDownloadVariantAnalysisResult', scannedRepo, variantAnalysisSummary);
-            scannedReposDownloaded.push(scannedRepo.repository.id);
-          }
-        });
-      }
+      const downloadedRepos = this.downloadVariantAnalysisResults(variantAnalysisSummary, scannedReposDownloaded);
+      scannedReposDownloaded.push(...downloadedRepos);

      if (variantAnalysisSummary.status === 'completed') {
        break;
@@ -90,6 +85,46 @@ export class VariantAnalysisMonitor extends DisposableObject {
    return { status: 'CompletedSuccessfully', scannedReposDownloaded: scannedReposDownloaded };
  }

+  private scheduleForDownload(
+    scannedRepo: VariantAnalysisScannedRepository,
+    variantAnalysisSummary: VariantAnalysisApiResponse
+  ) {
+    void commands.executeCommand('codeQL.autoDownloadVariantAnalysisResult', scannedRepo, variantAnalysisSummary);
+  }
+
+  private shouldDownload(
+    scannedRepo: VariantAnalysisScannedRepository,
+    alreadyDownloaded: number[]
+  ): boolean {
+    return !alreadyDownloaded.includes(scannedRepo.repository.id) && scannedRepo.analysis_status === 'succeeded';
+  }
+
+  private getReposToDownload(
+    variantAnalysisSummary: VariantAnalysisApiResponse,
+    alreadyDownloaded: number[]
+  ): VariantAnalysisScannedRepository[] {
+    if (variantAnalysisSummary.scanned_repositories) {
+      return variantAnalysisSummary.scanned_repositories.filter(scannedRepo => this.shouldDownload(scannedRepo, alreadyDownloaded));
+    } else {
+      return [];
+    }
+  }
+
+  private downloadVariantAnalysisResults(
+    variantAnalysisSummary: VariantAnalysisApiResponse,
+    scannedReposDownloaded: number[]
+  ): number[] {
+    const repoResultsToDownload = this.getReposToDownload(variantAnalysisSummary, scannedReposDownloaded);
+    const downloadedRepos: number[] = [];
+
+    repoResultsToDownload.forEach(scannedRepo => {
+      downloadedRepos.push(scannedRepo.repository.id);
+      this.scheduleForDownload(scannedRepo, variantAnalysisSummary);
+    });
+
+    return downloadedRepos;
+  }
+
  private async sleep(ms: number) {
    return new Promise(resolve => setTimeout(resolve, ms));
  }
--- a/extensions/ql-vscode/src/remote-queries/variant-analysis-results-manager.ts
+++ b/extensions/ql-vscode/src/remote-queries/variant-analysis-results-manager.ts
@@ -39,7 +39,6 @@ export class VariantAnalysisResultsManager extends DisposableObject {

  constructor(
    private readonly cliServer: CodeQLCliServer,
-    private readonly storagePath: string,
    private readonly logger: Logger,
  ) {
    super();
@@ -50,12 +49,13 @@ export class VariantAnalysisResultsManager extends DisposableObject {
    credentials: Credentials,
    variantAnalysisId: number,
    repoTask: VariantAnalysisRepoTask,
+    variantAnalysisStoragePath: string,
  ): Promise<void> {
    if (!repoTask.artifact_url) {
      throw new Error('Missing artifact URL');
    }

-    const resultDirectory = this.getRepoStorageDirectory(variantAnalysisId, repoTask.repository.full_name);
+    const resultDirectory = this.getRepoStorageDirectory(variantAnalysisStoragePath, repoTask.repository.full_name);

    const result = await ghApiClient.getVariantAnalysisRepoResult(
      credentials,
@@ -82,18 +82,20 @@ export class VariantAnalysisResultsManager extends DisposableObject {

  public async loadResults(
    variantAnalysisId: number,
+    variantAnalysisStoragePath: string,
    repositoryFullName: string
  ): Promise<VariantAnalysisScannedRepositoryResult> {
    const result = this.cachedResults.get(createCacheKey(variantAnalysisId, repositoryFullName));

-    return result ?? await this.loadResultsIntoMemory(variantAnalysisId, repositoryFullName);
+    return result ?? await this.loadResultsIntoMemory(variantAnalysisId, variantAnalysisStoragePath, repositoryFullName);
  }

  private async loadResultsIntoMemory(
    variantAnalysisId: number,
+    variantAnalysisStoragePath: string,
    repositoryFullName: string,
  ): Promise<VariantAnalysisScannedRepositoryResult> {
-    const result = await this.loadResultsFromStorage(variantAnalysisId, repositoryFullName);
+    const result = await this.loadResultsFromStorage(variantAnalysisId, variantAnalysisStoragePath, repositoryFullName);
    this.cachedResults.set(createCacheKey(variantAnalysisId, repositoryFullName), result);
    this._onResultLoaded.fire(result);
    return result;
@@ -101,13 +103,14 @@ export class VariantAnalysisResultsManager extends DisposableObject {

  private async loadResultsFromStorage(
    variantAnalysisId: number,
+    variantAnalysisStoragePath: string,
    repositoryFullName: string,
  ): Promise<VariantAnalysisScannedRepositoryResult> {
-    if (!(await this.isVariantAnalysisRepoDownloaded(variantAnalysisId, repositoryFullName))) {
+    if (!(await this.isVariantAnalysisRepoDownloaded(variantAnalysisStoragePath, repositoryFullName))) {
      throw new Error('Variant analysis results not downloaded');
    }

-    const storageDirectory = this.getRepoStorageDirectory(variantAnalysisId, repositoryFullName);
+    const storageDirectory = this.getRepoStorageDirectory(variantAnalysisStoragePath, repositoryFullName);

    const repoTask: VariantAnalysisRepoTask = await fs.readJson(path.join(storageDirectory, VariantAnalysisResultsManager.REPO_TASK_FILENAME));

@@ -144,10 +147,10 @@ export class VariantAnalysisResultsManager extends DisposableObject {
  }

  private async isVariantAnalysisRepoDownloaded(
-    variantAnalysisId: number,
+    variantAnalysisStoragePath: string,
    repositoryFullName: string,
  ): Promise<boolean> {
-    return await fs.pathExists(this.getRepoStorageDirectory(variantAnalysisId, repositoryFullName));
+    return await fs.pathExists(this.getRepoStorageDirectory(variantAnalysisStoragePath, repositoryFullName));
  }

  private async readBqrsResults(filePath: string, fileLinkPrefix: string, sourceLocationPrefix: string): Promise<AnalysisRawResults> {
@@ -165,16 +168,9 @@ export class VariantAnalysisResultsManager extends DisposableObject {
    return processedSarif.alerts;
  }

-  private getStorageDirectory(variantAnalysisId: number): string {
+  public getRepoStorageDirectory(variantAnalysisStoragePath: string, fullName: string): string {
    return path.join(
-      this.storagePath,
-      `${variantAnalysisId}`
-    );
-  }
-
-  public getRepoStorageDirectory(variantAnalysisId: number, fullName: string): string {
-    return path.join(
-      this.getStorageDirectory(variantAnalysisId),
+      variantAnalysisStoragePath,
      fullName
    );
  }
--- a/extensions/ql-vscode/src/run-queries-shared.ts
+++ b/extensions/ql-vscode/src/run-queries-shared.ts
@@ -192,13 +192,13 @@ export class QueryEvaluationInfo {
    if (await this.hasDil()) {
      return this.dilPath;
    }
-    const compiledQuery = path.join(this.querySaveDir, 'compiledQuery.qlo');
+    const compiledQuery = this.compileQueryPath;
    if (!(await fs.pathExists(compiledQuery))) {
      if (await cliServer.cliConstraints.supportsNewQueryServer()) {
        // This could be from the new query server
        // in which case we expect the qlo to be missing so we should ignore it
        throw new Error(
-          `DIL was not found. ${compiledQuery}`
+          `DIL was not found. Expected location: '${this.dilPath}'`
        );
      } else {
        throw new Error(
--- a/extensions/ql-vscode/src/stories/Overview.stories.mdx
+++ b/extensions/ql-vscode/src/stories/Overview.stories.mdx
@@ -10,6 +10,59 @@ import bodyImage from './images/update-css-variables-body.png';

 Welcome to the Storybook for **CodeQL for Visual Studio Code**! This Storybook contains stories for components and pages in the extension.

+### Switching themes
+
+To switch between VSCode Dark+ and Light+ themes, you can make the following changes:
+
+```diff
+diff --git a/extensions/ql-vscode/.storybook/manager.ts b/extensions/ql-vscode/.storybook/manager.ts
+--- a/extensions/ql-vscode/.storybook/manager.ts
+++ b/extensions/ql-vscode/.storybook/manager.ts
+@@ -2,6 +2,6 @@ import { addons } from '@storybook/addons';
+ import { themes } from '@storybook/theming';
+
+ addons.setConfig({
+-  theme: themes.dark,
+  theme: themes.light,
+   enableShortcuts: false,
+ });
+diff --git a/extensions/ql-vscode/.storybook/preview.ts b/extensions/ql-vscode/.storybook/preview.ts
+--- a/extensions/ql-vscode/.storybook/preview.ts
+++ b/extensions/ql-vscode/.storybook/preview.ts
+@@ -4,7 +4,7 @@ import { action } from '@storybook/addon-actions';
+ // Allow all stories/components to use Codicons
+ import '@vscode/codicons/dist/codicon.css';
+
+-import '../src/stories/vscode-theme-dark.css';
+import '../src/stories/vscode-theme-light.css';
+
+ // https://storybook.js.org/docs/react/configure/overview#configure-story-rendering
+ export const parameters = {
+@@ -19,14 +19,14 @@ export const parameters = {
+   },
+-   // Use a dark theme to be aligned with VSCode
+   // Use a light theme to be aligned with VSCode
+   docs: {
+-    theme: themes.dark,
+    theme: themes.light,
+   },
+   backgrounds: {
+-    default: 'dark',
+    default: 'light',
+     values: [
+       {
+-        name: 'dark',
+-        value: '#1e1e1e',
+        name: 'light',
+        value: '#ffffff',
+       },
+     ],
+   }
+```
+
+You will need to restart Storybook to apply the theme change to the Storybook UI. The preview frame should update
+automatically.
+
 ### Writing stories

 To create new stories, copy an existing story in the `src/stories` directory and modify it to use your component or page. Please note that
@@ -29,7 +82,7 @@ for the WebView UI Toolkit can be found [here](https://microsoft.github.io/vscod

 ### Updating VSCode CSS variables

-The VSCode CSS variables that are injected into the Storybook preview are defined in the `src/stories/vscode-theme.css` file. They need to be
+The VSCode CSS variables that are injected into the Storybook preview are defined in the `src/stories/vscode-theme-dark.css` file. They need to be
 updated manually if new variables are added to VSCode. It can also be updated if you would like to manually preview a different theme. To update
 these variables, follow these steps:

@@ -47,9 +100,11 @@ expand all CSS variables.

 <img src={stylesImage} />

-7. Copy all variables to the `src/stories/vscode-theme.css` file.
+7. Copy all variables to the `src/stories/vscode-theme-dark.css` file.
 8. Now, select the `<body>` element which is a direct child of the `<html>` element.
-9. This time, you do not need to copy the variables. Instead, copy the styles on the `<body>` element to the `src/stories/vscode-theme.css` file.
+9. This time, you do not need to copy the variables. Instead, copy the styles on the `<body>` element to the `src/stories/vscode-theme-dark.css` file.
 See the image below for which styles need to be copied.

 <img src={bodyImage} />
+
+The same process can also be followed for updating the `src/stories/vscode-theme-light.css` file, but make sure to select the **Light+** theme.
--- a/extensions/ql-vscode/src/stories/vscode-theme-dark.css
+++ b/extensions/ql-vscode/src/stories/vscode-theme-dark.css
--- a/extensions/ql-vscode/src/stories/vscode-theme-light.css
+++ b/extensions/ql-vscode/src/stories/vscode-theme-light.css
@@ -0,0 +1,628 @@
+/*
+ * These were copied from VSCode Light+ theme.
+ *
+ * To update these, open a webview in VSCode, open the webview developer tools and find the
+ * iframe hosting the webview. The <html> element will have a style attribute that contains
+ * the CSS variables. Copy these to this file.
+ */
+:root {
+  --vscode-font-family: -apple-system, BlinkMacSystemFont, sans-serif;
+  --vscode-font-weight: normal;
+  --vscode-font-size: 13px;
+  --vscode-editor-font-family: Menlo, Monaco, "Courier New", monospace;
+  --vscode-editor-font-weight: normal;
+  --vscode-editor-font-size: 12px;
+  --vscode-foreground: #616161;
+  --vscode-disabledForeground: rgba(97, 97, 97, 0.5);
+  --vscode-errorForeground: #a1260d;
+  --vscode-descriptionForeground: #717171;
+  --vscode-icon-foreground: #424242;
+  --vscode-focusBorder: #0090f1;
+  --vscode-textSeparator-foreground: rgba(0, 0, 0, 0.18);
+  --vscode-textLink-foreground: #006ab1;
+  --vscode-textLink-activeForeground: #006ab1;
+  --vscode-textPreformat-foreground: #a31515;
+  --vscode-textBlockQuote-background: rgba(127, 127, 127, 0.1);
+  --vscode-textBlockQuote-border: rgba(0, 122, 204, 0.5);
+  --vscode-textCodeBlock-background: rgba(220, 220, 220, 0.4);
+  --vscode-widget-shadow: rgba(0, 0, 0, 0.16);
+  --vscode-input-background: #ffffff;
+  --vscode-input-foreground: #616161;
+  --vscode-inputOption-activeBorder: rgba(0, 122, 204, 0);
+  --vscode-inputOption-hoverBackground: rgba(184, 184, 184, 0.31);
+  --vscode-inputOption-activeBackground: rgba(0, 144, 241, 0.2);
+  --vscode-inputOption-activeForeground: #000000;
+  --vscode-input-placeholderForeground: #767676;
+  --vscode-inputValidation-infoBackground: #d6ecf2;
+  --vscode-inputValidation-infoBorder: #007acc;
+  --vscode-inputValidation-warningBackground: #f6f5d2;
+  --vscode-inputValidation-warningBorder: #b89500;
+  --vscode-inputValidation-errorBackground: #f2dede;
+  --vscode-inputValidation-errorBorder: #be1100;
+  --vscode-dropdown-background: #ffffff;
+  --vscode-dropdown-border: #cecece;
+  --vscode-checkbox-background: #ffffff;
+  --vscode-checkbox-border: #cecece;
+  --vscode-button-foreground: #ffffff;
+  --vscode-button-separator: rgba(255, 255, 255, 0.4);
+  --vscode-button-background: #007acc;
+  --vscode-button-hoverBackground: #0062a3;
+  --vscode-button-secondaryForeground: #ffffff;
+  --vscode-button-secondaryBackground: #5f6a79;
+  --vscode-button-secondaryHoverBackground: #4c5561;
+  --vscode-badge-background: #c4c4c4;
+  --vscode-badge-foreground: #333333;
+  --vscode-scrollbar-shadow: #dddddd;
+  --vscode-scrollbarSlider-background: rgba(100, 100, 100, 0.4);
+  --vscode-scrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);
+  --vscode-scrollbarSlider-activeBackground: rgba(0, 0, 0, 0.6);
+  --vscode-progressBar-background: #0e70c0;
+  --vscode-editorError-foreground: #e51400;
+  --vscode-editorWarning-foreground: #bf8803;
+  --vscode-editorInfo-foreground: #1a85ff;
+  --vscode-editorHint-foreground: #6c6c6c;
+  --vscode-sash-hoverBorder: #0090f1;
+  --vscode-editor-background: #ffffff;
+  --vscode-editor-foreground: #000000;
+  --vscode-editorStickyScroll-background: #ffffff;
+  --vscode-editorStickyScrollHover-background: #f0f0f0;
+  --vscode-editorWidget-background: #f3f3f3;
+  --vscode-editorWidget-foreground: #616161;
+  --vscode-editorWidget-border: #c8c8c8;
+  --vscode-quickInput-background: #f3f3f3;
+  --vscode-quickInput-foreground: #616161;
+  --vscode-quickInputTitle-background: rgba(0, 0, 0, 0.06);
+  --vscode-pickerGroup-foreground: #0066bf;
+  --vscode-pickerGroup-border: #cccedb;
+  --vscode-keybindingLabel-background: rgba(221, 221, 221, 0.4);
+  --vscode-keybindingLabel-foreground: #555555;
+  --vscode-keybindingLabel-border: rgba(204, 204, 204, 0.4);
+  --vscode-keybindingLabel-bottomBorder: rgba(187, 187, 187, 0.4);
+  --vscode-editor-selectionBackground: #add6ff;
+  --vscode-editor-inactiveSelectionBackground: #e5ebf1;
+  --vscode-editor-selectionHighlightBackground: rgba(173, 214, 255, 0.5);
+  --vscode-editor-findMatchBackground: #a8ac94;
+  --vscode-editor-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);
+  --vscode-editor-findRangeHighlightBackground: rgba(180, 180, 180, 0.3);
+  --vscode-searchEditor-findMatchBackground: rgba(234, 92, 0, 0.22);
+  --vscode-editor-hoverHighlightBackground: rgba(173, 214, 255, 0.15);
+  --vscode-editorHoverWidget-background: #f3f3f3;
+  --vscode-editorHoverWidget-foreground: #616161;
+  --vscode-editorHoverWidget-border: #c8c8c8;
+  --vscode-editorHoverWidget-statusBarBackground: #e7e7e7;
+  --vscode-editorLink-activeForeground: #0000ff;
+  --vscode-editorInlayHint-foreground: #333333;
+  --vscode-editorInlayHint-background: rgba(196, 196, 196, 0.6);
+  --vscode-editorInlayHint-typeForeground: #333333;
+  --vscode-editorInlayHint-typeBackground: rgba(196, 196, 196, 0.6);
+  --vscode-editorInlayHint-parameterForeground: #333333;
+  --vscode-editorInlayHint-parameterBackground: rgba(196, 196, 196, 0.6);
+  --vscode-editorLightBulb-foreground: #ddb100;
+  --vscode-editorLightBulbAutoFix-foreground: #007acc;
+  --vscode-diffEditor-insertedTextBackground: rgba(156, 204, 44, 0.25);
+  --vscode-diffEditor-removedTextBackground: rgba(255, 0, 0, 0.2);
+  --vscode-diffEditor-insertedLineBackground: rgba(155, 185, 85, 0.2);
+  --vscode-diffEditor-removedLineBackground: rgba(255, 0, 0, 0.2);
+  --vscode-diffEditor-diagonalFill: rgba(34, 34, 34, 0.2);
+  --vscode-list-focusOutline: #0090f1;
+  --vscode-list-focusAndSelectionOutline: #90c2f9;
+  --vscode-list-activeSelectionBackground: #0060c0;
+  --vscode-list-activeSelectionForeground: #ffffff;
+  --vscode-list-activeSelectionIconForeground: #ffffff;
+  --vscode-list-inactiveSelectionBackground: #e4e6f1;
+  --vscode-list-hoverBackground: #e8e8e8;
+  --vscode-list-dropBackground: #d6ebff;
+  --vscode-list-highlightForeground: #0066bf;
+  --vscode-list-focusHighlightForeground: #bbe7ff;
+  --vscode-list-invalidItemForeground: #b89500;
+  --vscode-list-errorForeground: #b01011;
+  --vscode-list-warningForeground: #855f00;
+  --vscode-listFilterWidget-background: #f3f3f3;
+  --vscode-listFilterWidget-outline: rgba(0, 0, 0, 0);
+  --vscode-listFilterWidget-noMatchesOutline: #be1100;
+  --vscode-listFilterWidget-shadow: rgba(0, 0, 0, 0.16);
+  --vscode-list-filterMatchBackground: rgba(234, 92, 0, 0.33);
+  --vscode-tree-indentGuidesStroke: #a9a9a9;
+  --vscode-tree-tableColumnsBorder: rgba(97, 97, 97, 0.13);
+  --vscode-tree-tableOddRowsBackground: rgba(97, 97, 97, 0.04);
+  --vscode-list-deemphasizedForeground: #8e8e90;
+  --vscode-quickInputList-focusForeground: #ffffff;
+  --vscode-quickInputList-focusIconForeground: #ffffff;
+  --vscode-quickInputList-focusBackground: #0060c0;
+  --vscode-menu-foreground: #616161;
+  --vscode-menu-background: #ffffff;
+  --vscode-menu-selectionForeground: #ffffff;
+  --vscode-menu-selectionBackground: #0060c0;
+  --vscode-menu-separatorBackground: #d4d4d4;
+  --vscode-toolbar-hoverBackground: rgba(184, 184, 184, 0.31);
+  --vscode-toolbar-activeBackground: rgba(166, 166, 166, 0.31);
+  --vscode-editor-snippetTabstopHighlightBackground: rgba(10, 50, 100, 0.2);
+  --vscode-editor-snippetFinalTabstopHighlightBorder: rgba(10, 50, 100, 0.5);
+  --vscode-breadcrumb-foreground: rgba(97, 97, 97, 0.8);
+  --vscode-breadcrumb-background: #ffffff;
+  --vscode-breadcrumb-focusForeground: #4e4e4e;
+  --vscode-breadcrumb-activeSelectionForeground: #4e4e4e;
+  --vscode-breadcrumbPicker-background: #f3f3f3;
+  --vscode-merge-currentHeaderBackground: rgba(64, 200, 174, 0.5);
+  --vscode-merge-currentContentBackground: rgba(64, 200, 174, 0.2);
+  --vscode-merge-incomingHeaderBackground: rgba(64, 166, 255, 0.5);
+  --vscode-merge-incomingContentBackground: rgba(64, 166, 255, 0.2);
+  --vscode-merge-commonHeaderBackground: rgba(96, 96, 96, 0.4);
+  --vscode-merge-commonContentBackground: rgba(96, 96, 96, 0.16);
+  --vscode-editorOverviewRuler-currentContentForeground: rgba(
+    64,
+    200,
+    174,
+    0.5
+  );
+  --vscode-editorOverviewRuler-incomingContentForeground: rgba(
+    64,
+    166,
+    255,
+    0.5
+  );
+  --vscode-editorOverviewRuler-commonContentForeground: rgba(96, 96, 96, 0.4);
+  --vscode-editorOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
+  --vscode-editorOverviewRuler-selectionHighlightForeground: rgba(
+    160,
+    160,
+    160,
+    0.8
+  );
+  --vscode-minimap-findMatchHighlight: #d18616;
+  --vscode-minimap-selectionOccurrenceHighlight: #c9c9c9;
+  --vscode-minimap-selectionHighlight: #add6ff;
+  --vscode-minimap-errorHighlight: rgba(255, 18, 18, 0.7);
+  --vscode-minimap-warningHighlight: #bf8803;
+  --vscode-minimap-foregroundOpacity: #000000;
+  --vscode-minimapSlider-background: rgba(100, 100, 100, 0.2);
+  --vscode-minimapSlider-hoverBackground: rgba(100, 100, 100, 0.35);
+  --vscode-minimapSlider-activeBackground: rgba(0, 0, 0, 0.3);
+  --vscode-problemsErrorIcon-foreground: #e51400;
+  --vscode-problemsWarningIcon-foreground: #bf8803;
+  --vscode-problemsInfoIcon-foreground: #1a85ff;
+  --vscode-charts-foreground: #616161;
+  --vscode-charts-lines: rgba(97, 97, 97, 0.5);
+  --vscode-charts-red: #e51400;
+  --vscode-charts-blue: #1a85ff;
+  --vscode-charts-yellow: #bf8803;
+  --vscode-charts-orange: #d18616;
+  --vscode-charts-green: #388a34;
+  --vscode-charts-purple: #652d90;
+  --vscode-editor-lineHighlightBorder: #eeeeee;
+  --vscode-editor-rangeHighlightBackground: rgba(253, 255, 0, 0.2);
+  --vscode-editor-symbolHighlightBackground: rgba(234, 92, 0, 0.33);
+  --vscode-editorCursor-foreground: #000000;
+  --vscode-editorWhitespace-foreground: rgba(51, 51, 51, 0.2);
+  --vscode-editorIndentGuide-background: #d3d3d3;
+  --vscode-editorIndentGuide-activeBackground: #939393;
+  --vscode-editorLineNumber-foreground: #237893;
+  --vscode-editorActiveLineNumber-foreground: #0b216f;
+  --vscode-editorLineNumber-activeForeground: #0b216f;
+  --vscode-editorRuler-foreground: #d3d3d3;
+  --vscode-editorCodeLens-foreground: #919191;
+  --vscode-editorBracketMatch-background: rgba(0, 100, 0, 0.1);
+  --vscode-editorBracketMatch-border: #b9b9b9;
+  --vscode-editorOverviewRuler-border: rgba(127, 127, 127, 0.3);
+  --vscode-editorGutter-background: #ffffff;
+  --vscode-editorUnnecessaryCode-opacity: rgba(0, 0, 0, 0.47);
+  --vscode-editorGhostText-foreground: rgba(0, 0, 0, 0.47);
+  --vscode-editorOverviewRuler-rangeHighlightForeground: rgba(0, 122, 204, 0.6);
+  --vscode-editorOverviewRuler-errorForeground: rgba(255, 18, 18, 0.7);
+  --vscode-editorOverviewRuler-warningForeground: #bf8803;
+  --vscode-editorOverviewRuler-infoForeground: #1a85ff;
+  --vscode-editorBracketHighlight-foreground1: #0431fa;
+  --vscode-editorBracketHighlight-foreground2: #319331;
+  --vscode-editorBracketHighlight-foreground3: #7b3814;
+  --vscode-editorBracketHighlight-foreground4: rgba(0, 0, 0, 0);
+  --vscode-editorBracketHighlight-foreground5: rgba(0, 0, 0, 0);
+  --vscode-editorBracketHighlight-foreground6: rgba(0, 0, 0, 0);
+  --vscode-editorBracketHighlight-unexpectedBracket\.foreground: rgba(
+    255,
+    18,
+    18,
+    0.8
+  );
+  --vscode-editorBracketPairGuide-background1: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-background2: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-background3: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-background4: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-background5: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-background6: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground1: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground2: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground3: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground4: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground5: rgba(0, 0, 0, 0);
+  --vscode-editorBracketPairGuide-activeBackground6: rgba(0, 0, 0, 0);
+  --vscode-editorUnicodeHighlight-border: #cea33d;
+  --vscode-editorUnicodeHighlight-background: rgba(206, 163, 61, 0.08);
+  --vscode-symbolIcon-arrayForeground: #616161;
+  --vscode-symbolIcon-booleanForeground: #616161;
+  --vscode-symbolIcon-classForeground: #d67e00;
+  --vscode-symbolIcon-colorForeground: #616161;
+  --vscode-symbolIcon-constantForeground: #616161;
+  --vscode-symbolIcon-constructorForeground: #652d90;
+  --vscode-symbolIcon-enumeratorForeground: #d67e00;
+  --vscode-symbolIcon-enumeratorMemberForeground: #007acc;
+  --vscode-symbolIcon-eventForeground: #d67e00;
+  --vscode-symbolIcon-fieldForeground: #007acc;
+  --vscode-symbolIcon-fileForeground: #616161;
+  --vscode-symbolIcon-folderForeground: #616161;
+  --vscode-symbolIcon-functionForeground: #652d90;
+  --vscode-symbolIcon-interfaceForeground: #007acc;
+  --vscode-symbolIcon-keyForeground: #616161;
+  --vscode-symbolIcon-keywordForeground: #616161;
+  --vscode-symbolIcon-methodForeground: #652d90;
+  --vscode-symbolIcon-moduleForeground: #616161;
+  --vscode-symbolIcon-namespaceForeground: #616161;
+  --vscode-symbolIcon-nullForeground: #616161;
+  --vscode-symbolIcon-numberForeground: #616161;
+  --vscode-symbolIcon-objectForeground: #616161;
+  --vscode-symbolIcon-operatorForeground: #616161;
+  --vscode-symbolIcon-packageForeground: #616161;
+  --vscode-symbolIcon-propertyForeground: #616161;
+  --vscode-symbolIcon-referenceForeground: #616161;
+  --vscode-symbolIcon-snippetForeground: #616161;
+  --vscode-symbolIcon-stringForeground: #616161;
+  --vscode-symbolIcon-structForeground: #616161;
+  --vscode-symbolIcon-textForeground: #616161;
+  --vscode-symbolIcon-typeParameterForeground: #616161;
+  --vscode-symbolIcon-unitForeground: #616161;
+  --vscode-symbolIcon-variableForeground: #007acc;
+  --vscode-editorHoverWidget-highlightForeground: #0066bf;
+  --vscode-editorOverviewRuler-bracketMatchForeground: #a0a0a0;
+  --vscode-editor-foldBackground: rgba(173, 214, 255, 0.3);
+  --vscode-editorGutter-foldingControlForeground: #424242;
+  --vscode-editor-linkedEditingBackground: rgba(255, 0, 0, 0.3);
+  --vscode-editor-wordHighlightBackground: rgba(87, 87, 87, 0.25);
+  --vscode-editor-wordHighlightStrongBackground: rgba(14, 99, 156, 0.25);
+  --vscode-editorOverviewRuler-wordHighlightForeground: rgba(
+    160,
+    160,
+    160,
+    0.8
+  );
+  --vscode-editorOverviewRuler-wordHighlightStrongForeground: rgba(
+    192,
+    160,
+    192,
+    0.8
+  );
+  --vscode-peekViewTitle-background: rgba(26, 133, 255, 0.1);
+  --vscode-peekViewTitleLabel-foreground: #000000;
+  --vscode-peekViewTitleDescription-foreground: #616161;
+  --vscode-peekView-border: #1a85ff;
+  --vscode-peekViewResult-background: #f3f3f3;
+  --vscode-peekViewResult-lineForeground: #646465;
+  --vscode-peekViewResult-fileForeground: #1e1e1e;
+  --vscode-peekViewResult-selectionBackground: rgba(51, 153, 255, 0.2);
+  --vscode-peekViewResult-selectionForeground: #6c6c6c;
+  --vscode-peekViewEditor-background: #f2f8fc;
+  --vscode-peekViewEditorGutter-background: #f2f8fc;
+  --vscode-peekViewResult-matchHighlightBackground: rgba(234, 92, 0, 0.3);
+  --vscode-peekViewEditor-matchHighlightBackground: rgba(245, 216, 2, 0.87);
+  --vscode-editorMarkerNavigationError-background: #e51400;
+  --vscode-editorMarkerNavigationError-headerBackground: rgba(229, 20, 0, 0.1);
+  --vscode-editorMarkerNavigationWarning-background: #bf8803;
+  --vscode-editorMarkerNavigationWarning-headerBackground: rgba(
+    191,
+    136,
+    3,
+    0.1
+  );
+  --vscode-editorMarkerNavigationInfo-background: #1a85ff;
+  --vscode-editorMarkerNavigationInfo-headerBackground: rgba(26, 133, 255, 0.1);
+  --vscode-editorMarkerNavigation-background: #ffffff;
+  --vscode-editorSuggestWidget-background: #f3f3f3;
+  --vscode-editorSuggestWidget-border: #c8c8c8;
+  --vscode-editorSuggestWidget-foreground: #000000;
+  --vscode-editorSuggestWidget-selectedForeground: #ffffff;
+  --vscode-editorSuggestWidget-selectedIconForeground: #ffffff;
+  --vscode-editorSuggestWidget-selectedBackground: #0060c0;
+  --vscode-editorSuggestWidget-highlightForeground: #0066bf;
+  --vscode-editorSuggestWidget-focusHighlightForeground: #bbe7ff;
+  --vscode-editorSuggestWidgetStatus-foreground: rgba(0, 0, 0, 0.5);
+  --vscode-tab-activeBackground: #ffffff;
+  --vscode-tab-unfocusedActiveBackground: #ffffff;
+  --vscode-tab-inactiveBackground: #ececec;
+  --vscode-tab-unfocusedInactiveBackground: #ececec;
+  --vscode-tab-activeForeground: #333333;
+  --vscode-tab-inactiveForeground: rgba(51, 51, 51, 0.7);
+  --vscode-tab-unfocusedActiveForeground: rgba(51, 51, 51, 0.7);
+  --vscode-tab-unfocusedInactiveForeground: rgba(51, 51, 51, 0.35);
+  --vscode-tab-border: #f3f3f3;
+  --vscode-tab-lastPinnedBorder: rgba(97, 97, 97, 0.19);
+  --vscode-tab-activeModifiedBorder: #33aaee;
+  --vscode-tab-inactiveModifiedBorder: rgba(51, 170, 238, 0.5);
+  --vscode-tab-unfocusedActiveModifiedBorder: rgba(51, 170, 238, 0.7);
+  --vscode-tab-unfocusedInactiveModifiedBorder: rgba(51, 170, 238, 0.25);
+  --vscode-editorPane-background: #ffffff;
+  --vscode-editorGroupHeader-tabsBackground: #f3f3f3;
+  --vscode-editorGroupHeader-noTabsBackground: #ffffff;
+  --vscode-editorGroup-border: #e7e7e7;
+  --vscode-editorGroup-dropBackground: rgba(38, 119, 203, 0.18);
+  --vscode-editorGroup-dropIntoPromptForeground: #616161;
+  --vscode-editorGroup-dropIntoPromptBackground: #f3f3f3;
+  --vscode-sideBySideEditor-horizontalBorder: #e7e7e7;
+  --vscode-sideBySideEditor-verticalBorder: #e7e7e7;
+  --vscode-panel-background: #ffffff;
+  --vscode-panel-border: rgba(128, 128, 128, 0.35);
+  --vscode-panelTitle-activeForeground: #424242;
+  --vscode-panelTitle-inactiveForeground: rgba(66, 66, 66, 0.75);
+  --vscode-panelTitle-activeBorder: #424242;
+  --vscode-panelInput-border: #dddddd;
+  --vscode-panel-dropBorder: #424242;
+  --vscode-panelSection-dropBackground: rgba(38, 119, 203, 0.18);
+  --vscode-panelSectionHeader-background: rgba(128, 128, 128, 0.2);
+  --vscode-panelSection-border: rgba(128, 128, 128, 0.35);
+  --vscode-banner-background: #004386;
+  --vscode-banner-foreground: #ffffff;
+  --vscode-banner-iconForeground: #1a85ff;
+  --vscode-statusBar-foreground: #ffffff;
+  --vscode-statusBar-noFolderForeground: #ffffff;
+  --vscode-statusBar-background: #007acc;
+  --vscode-statusBar-noFolderBackground: #68217a;
+  --vscode-statusBar-focusBorder: #ffffff;
+  --vscode-statusBarItem-activeBackground: rgba(255, 255, 255, 0.18);
+  --vscode-statusBarItem-focusBorder: #ffffff;
+  --vscode-statusBarItem-hoverBackground: rgba(255, 255, 255, 0.12);
+  --vscode-statusBarItem-compactHoverBackground: rgba(255, 255, 255, 0.2);
+  --vscode-statusBarItem-prominentForeground: #ffffff;
+  --vscode-statusBarItem-prominentBackground: rgba(0, 0, 0, 0.5);
+  --vscode-statusBarItem-prominentHoverBackground: rgba(0, 0, 0, 0.3);
+  --vscode-statusBarItem-errorBackground: #c72e0f;
+  --vscode-statusBarItem-errorForeground: #ffffff;
+  --vscode-statusBarItem-warningBackground: #725102;
+  --vscode-statusBarItem-warningForeground: #ffffff;
+  --vscode-activityBar-background: #2c2c2c;
+  --vscode-activityBar-foreground: #ffffff;
+  --vscode-activityBar-inactiveForeground: rgba(255, 255, 255, 0.4);
+  --vscode-activityBar-activeBorder: #ffffff;
+  --vscode-activityBar-dropBorder: #ffffff;
+  --vscode-activityBarBadge-background: #007acc;
+  --vscode-activityBarBadge-foreground: #ffffff;
+  --vscode-activityBarItem-settingsProfilesForeground: rgba(255, 255, 255, 0.4);
+  --vscode-activityBarItem-settingsProfilesHoverForeground: #ffffff;
+  --vscode-activityBarItem-settingsProfilesBackground: #4d4d4d;
+  --vscode-statusBarItem-remoteBackground: #16825d;
+  --vscode-statusBarItem-remoteForeground: #ffffff;
+  --vscode-extensionBadge-remoteBackground: #007acc;
+  --vscode-extensionBadge-remoteForeground: #ffffff;
+  --vscode-sideBar-background: #f3f3f3;
+  --vscode-sideBarTitle-foreground: #6f6f6f;
+  --vscode-sideBar-dropBackground: rgba(38, 119, 203, 0.18);
+  --vscode-sideBarSectionHeader-background: rgba(0, 0, 0, 0);
+  --vscode-sideBarSectionHeader-border: rgba(97, 97, 97, 0.19);
+  --vscode-titleBar-activeForeground: #333333;
+  --vscode-titleBar-inactiveForeground: rgba(51, 51, 51, 0.6);
+  --vscode-titleBar-activeBackground: #dddddd;
+  --vscode-titleBar-inactiveBackground: rgba(221, 221, 221, 0.6);
+  --vscode-menubar-selectionForeground: #333333;
+  --vscode-menubar-selectionBackground: rgba(184, 184, 184, 0.31);
+  --vscode-notifications-foreground: #616161;
+  --vscode-notifications-background: #f3f3f3;
+  --vscode-notificationLink-foreground: #006ab1;
+  --vscode-notificationCenterHeader-background: #e7e7e7;
+  --vscode-notifications-border: #e7e7e7;
+  --vscode-notificationsErrorIcon-foreground: #e51400;
+  --vscode-notificationsWarningIcon-foreground: #bf8803;
+  --vscode-notificationsInfoIcon-foreground: #1a85ff;
+  --vscode-commandCenter-foreground: #333333;
+  --vscode-commandCenter-activeForeground: #333333;
+  --vscode-commandCenter-activeBackground: rgba(184, 184, 184, 0.31);
+  --vscode-commandCenter-border: rgba(128, 128, 128, 0.35);
+  --vscode-editorCommentsWidget-resolvedBorder: rgba(97, 97, 97, 0.5);
+  --vscode-editorCommentsWidget-unresolvedBorder: #1a85ff;
+  --vscode-editorCommentsWidget-rangeBackground: rgba(26, 133, 255, 0.1);
+  --vscode-editorCommentsWidget-rangeBorder: rgba(26, 133, 255, 0.4);
+  --vscode-editorCommentsWidget-rangeActiveBackground: rgba(26, 133, 255, 0.1);
+  --vscode-editorCommentsWidget-rangeActiveBorder: rgba(26, 133, 255, 0.4);
+  --vscode-editorGutter-commentRangeForeground: #d5d8e9;
+  --vscode-debugToolBar-background: #f3f3f3;
+  --vscode-debugIcon-startForeground: #388a34;
+  --vscode-editor-stackFrameHighlightBackground: rgba(255, 255, 102, 0.45);
+  --vscode-editor-focusedStackFrameHighlightBackground: rgba(
+    206,
+    231,
+    206,
+    0.45
+  );
+  --vscode-mergeEditor-change\.background: rgba(155, 185, 85, 0.2);
+  --vscode-mergeEditor-change\.word\.background: rgba(156, 204, 44, 0.4);
+  --vscode-mergeEditor-conflict\.unhandledUnfocused\.border: rgba(
+    255,
+    166,
+    0,
+    0.48
+  );
+  --vscode-mergeEditor-conflict\.unhandledFocused\.border: #ffa600;
+  --vscode-mergeEditor-conflict\.handledUnfocused\.border: rgba(
+    134,
+    134,
+    134,
+    0.29
+  );
+  --vscode-mergeEditor-conflict\.handledFocused\.border: rgba(
+    193,
+    193,
+    193,
+    0.8
+  );
+  --vscode-mergeEditor-conflict\.handled\.minimapOverViewRuler: rgba(
+    173,
+    172,
+    168,
+    0.93
+  );
+  --vscode-mergeEditor-conflict\.unhandled\.minimapOverViewRuler: #fcba03;
+  --vscode-mergeEditor-conflictingLines\.background: rgba(255, 234, 0, 0.28);
+  --vscode-settings-headerForeground: #444444;
+  --vscode-settings-modifiedItemIndicator: #66afe0;
+  --vscode-settings-headerBorder: rgba(128, 128, 128, 0.35);
+  --vscode-settings-sashBorder: rgba(128, 128, 128, 0.35);
+  --vscode-settings-dropdownBackground: #ffffff;
+  --vscode-settings-dropdownBorder: #cecece;
+  --vscode-settings-dropdownListBorder: #c8c8c8;
+  --vscode-settings-checkboxBackground: #ffffff;
+  --vscode-settings-checkboxBorder: #cecece;
+  --vscode-settings-textInputBackground: #ffffff;
+  --vscode-settings-textInputForeground: #616161;
+  --vscode-settings-textInputBorder: #cecece;
+  --vscode-settings-numberInputBackground: #ffffff;
+  --vscode-settings-numberInputForeground: #616161;
+  --vscode-settings-numberInputBorder: #cecece;
+  --vscode-settings-focusedRowBackground: rgba(232, 232, 232, 0.6);
+  --vscode-settings-rowHoverBackground: rgba(232, 232, 232, 0.3);
+  --vscode-settings-focusedRowBorder: rgba(0, 0, 0, 0.12);
+  --vscode-terminal-foreground: #333333;
+  --vscode-terminal-selectionBackground: #add6ff;
+  --vscode-terminal-inactiveSelectionBackground: #e5ebf1;
+  --vscode-terminalCommandDecoration-defaultBackground: rgba(0, 0, 0, 0.25);
+  --vscode-terminalCommandDecoration-successBackground: #2090d3;
+  --vscode-terminalCommandDecoration-errorBackground: #e51400;
+  --vscode-terminalOverviewRuler-cursorForeground: rgba(160, 160, 160, 0.8);
+  --vscode-terminal-border: rgba(128, 128, 128, 0.35);
+  --vscode-terminal-findMatchBackground: #a8ac94;
+  --vscode-terminal-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);
+  --vscode-terminalOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);
+  --vscode-terminal-dropBackground: rgba(38, 119, 203, 0.18);
+  --vscode-testing-iconFailed: #f14c4c;
+  --vscode-testing-iconErrored: #f14c4c;
+  --vscode-testing-iconPassed: #73c991;
+  --vscode-testing-runAction: #73c991;
+  --vscode-testing-iconQueued: #cca700;
+  --vscode-testing-iconUnset: #848484;
+  --vscode-testing-iconSkipped: #848484;
+  --vscode-testing-peekBorder: #e51400;
+  --vscode-testing-peekHeaderBackground: rgba(229, 20, 0, 0.1);
+  --vscode-testing-message\.error\.decorationForeground: #e51400;
+  --vscode-testing-message\.error\.lineBackground: rgba(255, 0, 0, 0.2);
+  --vscode-testing-message\.info\.decorationForeground: rgba(0, 0, 0, 0.5);
+  --vscode-welcomePage-tileBackground: #f3f3f3;
+  --vscode-welcomePage-tileHoverBackground: #dbdbdb;
+  --vscode-welcomePage-tileShadow: rgba(0, 0, 0, 0.16);
+  --vscode-welcomePage-progress\.background: #ffffff;
+  --vscode-welcomePage-progress\.foreground: #006ab1;
+  --vscode-debugExceptionWidget-border: #a31515;
+  --vscode-debugExceptionWidget-background: #f1dfde;
+  --vscode-ports-iconRunningProcessForeground: #369432;
+  --vscode-statusBar-debuggingBackground: #cc6633;
+  --vscode-statusBar-debuggingForeground: #ffffff;
+  --vscode-editor-inlineValuesForeground: rgba(0, 0, 0, 0.5);
+  --vscode-editor-inlineValuesBackground: rgba(255, 200, 0, 0.2);
+  --vscode-editorGutter-modifiedBackground: #2090d3;
+  --vscode-editorGutter-addedBackground: #48985d;
+  --vscode-editorGutter-deletedBackground: #e51400;
+  --vscode-minimapGutter-modifiedBackground: #2090d3;
+  --vscode-minimapGutter-addedBackground: #48985d;
+  --vscode-minimapGutter-deletedBackground: #e51400;
+  --vscode-editorOverviewRuler-modifiedForeground: rgba(32, 144, 211, 0.6);
+  --vscode-editorOverviewRuler-addedForeground: rgba(72, 152, 93, 0.6);
+  --vscode-editorOverviewRuler-deletedForeground: rgba(229, 20, 0, 0.6);
+  --vscode-debugIcon-breakpointForeground: #e51400;
+  --vscode-debugIcon-breakpointDisabledForeground: #848484;
+  --vscode-debugIcon-breakpointUnverifiedForeground: #848484;
+  --vscode-debugIcon-breakpointCurrentStackframeForeground: #be8700;
+  --vscode-debugIcon-breakpointStackframeForeground: #89d185;
+  --vscode-notebook-cellBorderColor: #e8e8e8;
+  --vscode-notebook-focusedEditorBorder: #0090f1;
+  --vscode-notebookStatusSuccessIcon-foreground: #388a34;
+  --vscode-notebookStatusErrorIcon-foreground: #a1260d;
+  --vscode-notebookStatusRunningIcon-foreground: #616161;
+  --vscode-notebook-cellToolbarSeparator: rgba(128, 128, 128, 0.35);
+  --vscode-notebook-selectedCellBackground: rgba(200, 221, 241, 0.31);
+  --vscode-notebook-selectedCellBorder: #e8e8e8;
+  --vscode-notebook-focusedCellBorder: #0090f1;
+  --vscode-notebook-inactiveFocusedCellBorder: #e8e8e8;
+  --vscode-notebook-cellStatusBarItemHoverBackground: rgba(0, 0, 0, 0.08);
+  --vscode-notebook-cellInsertionIndicator: #0090f1;
+  --vscode-notebookScrollbarSlider-background: rgba(100, 100, 100, 0.4);
+  --vscode-notebookScrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);
+  --vscode-notebookScrollbarSlider-activeBackground: rgba(0, 0, 0, 0.6);
+  --vscode-notebook-symbolHighlightBackground: rgba(253, 255, 0, 0.2);
+  --vscode-notebook-cellEditorBackground: #f3f3f3;
+  --vscode-notebook-editorBackground: #ffffff;
+  --vscode-keybindingTable-headerBackground: rgba(97, 97, 97, 0.04);
+  --vscode-keybindingTable-rowsBackground: rgba(97, 97, 97, 0.04);
+  --vscode-scm-providerBorder: #c8c8c8;
+  --vscode-searchEditor-textInputBorder: #cecece;
+  --vscode-debugTokenExpression-name: #9b46b0;
+  --vscode-debugTokenExpression-value: rgba(108, 108, 108, 0.8);
+  --vscode-debugTokenExpression-string: #a31515;
+  --vscode-debugTokenExpression-boolean: #0000ff;
+  --vscode-debugTokenExpression-number: #098658;
+  --vscode-debugTokenExpression-error: #e51400;
+  --vscode-debugView-exceptionLabelForeground: #ffffff;
+  --vscode-debugView-exceptionLabelBackground: #a31515;
+  --vscode-debugView-stateLabelForeground: #616161;
+  --vscode-debugView-stateLabelBackground: rgba(136, 136, 136, 0.27);
+  --vscode-debugView-valueChangedHighlight: #569cd6;
+  --vscode-debugConsole-infoForeground: #1a85ff;
+  --vscode-debugConsole-warningForeground: #bf8803;
+  --vscode-debugConsole-errorForeground: #a1260d;
+  --vscode-debugConsole-sourceForeground: #616161;
+  --vscode-debugConsoleInputIcon-foreground: #616161;
+  --vscode-debugIcon-pauseForeground: #007acc;
+  --vscode-debugIcon-stopForeground: #a1260d;
+  --vscode-debugIcon-disconnectForeground: #a1260d;
+  --vscode-debugIcon-restartForeground: #388a34;
+  --vscode-debugIcon-stepOverForeground: #007acc;
+  --vscode-debugIcon-stepIntoForeground: #007acc;
+  --vscode-debugIcon-stepOutForeground: #007acc;
+  --vscode-debugIcon-continueForeground: #007acc;
+  --vscode-debugIcon-stepBackForeground: #007acc;
+  --vscode-extensionButton-prominentBackground: #007acc;
+  --vscode-extensionButton-prominentForeground: #ffffff;
+  --vscode-extensionButton-prominentHoverBackground: #0062a3;
+  --vscode-extensionIcon-starForeground: #df6100;
+  --vscode-extensionIcon-verifiedForeground: #006ab1;
+  --vscode-extensionIcon-preReleaseForeground: #1d9271;
+  --vscode-extensionIcon-sponsorForeground: #b51e78;
+  --vscode-terminal-ansiBlack: #000000;
+  --vscode-terminal-ansiRed: #cd3131;
+  --vscode-terminal-ansiGreen: #00bc00;
+  --vscode-terminal-ansiYellow: #949800;
+  --vscode-terminal-ansiBlue: #0451a5;
+  --vscode-terminal-ansiMagenta: #bc05bc;
+  --vscode-terminal-ansiCyan: #0598bc;
+  --vscode-terminal-ansiWhite: #555555;
+  --vscode-terminal-ansiBrightBlack: #666666;
+  --vscode-terminal-ansiBrightRed: #cd3131;
+  --vscode-terminal-ansiBrightGreen: #14ce14;
+  --vscode-terminal-ansiBrightYellow: #b5ba00;
+  --vscode-terminal-ansiBrightBlue: #0451a5;
+  --vscode-terminal-ansiBrightMagenta: #bc05bc;
+  --vscode-terminal-ansiBrightCyan: #0598bc;
+  --vscode-terminal-ansiBrightWhite: #a5a5a5;
+  --vscode-interactive-activeCodeBorder: #1a85ff;
+  --vscode-interactive-inactiveCodeBorder: #e4e6f1;
+  --vscode-gitDecoration-addedResourceForeground: #587c0c;
+  --vscode-gitDecoration-modifiedResourceForeground: #895503;
+  --vscode-gitDecoration-deletedResourceForeground: #ad0707;
+  --vscode-gitDecoration-renamedResourceForeground: #007100;
+  --vscode-gitDecoration-untrackedResourceForeground: #007100;
+  --vscode-gitDecoration-ignoredResourceForeground: #8e8e90;
+  --vscode-gitDecoration-stageModifiedResourceForeground: #895503;
+  --vscode-gitDecoration-stageDeletedResourceForeground: #ad0707;
+  --vscode-gitDecoration-conflictingResourceForeground: #ad0707;
+  --vscode-gitDecoration-submoduleResourceForeground: #1258a7;
+  --vscode-issues-newIssueDecoration: rgba(0, 0, 0, 0.28);
+  --vscode-issues-open: #22863a;
+  --vscode-issues-closed: #cb2431;
+  --vscode-pullRequests-notification: #1a85ff;
+  --vscode-testExplorer-errorDecorationBackground: #f2dede;
+}
+
+/**
+ * This is copied in the same way, but from the <body> element
+ */
+body {
+  background-color: transparent;
+  color: var(--vscode-editor-foreground);
+  font-family: var(--vscode-font-family);
+  font-weight: var(--vscode-font-weight);
+  font-size: var(--vscode-font-size);
+  margin: 0;
+  padding: 0 20px;
+}
--- a/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-manager.test.ts
+++ b/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-manager.test.ts
@@ -149,6 +149,17 @@ describe('Variant Analysis Manager', async function() {

        expect(getVariantAnalysisRepoResultStub.calledOnce).to.be.true;
      });
+
+      it('should pop download tasks off the queue', async () => {
+        const getResultsSpy = sandbox.spy(variantAnalysisManager, 'autoDownloadVariantAnalysisResult');
+
+        await variantAnalysisManager.enqueueDownload(scannedRepos[0], variantAnalysis, cancellationTokenSource.token);
+        await variantAnalysisManager.enqueueDownload(scannedRepos[1], variantAnalysis, cancellationTokenSource.token);
+        await variantAnalysisManager.enqueueDownload(scannedRepos[2], variantAnalysis, cancellationTokenSource.token);
+
+        expect(variantAnalysisManager.downloadsQueueSize()).to.equal(0);
+        expect(getResultsSpy).to.have.been.calledThrice;
+      });
    });
  });
 });
--- a/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-monitor.test.ts
+++ b/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-monitor.test.ts
@@ -1,6 +1,6 @@
 import * as sinon from 'sinon';
 import { expect } from 'chai';
-import { CancellationTokenSource, extensions } from 'vscode';
+import { CancellationTokenSource, commands, extensions } from 'vscode';
 import { CodeQLExtensionInterface } from '../../../extension';
 import * as config from '../../../config';

@@ -8,8 +8,8 @@ import * as ghApiClient from '../../../remote-queries/gh-api/gh-api-client';
 import { VariantAnalysisMonitor } from '../../../remote-queries/variant-analysis-monitor';
 import {
  VariantAnalysis as VariantAnalysisApiResponse,
+  VariantAnalysisFailureReason,
  VariantAnalysisScannedRepository as ApiVariantAnalysisScannedRepository,
-  VariantAnalysisFailureReason
 } from '../../../remote-queries/gh-api/variant-analysis';
 import { createFailedMockApiResponse, createMockApiResponse } from '../../factories/remote-queries/gh-api/variant-analysis-api-response';
 import { VariantAnalysis, VariantAnalysisStatus } from '../../../remote-queries/shared/variant-analysis';
@@ -17,15 +17,19 @@ import { createMockScannedRepos } from '../../factories/remote-queries/gh-api/sc
 import { processFailureReason } from '../../../remote-queries/variant-analysis-processor';
 import { Credentials } from '../../../authentication';
 import { createMockVariantAnalysis } from '../../factories/remote-queries/shared/variant-analysis';
+import { VariantAnalysisManager } from '../../../remote-queries/variant-analysis-manager';

 describe('Variant Analysis Monitor', async function() {
  this.timeout(60000);

  let sandbox: sinon.SinonSandbox;
+  let extension: CodeQLExtensionInterface | Record<string, never>;
  let mockGetVariantAnalysis: sinon.SinonStub;
  let cancellationTokenSource: CancellationTokenSource;
  let variantAnalysisMonitor: VariantAnalysisMonitor;
  let variantAnalysis: VariantAnalysis;
+  let variantAnalysisManager: VariantAnalysisManager;
+  let mockGetDownloadResult: sinon.SinonStub;

  beforeEach(async () => {
    sandbox = sinon.createSandbox();
@@ -36,12 +40,15 @@ describe('Variant Analysis Monitor', async function() {
    variantAnalysis = createMockVariantAnalysis();

    try {
-      const extension = await extensions.getExtension<CodeQLExtensionInterface | Record<string, never>>('GitHub.vscode-codeql')!.activate();
+      extension = await extensions.getExtension<CodeQLExtensionInterface | Record<string, never>>('GitHub.vscode-codeql')!.activate();
      variantAnalysisMonitor = new VariantAnalysisMonitor(extension.ctx);
    } catch (e) {
      fail(e as Error);
    }

+    variantAnalysisManager = extension.variantAnalysisManager;
+    mockGetDownloadResult = sandbox.stub(variantAnalysisManager, 'autoDownloadVariantAnalysisResult');
+
    limitNumberOfAttemptsToMonitor();
  });

@@ -110,20 +117,47 @@ describe('Variant Analysis Monitor', async function() {
    describe('when the variant analysis is in progress', async () => {
      let mockApiResponse: VariantAnalysisApiResponse;
      let scannedRepos: ApiVariantAnalysisScannedRepository[];
+      let succeededRepos: ApiVariantAnalysisScannedRepository[];

      describe('when there are successfully scanned repos', async () => {
        beforeEach(async function() {
-          scannedRepos = createMockScannedRepos(['pending', 'in_progress', 'succeeded']);
+          scannedRepos = createMockScannedRepos(['pending', 'pending', 'in_progress', 'in_progress', 'succeeded', 'succeeded', 'succeeded']);
          mockApiResponse = createMockApiResponse('completed', scannedRepos);
          mockGetVariantAnalysis = sandbox.stub(ghApiClient, 'getVariantAnalysis').resolves(mockApiResponse);
+          succeededRepos = scannedRepos.filter(r => r.analysis_status === 'succeeded');
        });

        it('should succeed and return a list of scanned repo ids', async () => {
          const result = await variantAnalysisMonitor.monitorVariantAnalysis(variantAnalysis, cancellationTokenSource.token);
-          const scannedRepoIds = scannedRepos.filter(r => r.analysis_status == 'succeeded').map(r => r.repository.id);

          expect(result.status).to.equal('CompletedSuccessfully');
-          expect(result.scannedReposDownloaded).to.eql(scannedRepoIds);
+          expect(result.scannedReposDownloaded).to.eql(succeededRepos.map(r => r.repository.id));
+        });
+
+        it('should trigger a download extension command for each repo', async () => {
+          const succeededRepos = scannedRepos.filter(r => r.analysis_status === 'succeeded');
+          const commandSpy = sandbox.spy(commands, 'executeCommand');
+
+          await variantAnalysisMonitor.monitorVariantAnalysis(variantAnalysis, cancellationTokenSource.token);
+
+          expect(commandSpy).to.have.callCount(succeededRepos.length);
+
+          succeededRepos.forEach((succeededRepo, index) => {
+            expect(commandSpy.getCall(index).args[0]).to.eq('codeQL.autoDownloadVariantAnalysisResult');
+            expect(commandSpy.getCall(index).args[1]).to.eq(succeededRepo);
+            expect(commandSpy.getCall(index).args[2]).to.eq(mockApiResponse);
+          });
+        });
+
+        it('should download all available results', async () => {
+          await variantAnalysisMonitor.monitorVariantAnalysis(variantAnalysis, cancellationTokenSource.token);
+
+          expect(mockGetDownloadResult).to.have.callCount(succeededRepos.length);
+
+          succeededRepos.forEach((succeededRepo, index) => {
+            expect(mockGetDownloadResult.getCall(index).args[0]).to.eq(succeededRepo);
+            expect(mockGetDownloadResult.getCall(index).args[1]).to.eq(mockApiResponse);
+          });
        });
      });

@@ -142,6 +176,12 @@ describe('Variant Analysis Monitor', async function() {
          expect(result.status).to.equal('CompletedSuccessfully');
          expect(result.scannedReposDownloaded).to.eql([]);
        });
+
+        it('should not try to download any repos', async () => {
+          await variantAnalysisMonitor.monitorVariantAnalysis(variantAnalysis, cancellationTokenSource.token);
+
+          expect(mockGetDownloadResult).to.not.have.been.called;
+        });
      });

      describe('when there are no repos to scan', async () => {
@@ -157,6 +197,12 @@ describe('Variant Analysis Monitor', async function() {
          expect(result.status).to.equal('CompletedSuccessfully');
          expect(result.scannedReposDownloaded).to.eql([]);
        });
+
+        it('should not try to download any repos', async () => {
+          await variantAnalysisMonitor.monitorVariantAnalysis(variantAnalysis, cancellationTokenSource.token);
+
+          expect(mockGetDownloadResult).to.not.have.been.called;
+        });
      });
    });
  });
--- a/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-results-manager.test.ts
+++ b/extensions/ql-vscode/src/vscode-tests/cli-integration/remote-queries/variant-analysis-results-manager.test.ts
@@ -15,7 +15,9 @@ import { faker } from '@faker-js/faker';
 import * as ghApiClient from '../../../remote-queries/gh-api/gh-api-client';
 import { VariantAnalysisRepoTask } from '../../../remote-queries/gh-api/variant-analysis';

-describe(VariantAnalysisResultsManager.name, () => {
+describe(VariantAnalysisResultsManager.name, function() {
+  this.timeout(10000);
+
  let sandbox: sinon.SinonSandbox;
  let cli: CodeQLCliServer;
  let variantAnalysisId: number;
@@ -33,7 +35,7 @@ describe(VariantAnalysisResultsManager.name, () => {
    try {
      const extension = await extensions.getExtension<CodeQLExtensionInterface | Record<string, never>>('GitHub.vscode-codeql')!.activate();
      cli = extension.cliServer;
-      variantAnalysisResultsManager = new VariantAnalysisResultsManager(cli, storagePath, logger);
+      variantAnalysisResultsManager = new VariantAnalysisResultsManager(cli, logger);
    } catch (e) {
      fail(e as Error);
    }
@@ -45,12 +47,17 @@ describe(VariantAnalysisResultsManager.name, () => {

  describe('download', () => {
    let getOctokitStub: sinon.SinonStub;
+    let variantAnalysisStoragePath: string;
    const mockCredentials = {
      getOctokit: () => Promise.resolve({
        request: getOctokitStub
      })
    } as unknown as Credentials;

+    beforeEach(async () => {
+      variantAnalysisStoragePath = path.join(storagePath, variantAnalysisId.toString());
+    });
+
    describe('when the artifact_url is missing', async () => {
      it('should not try to download the result', async () => {
        const dummyRepoTask = createMockVariantAnalysisRepoTask();
@@ -60,7 +67,8 @@ describe(VariantAnalysisResultsManager.name, () => {
          await variantAnalysisResultsManager.download(
            mockCredentials,
            variantAnalysisId,
-            dummyRepoTask
+            dummyRepoTask,
+            variantAnalysisStoragePath
          );

          expect.fail('Expected an error to be thrown');
@@ -78,7 +86,7 @@ describe(VariantAnalysisResultsManager.name, () => {
      beforeEach(async () => {
        dummyRepoTask = createMockVariantAnalysisRepoTask();

-        storageDirectory = variantAnalysisResultsManager.getRepoStorageDirectory(variantAnalysisId, dummyRepoTask.repository.full_name);
+        storageDirectory = variantAnalysisResultsManager.getRepoStorageDirectory(variantAnalysisStoragePath, dummyRepoTask.repository.full_name);
        const sourceFilePath = path.join(__dirname, '../../../../src/vscode-tests/cli-integration/data/variant-analysis-results.zip');
        arrayBuffer = fs.readFileSync(sourceFilePath).buffer;

@@ -97,7 +105,8 @@ describe(VariantAnalysisResultsManager.name, () => {
        await variantAnalysisResultsManager.download(
          mockCredentials,
          variantAnalysisId,
-          dummyRepoTask
+          dummyRepoTask,
+          variantAnalysisStoragePath
        );

        expect(getVariantAnalysisRepoResultStub.calledOnce).to.be.true;
@@ -107,7 +116,8 @@ describe(VariantAnalysisResultsManager.name, () => {
        await variantAnalysisResultsManager.download(
          mockCredentials,
          variantAnalysisId,
-          dummyRepoTask
+          dummyRepoTask,
+          variantAnalysisStoragePath
        );

        expect(fs.existsSync(`${storageDirectory}/results.zip`)).to.be.true;
@@ -117,7 +127,8 @@ describe(VariantAnalysisResultsManager.name, () => {
        await variantAnalysisResultsManager.download(
          mockCredentials,
          variantAnalysisId,
-          dummyRepoTask
+          dummyRepoTask,
+          variantAnalysisStoragePath
        );

        expect(fs.existsSync(`${storageDirectory}/results/results.sarif`)).to.be.true;
--- a/extensions/ql-vscode/test/pure-tests/query-history-info.test.ts
+++ b/extensions/ql-vscode/test/pure-tests/query-history-info.test.ts
@@ -0,0 +1,83 @@
+import { expect } from 'chai';
+
+import { QueryStatus } from '../../src/query-status';
+import { getQueryHistoryItemId, getQueryText, getRawQueryName } from '../../src/query-history-info';
+import { VariantAnalysisHistoryItem } from '../../src/remote-queries/variant-analysis-history-item';
+import { createMockVariantAnalysis } from '../../src/vscode-tests/factories/remote-queries/shared/variant-analysis';
+import { createMockLocalQueryInfo } from '../../src/vscode-tests/factories/local-queries/local-query-history-item';
+import { createMockRemoteQueryHistoryItem } from '../../src/vscode-tests/factories/remote-queries/remote-query-history-item';
+
+describe('Query history info', () => {
+
+  const date = new Date('2022-01-01T00:00:00.000Z');
+  const dateStr = date.toLocaleString();
+  const localQueryHistoryItem = createMockLocalQueryInfo(dateStr);
+  const remoteQueryHistoryItem = createMockRemoteQueryHistoryItem({});
+  const variantAnalysisHistoryItem: VariantAnalysisHistoryItem = {
+    t: 'variant-analysis',
+    status: QueryStatus.InProgress,
+    completed: false,
+    historyItemId: 'abc123',
+    variantAnalysis: createMockVariantAnalysis()
+  };
+
+  describe('getRawQueryName', () => {
+    it('should get the name for local history items', () => {
+      const queryName = getRawQueryName(localQueryHistoryItem);
+
+      expect(queryName).to.equal(localQueryHistoryItem.getQueryName());
+    });
+
+    it('should get the name for remote query history items', () => {
+      const queryName = getRawQueryName(remoteQueryHistoryItem);
+
+      expect(queryName).to.equal(remoteQueryHistoryItem.remoteQuery.queryName);
+    });
+
+    it('should get the name for variant analysis history items', () => {
+      const queryName = getRawQueryName(variantAnalysisHistoryItem);
+
+      expect(queryName).to.equal(variantAnalysisHistoryItem.variantAnalysis.query.name);
+    });
+  });
+
+  describe('getQueryHistoryItemId', () => {
+    it('should get the ID for local history items', () => {
+      const historyItemId = getQueryHistoryItemId(localQueryHistoryItem);
+
+      expect(historyItemId).to.equal(localQueryHistoryItem.initialInfo.id);
+    });
+
+    it('should get the ID for remote query history items', () => {
+      const historyItemId = getQueryHistoryItemId(remoteQueryHistoryItem);
+
+      expect(historyItemId).to.equal(remoteQueryHistoryItem.queryId);
+    });
+
+    it('should get the ID for variant analysis history items', () => {
+      const historyItemId = getQueryHistoryItemId(variantAnalysisHistoryItem);
+
+      expect(historyItemId).to.equal(variantAnalysisHistoryItem.historyItemId);
+    });
+  });
+
+  describe('getQueryText', () => {
+    it('should get the query text for local history items', () => {
+      const queryText = getQueryText(localQueryHistoryItem);
+
+      expect(queryText).to.equal(localQueryHistoryItem.initialInfo.queryText);
+    });
+
+    it('should get the query text for remote query history items', () => {
+      const queryText = getQueryText(remoteQueryHistoryItem);
+
+      expect(queryText).to.equal(remoteQueryHistoryItem.remoteQuery.queryText);
+    });
+
+    it('should get the query text for variant analysis history items', () => {
+      const queryText = getQueryText(variantAnalysisHistoryItem);
+
+      expect(queryText).to.equal(variantAnalysisHistoryItem.variantAnalysis.query.text);
+    });
+  });
+});