Add config options for default sorting/filtering values in variant analysis results view (#2392)

Author: shati-patel

extensions/ql-vscode/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## [UNRELEASED]
 
+- Add settings `codeQL.variantAnalysis.defaultResultsFilter` and `codeQL.variantAnalysis.defaultResultsSort` for configuring how variant analysis results are filtered and sorted in the results view. The default is to show all repositories, and to sort by the number of results. [#2392](https://github.com/github/vscode-codeql/pull/2392)
+
 ## 1.8.4 - 3 May 2023
 
 - Avoid repeated error messages when unable to monitor a variant analysis. [#2396](https://github.com/github/vscode-codeql/pull/2396)

extensions/ql-vscode/package.json

@@ -329,6 +329,36 @@
           "patternErrorMessage": "Please enter a valid GitHub repository",
           "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.variantAnalysis.defaultResultsFilter": {
+          "type": "string",
+          "default": "all",
+          "enum": [
+            "all",
+            "withResults"
+          ],
+          "enumDescriptions": [
+            "Show all repositories in the results view.",
+            "Show only repositories with results in the results view."
+          ],
+          "description": "The default filter to apply to the variant analysis results view."
+        },
+        "codeQL.variantAnalysis.defaultResultsSort": {
+          "type": "string",
+          "default": "numberOfResults",
+          "enum": [
+            "alphabetically",
+            "popularity",
+            "mostRecentCommit",
+            "numberOfResults"
+          ],
+          "enumDescriptions": [
+            "Sort repositories alphabetically in the results view.",
+            "Sort repositories by popularity in the results view.",
+            "Sort repositories by most recent commit in the results view.",
+            "Sort repositories by number of results in the results view."
+          ],
+          "description": "The default sorting order for repositories in the variant analysis results view."
+        },
         "codeQL.logInsights.joinOrderWarningThreshold": {
           "type": "number",
           "default": 50,

extensions/ql-vscode/src/config.ts

@@ -9,6 +9,11 @@ import {
 import { DistributionManager } from "./codeql-cli/distribution";
 import { extLogger } from "./common";
 import { ONE_DAY_IN_MS } from "./pure/time";
+import {
+  FilterKey,
+  SortKey,
+  defaultFilterSortState,
+} from "./pure/variant-analysis-filter-sort";
 
 export const ALL_SETTINGS: Setting[] = [];
 
@@ -541,6 +546,34 @@ export class VariantAnalysisConfigListener
   }
 }
 
+const VARIANT_ANALYSIS_FILTER_RESULTS = new Setting(
+  "defaultResultsFilter",
+  VARIANT_ANALYSIS_SETTING,
+);
+
+export function getVariantAnalysisDefaultResultsFilter(): FilterKey {
+  const value = VARIANT_ANALYSIS_FILTER_RESULTS.getValue<string>();
+  if (Object.values(FilterKey).includes(value as FilterKey)) {
+    return value as FilterKey;
+  } else {
+    return defaultFilterSortState.filterKey;
+  }
+}
+
+const VARIANT_ANALYSIS_SORT_RESULTS = new Setting(
+  "defaultResultsSort",
+  VARIANT_ANALYSIS_SETTING,
+);
+
+export function getVariantAnalysisDefaultResultsSort(): SortKey {
+  const value = VARIANT_ANALYSIS_SORT_RESULTS.getValue<string>();
+  if (Object.values(SortKey).includes(value as SortKey)) {
+    return value as SortKey;
+  } else {
+    return defaultFilterSortState.sortKey;
+  }
+}
+
 /**
  * The branch of "github/codeql-variant-analysis-action" to use with the "Run Variant Analysis" command.
  * Default value is "main".

extensions/ql-vscode/src/pure/interface-types.ts

@@ -11,7 +11,10 @@ import {
   VariantAnalysisScannedRepositoryResult,
   VariantAnalysisScannedRepositoryState,
 } from "../variant-analysis/shared/variant-analysis";
-import { RepositoriesFilterSortStateWithIds } from "./variant-analysis-filter-sort";
+import {
+  RepositoriesFilterSortState,
+  RepositoriesFilterSortStateWithIds,
+} from "./variant-analysis-filter-sort";
 import { ErrorLike } from "./errors";
 import { DataFlowPaths } from "../variant-analysis/shared/data-flow-paths";
 import { ExternalApiUsage } from "../data-extensions-editor/external-api-usage";
@@ -407,6 +410,11 @@ export interface SetVariantAnalysisMessage {
   variantAnalysis: VariantAnalysis;
 }
 
+export interface SetFilterSortStateMessage {
+  t: "setFilterSortState";
+  filterSortState: RepositoriesFilterSortState;
+}
+
 export type VariantAnalysisState = {
   variantAnalysisId: number;
 };
@@ -459,6 +467,7 @@ export interface ShowDataFlowPathsMessage {
 
 export type ToVariantAnalysisMessage =
   | SetVariantAnalysisMessage
+  | SetFilterSortStateMessage
   | SetRepoResultsMessage
   | SetRepoStatesMessage;
 

extensions/ql-vscode/src/pure/variant-analysis-filter-sort.ts

@@ -30,7 +30,7 @@ export type RepositoriesFilterSortStateWithIds = RepositoriesFilterSortState & {
 export const defaultFilterSortState: RepositoriesFilterSortState = {
   searchValue: "",
   filterKey: FilterKey.All,
-  sortKey: SortKey.Alphabetically,
+  sortKey: SortKey.NumberOfResults,
 };
 
 export function matchesFilter(

extensions/ql-vscode/src/variant-analysis/variant-analysis-view.ts

@@ -27,6 +27,10 @@ import { redactableError } from "../pure/errors";
 import { DataFlowPathsView } from "./data-flow-paths-view";
 import { DataFlowPaths } from "./shared/data-flow-paths";
 import { App } from "../common/app";
+import {
+  getVariantAnalysisDefaultResultsFilter,
+  getVariantAnalysisDefaultResultsSort,
+} from "../config";
 
 export class VariantAnalysisView
   extends AbstractWebview<ToVariantAnalysisMessage, FromVariantAnalysisMessage>
@@ -186,11 +190,22 @@ export class VariantAnalysisView
       return;
     }
 
+    const filterSortState = {
+      searchValue: "",
+      filterKey: getVariantAnalysisDefaultResultsFilter(),
+      sortKey: getVariantAnalysisDefaultResultsSort(),
+    };
+
     await this.postMessage({
       t: "setVariantAnalysis",
       variantAnalysis,
     });
 
+    await this.postMessage({
+      t: "setFilterSortState",
+      filterSortState,
+    });
+
     const repoStates = await this.manager.getRepoStates(this.variantAnalysisId);
     if (repoStates.length === 0) {
       return;

extensions/ql-vscode/src/view/common/post-message.ts

@@ -0,0 +1,19 @@
+import { act } from "@testing-library/react";
+
+/** Helper function used in tests */
+export async function postMessage<T>(msg: T): Promise<void> {
+  await act(async () => {
+    // window.postMessage doesn't set the origin correctly, see
+    // https://github.com/jsdom/jsdom/issues/2745
+    window.dispatchEvent(
+      new MessageEvent("message", {
+        source: window,
+        origin: window.location.origin,
+        data: msg,
+      }),
+    );
+
+    // The event is dispatched asynchronously, so we need to wait for it to be handled.
+    await new Promise((resolve) => setTimeout(resolve, 0));
+  });
+}

extensions/ql-vscode/src/view/results/__tests__/results.spec.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { act, render as reactRender, screen } from "@testing-library/react";
+import { render as reactRender, screen } from "@testing-library/react";
 import { ResultsApp } from "../results";
 import {
   Interpretation,
@@ -9,6 +9,7 @@ import {
 import * as fs from "fs-extra";
 import { resolve } from "path";
 import { ColumnKindCode } from "../../../pure/bqrs-cli-types";
+import { postMessage } from "../../common/post-message";
 
 const exampleSarif = fs.readJSONSync(
   resolve(
@@ -19,22 +20,6 @@ const exampleSarif = fs.readJSONSync(
 
 describe(ResultsApp.name, () => {
   const render = () => reactRender(<ResultsApp />);
-  const postMessage = async (msg: IntoResultsViewMsg) => {
-    await act(async () => {
-      // window.postMessage doesn't set the origin correctly, see
-      // https://github.com/jsdom/jsdom/issues/2745
-      window.dispatchEvent(
-        new MessageEvent("message", {
-          source: window,
-          origin: window.location.origin,
-          data: msg,
-        }),
-      );
-
-      // The event is dispatched asynchronously, so we need to wait for it to be handled.
-      await new Promise((resolve) => setTimeout(resolve, 0));
-    });
-  };
 
   it("renders results", async () => {
     render();
@@ -98,13 +83,13 @@ describe(ResultsApp.name, () => {
       },
     };
 
-    await postMessage(message);
+    await postMessage<IntoResultsViewMsg>(message);
 
     expect(
       screen.getByText("'x' is assigned a value but never used."),
     ).toBeInTheDocument();
 
-    await postMessage({
+    await postMessage<IntoResultsViewMsg>({
       ...message,
       t: "showInterpretedPage",
       pageNumber: 1,
@@ -124,7 +109,7 @@ describe(ResultsApp.name, () => {
   it("renders results when switching between queries with different result set names", async () => {
     render();
 
-    await postMessage({
+    await postMessage<IntoResultsViewMsg>({
       t: "setState",
       interpretation: undefined,
       origResultsPaths: {
@@ -162,7 +147,7 @@ describe(ResultsApp.name, () => {
 
     expect(screen.getByText("foobar1")).toBeInTheDocument();
 
-    await postMessage({
+    await postMessage<IntoResultsViewMsg>({
       t: "setState",
       interpretation: undefined,
       origResultsPaths: {

extensions/ql-vscode/src/view/variant-analysis/VariantAnalysis.tsx

@@ -87,6 +87,8 @@ export function VariantAnalysis({
           vscode.setState({
             variantAnalysisId: msg.variantAnalysis.id,
           });
+        } else if (msg.t === "setFilterSortState") {
+          setFilterSortState(msg.filterSortState);
         } else if (msg.t === "setRepoResults") {
           setRepoResults((oldRepoResults) => {
             const newRepoIds = msg.repoResults.map((r) => r.repositoryId);

extensions/ql-vscode/src/view/variant-analysis/__tests__/VariantAnalysis.spec.tsx

@@ -1,11 +1,14 @@
 import * as React from "react";
-import { render as reactRender, screen } from "@testing-library/react";
+import { render as reactRender, screen, waitFor } from "@testing-library/react";
 import {
   VariantAnalysisFailureReason,
   VariantAnalysisStatus,
 } from "../../../variant-analysis/shared/variant-analysis";
 import { VariantAnalysis, VariantAnalysisProps } from "../VariantAnalysis";
 import { createMockVariantAnalysis } from "../../../../test/factories/variant-analysis/shared/variant-analysis";
+import { ToVariantAnalysisMessage } from "../../../pure/interface-types";
+import { FilterKey, SortKey } from "../../../pure/variant-analysis-filter-sort";
+import { postMessage } from "../../common/post-message";
 
 describe(VariantAnalysis.name, () => {
   const render = (props: Partial<VariantAnalysisProps> = {}) =>
@@ -46,4 +49,29 @@ describe(VariantAnalysis.name, () => {
       ),
     ).toBeInTheDocument();
   });
+
+  it("renders results view with correct filter and sort state", async () => {
+    const variantAnalysis = createMockVariantAnalysis({});
+    render({ variantAnalysis });
+
+    await waitFor(() => screen.getByDisplayValue("All"));
+    await waitFor(() => screen.getByDisplayValue("Number of results"));
+
+    await postMessage<ToVariantAnalysisMessage>({
+      t: "setFilterSortState",
+      filterSortState: {
+        searchValue: "",
+        filterKey: FilterKey.WithResults,
+        sortKey: SortKey.Alphabetically,
+      },
+    });
+
+    expect(screen.getByDisplayValue("With results")).toBeInTheDocument();
+    expect(screen.getByDisplayValue("Alphabetically")).toBeInTheDocument();
+
+    expect(screen.queryByDisplayValue("All")).not.toBeInTheDocument();
+    expect(
+      screen.queryByDisplayValue("Number of results"),
+    ).not.toBeInTheDocument();
+  });
 });