Move rendering of msg to inside AlertTableResuiltRow

Author: robertbrignull

extensions/ql-vscode/src/view/results/AlertTable.tsx

@@ -17,7 +17,6 @@ import { parseSarifLocation, isNoLocation } from "../../common/sarif-utils";
 import { ScrollIntoViewHelper } from "./scroll-into-view-helper";
 import { sendTelemetry } from "../common/telemetry";
 import { AlertTableHeader } from "./AlertTableHeader";
-import { SarifMessageWithLocations } from "./locations/SarifMessageWithLocations";
 import { AlertTableNoResults } from "./AlertTableNoResults";
 import { AlertTableTruncatedMessage } from "./AlertTableTruncatedMessage";
 import { AlertTablePathRow } from "./AlertTablePathRow";
@@ -100,20 +99,6 @@ export class AlertTable extends React.Component<
       resultSet.interpretation.data.runs[0].results.map(
         (result, resultIndex) => {
           const resultKey: Keys.Result = { resultIndex };
-          const text = result.message.text || "[no text]";
-          const msg =
-            result.relatedLocations === undefined ? (
-              <span key="0">{text}</span>
-            ) : (
-              <SarifMessageWithLocations
-                msg={text}
-                relatedLocations={result.relatedLocations}
-                sourceLocationPrefix={sourceLocationPrefix}
-                databaseUri={databaseUri}
-                onClick={updateSelectionCallback(resultKey)}
-              />
-            );
-
           const currentResultExpanded = this.state.expanded.has(
             Keys.keyToString(resultKey),
           );
@@ -130,7 +115,6 @@ export class AlertTable extends React.Component<
                 updateSelectionCallback={updateSelectionCallback}
                 toggler={toggler}
                 scroller={this.scroller}
-                msg={msg}
               />
               {currentResultExpanded &&
                 result.codeFlows &&

extensions/ql-vscode/src/view/results/AlertTableResultRow.tsx

@@ -7,6 +7,7 @@ import { selectableZebraStripe } from "./result-table-utils";
 import { AlertTableDropdownIndicatorCell } from "./AlertTableDropdownIndicatorCell";
 import { useMemo } from "react";
 import { SarifLocation } from "./locations/SarifLocation";
+import { SarifMessageWithLocations } from "./locations/SarifMessageWithLocations";
 
 interface Props {
   result: Sarif.Result;
@@ -20,7 +21,6 @@ interface Props {
   ) => () => void;
   toggler: (keys: Keys.ResultKey[]) => (e: React.MouseEvent) => void;
   scroller: ScrollIntoViewHelper;
-  msg: JSX.Element;
 }
 
 export function AlertTableResultRow(props: Props) {
@@ -34,7 +34,6 @@ export function AlertTableResultRow(props: Props) {
     updateSelectionCallback,
     toggler,
     scroller,
-    msg,
   } = props;
 
   const resultKey: Keys.Result = useMemo(
@@ -60,6 +59,20 @@ export function AlertTableResultRow(props: Props) {
     selectedItem?.resultIndex === resultIndex &&
     selectedItem.pathIndex === undefined;
 
+  const text = result.message.text || "[no text]";
+  const msg =
+    result.relatedLocations === undefined ? (
+      <span key="0">{text}</span>
+    ) : (
+      <SarifMessageWithLocations
+        msg={text}
+        relatedLocations={result.relatedLocations}
+        sourceLocationPrefix={sourceLocationPrefix}
+        databaseUri={databaseUri}
+        onClick={handleSarifLocationClicked}
+      />
+    );
+
   return (
     <tr
       ref={scroller.ref(resultRowIsSelected)}