Move columns in compare view to result

The columns are part of the result, so they should be moved there. This
is in preparation of showing SARIF results in the same view, which don't
have columns.

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

@@ -353,10 +353,9 @@ export interface SetComparisonsMessage {
       time: string;
     };
   };
-  readonly columns: readonly BqrsColumn[];
   readonly commonResultSetNames: string[];
   readonly currentResultSetName: string;
-  readonly rows: QueryCompareResult | undefined;
+  readonly result: RawQueryCompareResult | undefined;
   readonly message: string | undefined;
   readonly databaseUri: string;
 }
@@ -370,7 +369,8 @@ export interface SetComparisonsMessage {
  * If an array element is null, that means that the element was removed
  * (or added) in the comparison.
  */
-export type QueryCompareResult = {
+export type RawQueryCompareResult = {
+  columns: readonly BqrsColumn[];
   from: ResultRow[];
   to: ResultRow[];
 };

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

@@ -2,7 +2,7 @@ import { ViewColumn } from "vscode";
 
 import {
   FromCompareViewMessage,
-  QueryCompareResult,
+  RawQueryCompareResult,
   ToCompareViewMessage,
 } from "../common/interface-types";
 import { Logger, showAndLogExceptionWithTelemetry } from "../common/logging";
@@ -93,10 +93,10 @@ export class CompareView extends AbstractWebview<
       selectedResultSetName,
     );
     if (currentResultSetDisplayName) {
-      let rows: QueryCompareResult | undefined;
+      let result: RawQueryCompareResult | undefined;
       let message: string | undefined;
       try {
-        rows = this.compareResults(fromResultSet, toResultSet);
+        result = this.compareResults(fromResultSet, toResultSet);
       } catch (e) {
         message = getErrorMessage(e);
       }
@@ -118,10 +118,9 @@ export class CompareView extends AbstractWebview<
             time: to.startTime,
           },
         },
-        columns: fromResultSet.columns,
+        result,
         commonResultSetNames,
         currentResultSetName: currentResultSetDisplayName,
-        rows,
         message,
         databaseUri: to.initialInfo.databaseInfo.databaseUri,
       });
@@ -240,7 +239,7 @@ export class CompareView extends AbstractWebview<
   private compareResults(
     fromResults: DecodedBqrsChunk,
     toResults: DecodedBqrsChunk,
-  ): QueryCompareResult {
+  ): RawQueryCompareResult {
     // Only compare columns that have the same name
     return resultsDiff(fromResults, toResults);
   }

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

@@ -1,5 +1,5 @@
 import { DecodedBqrsChunk } from "../common/bqrs-cli-types";
-import { QueryCompareResult } from "../common/interface-types";
+import { RawQueryCompareResult } from "../common/interface-types";
 
 /**
  * Compare the rows of two queries. Use deep equality to determine if
@@ -22,7 +22,7 @@ import { QueryCompareResult } from "../common/interface-types";
 export default function resultsDiff(
   fromResults: DecodedBqrsChunk,
   toResults: DecodedBqrsChunk,
-): QueryCompareResult {
+): RawQueryCompareResult {
   if (fromResults.columns.length !== toResults.columns.length) {
     throw new Error("CodeQL Compare: Columns do not match.");
   }
@@ -36,6 +36,7 @@ export default function resultsDiff(
   }
 
   const results = {
+    columns: fromResults.columns,
     from: arrayDiff(fromResults.tuples, toResults.tuples),
     to: arrayDiff(toResults.tuples, fromResults.tuples),
   };

extensions/ql-vscode/src/stories/compare/CompareTable.stories.tsx

@@ -31,13 +31,13 @@ CompareTable.args = {
         time: "8/16/2023, 3:07:21 PM",
       },
     },
-    columns: [
-      { name: "a", kind: "Entity" },
-      { name: "b", kind: "Entity" },
-    ],
     commonResultSetNames: ["edges", "nodes", "subpaths", "#select"],
     currentResultSetName: "edges",
-    rows: {
+    result: {
+      columns: [
+        { name: "a", kind: "Entity" },
+        { name: "b", kind: "Entity" },
+      ],
       from: [],
       to: [
         [

extensions/ql-vscode/src/view/compare/Compare.tsx

@@ -14,8 +14,7 @@ import "../results/resultsView.css";
 const emptyComparison: SetComparisonsMessage = {
   t: "setComparisons",
   stats: {},
-  rows: undefined,
-  columns: [],
+  result: undefined,
   commonResultSetNames: [],
   currentResultSetName: "",
   databaseUri: "",
@@ -28,8 +27,8 @@ export function Compare(_: Record<string, never>): JSX.Element {
 
   const message = comparison.message || "Empty comparison";
   const hasRows =
-    comparison.rows &&
-    (comparison.rows.to.length || comparison.rows.from.length);
+    comparison.result &&
+    (comparison.result.to.length || comparison.result.from.length);
 
   useEffect(() => {
     const listener = (evt: MessageEvent) => {

extensions/ql-vscode/src/view/compare/CompareTable.tsx

@@ -22,7 +22,7 @@ const OpenButton = styled(TextButton)`
 
 export default function CompareTable(props: Props) {
   const comparison = props.comparison;
-  const rows = props.comparison.rows!;
+  const result = props.comparison.result!;
 
   async function openQuery(kind: "from" | "to") {
     vscode.postMessage({
@@ -69,8 +69,8 @@ export default function CompareTable(props: Props) {
           <td>{comparison.stats.toQuery?.time}</td>
         </tr>
         <tr>
-          <th>{rows.from.length} rows removed</th>
-          <th>{rows.to.length} rows added</th>
+          <th>{result.from.length} rows removed</th>
+          <th>{result.to.length} rows added</th>
         </tr>
       </thead>
       <tbody>
@@ -78,21 +78,21 @@ export default function CompareTable(props: Props) {
           <td>
             <table className={className}>
               <RawTableHeader
-                columns={comparison.columns}
+                columns={result.columns}
                 schemaName={comparison.currentResultSetName}
                 preventSort={true}
               />
-              {createRows(rows.from, comparison.databaseUri)}
+              {createRows(result.from, comparison.databaseUri)}
             </table>
           </td>
           <td>
             <table className={className}>
               <RawTableHeader
-                columns={comparison.columns}
+                columns={result.columns}
                 schemaName={comparison.currentResultSetName}
                 preventSort={true}
               />
-              {createRows(rows.to, comparison.databaseUri)}
+              {createRows(result.to, comparison.databaseUri)}
             </table>
           </td>
         </tr>