mrva/vscode-codeql
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Pull out AlertTablePathNodeRow to a separate component

Browse Source
This commit is contained in:
Robert
2023-08-16 11:27:59 +01:00
parent 7e31b6e42a
commit 91e69c93be
2 changed files with 113 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
extensions/ql-vscode/src/view/results/AlertTable.tsx
View File

@@ -24,6 +24,7 @@ import { SarifLocation } from "./locations/SarifLocation";
import { AlertTableDropdownIndicatorCell } from "./AlertTableDropdownIndicatorCell"; import { AlertTableDropdownIndicatorCell } from "./AlertTableDropdownIndicatorCell";
import { AlertTableNoResults } from "./AlertTableNoResults"; import { AlertTableNoResults } from "./AlertTableNoResults";
import { AlertTableTruncatedMessage } from "./AlertTableTruncatedMessage"; import { AlertTableTruncatedMessage } from "./AlertTableTruncatedMessage";
import { AlertTablePathNodeRow } from "./AlertTablePathNodeRow";
type AlertTableProps = ResultTableProps & { type AlertTableProps = ResultTableProps & {
resultSet: InterpretedResultSet<SarifInterpretationData>; resultSet: InterpretedResultSet<SarifInterpretationData>;
@@ -210,81 +211,20 @@ export class AlertTable extends React.Component<
const pathNodeRows = const pathNodeRows =
currentPathExpanded && currentPathExpanded &&
path.locations.map((step, pathNodeIndex) => { path.locations.map((step, pathNodeIndex) => (
const pathNodeKey: Keys.PathNode = { <AlertTablePathNodeRow
...pathKey, key={`${resultIndex}-${pathIndex}-${pathNodeIndex}`}
pathNodeIndex, step={step}
}; pathNodeIndex={pathNodeIndex}
const msg = pathIndex={pathIndex}
step.location !== undefined && resultIndex={resultIndex}
step.location.message !== undefined ? ( selectedItem={selectedItem}
<SarifLocation databaseUri={databaseUri}
text={step.location.message.text} sourceLocationPrefix={sourceLocationPrefix}
loc={step.location} updateSelectionCallback={updateSelectionCallback}
sourceLocationPrefix={sourceLocationPrefix} scroller={this.scroller}
databaseUri={databaseUri} />
onClick={updateSelectionCallback(pathNodeKey)} ));
/>
) : (
"[no location]"
);
const additionalMsg =
step.location !== undefined ? (
<SarifLocation
loc={step.location}
sourceLocationPrefix={sourceLocationPrefix}
databaseUri={databaseUri}
onClick={updateSelectionCallback(pathNodeKey)}
/>
) : (
""
);
const isSelected = Keys.equalsNotUndefined(
this.state.selectedItem,
pathNodeKey,
);
const stepIndex = pathNodeIndex + 1; // Convert to 1-based
const zebraIndex = resultIndex + stepIndex;
return (
<tr
ref={this.scroller.ref(isSelected)}
className={
isSelected
? "vscode-codeql__selected-path-node"
: undefined
}
key={`${resultIndex}-${pathIndex}-${pathNodeIndex}`}
>
<td className="vscode-codeql__icon-cell">
<span className="vscode-codeql__vertical-rule"></span>
</td>
<td className="vscode-codeql__icon-cell">
<span className="vscode-codeql__vertical-rule"></span>
</td>
<td
{...selectableZebraStripe(
isSelected,
zebraIndex,
"vscode-codeql__path-index-cell",
)}
>
{stepIndex}
</td>
<td {...selectableZebraStripe(isSelected, zebraIndex)}>
{msg}{" "}
</td>
<td
{...selectableZebraStripe(
isSelected,
zebraIndex,
"vscode-codeql__location-cell",
)}
>
{additionalMsg}
</td>
</tr>
);
});
return ( return (
<> <>

98
extensions/ql-vscode/src/view/results/AlertTablePathNodeRow.tsx Normal file
View File

@@ -0,0 +1,98 @@
import * as React from "react";
import * as Sarif from "sarif";
import * as Keys from "./result-keys";
import { SarifLocation } from "./locations/SarifLocation";
import { selectableZebraStripe } from "./result-table-utils";
import { ScrollIntoViewHelper } from "./scroll-into-view-helper";
interface Props {
step: Sarif.ThreadFlowLocation;
pathNodeIndex: number;
pathIndex: number;
resultIndex: number;
selectedItem: undefined | Keys.ResultKey;
databaseUri: string;
sourceLocationPrefix: string;
updateSelectionCallback: (
resultKey: Keys.PathNode | Keys.Result | undefined,
) => () => void;
scroller: ScrollIntoViewHelper;
}
export function AlertTablePathNodeRow(props: Props) {
const {
step,
pathNodeIndex,
pathIndex,
resultIndex,
selectedItem,
databaseUri,
sourceLocationPrefix,
updateSelectionCallback,
scroller,
} = props;
const pathNodeKey: Keys.PathNode = {
resultIndex,
pathIndex,
pathNodeIndex,
};
const msg =
step.location !== undefined && step.location.message !== undefined ? (
<SarifLocation
text={step.location.message.text}
loc={step.location}
sourceLocationPrefix={sourceLocationPrefix}
databaseUri={databaseUri}
onClick={updateSelectionCallback(pathNodeKey)}
/>
) : (
"[no location]"
);
const additionalMsg =
step.location !== undefined ? (
<SarifLocation
loc={step.location}
sourceLocationPrefix={sourceLocationPrefix}
databaseUri={databaseUri}
onClick={updateSelectionCallback(pathNodeKey)}
/>
) : (
""
);
const isSelected = Keys.equalsNotUndefined(selectedItem, pathNodeKey);
const stepIndex = pathNodeIndex + 1; // Convert to 1-based
const zebraIndex = resultIndex + stepIndex;
return (
<tr
ref={scroller.ref(isSelected)}
className={isSelected ? "vscode-codeql__selected-path-node" : undefined}
>
<td className="vscode-codeql__icon-cell">
<span className="vscode-codeql__vertical-rule"></span>
</td>
<td className="vscode-codeql__icon-cell">
<span className="vscode-codeql__vertical-rule"></span>
</td>
<td
{...selectableZebraStripe(
isSelected,
zebraIndex,
"vscode-codeql__path-index-cell",
)}
>
{stepIndex}
</td>
<td {...selectableZebraStripe(isSelected, zebraIndex)}>{msg} </td>
<td
{...selectableZebraStripe(
isSelected,
zebraIndex,
"vscode-codeql__location-cell",
)}
>
{additionalMsg}
</td>
</tr>
);
}