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

Refactor predicate row into a separate component

Browse Source
This commit is contained in:
Asger F
2024-11-25 09:16:42 +01:00
parent eec42c5532
commit 9a0699f50a
1 changed files with 86 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

172
extensions/ql-vscode/src/view/compare-performance/ComparePerformance.tsx
View File

@@ -355,16 +355,6 @@ function Chevron({ expanded }: { expanded: boolean }) {
return <Codicon name={expanded ? "chevron-down" : "chevron-right"} />;
}
function withToggledValue<T>(set: Set<T>, value: T) {
const result = new Set(set);
if (result.has(value)) {
result.delete(value);
} else {
result.add(value);
}
return result;
}
function union<T>(a: Set<T> | T[], b: Set<T> | T[]) {
const result = new Set(a);
for (const x of b) {
@@ -407,10 +397,6 @@ function ComparePerformanceWithData(props: {
const comparison = data?.comparison;
const [expandedPredicates, setExpandedPredicates] = useState<Set<string>>(
() => new Set<string>(),
);
const [hideCacheHits, setHideCacheHits] = useState(false);
const [sortOrder, setSortOrder] = useState<"delta" | "absDelta">("absDelta");
@@ -526,78 +512,13 @@ function ComparePerformanceWithData(props: {
</thead>
</Table>
{rows.map((row, rowIndex) => (
<Table
key={row.name}
className={expandedPredicates.has(row.name) ? "expanded" : ""}
>
<tbody>
<PredicateTR
className={expandedPredicates.has(row.name) ? "expanded" : ""}
key={"main"}
onClick={() =>
setExpandedPredicates(
withToggledValue(expandedPredicates, row.name),
)
}
>
<ChevronCell>
<Chevron expanded={expandedPredicates.has(row.name)} />
</ChevronCell>
{comparison && renderPredicateMetric(row.before, metric)}
{renderPredicateMetric(row.after, metric)}
{comparison && renderDelta(row.diff, metric.unit)}
<NameCell>{rowNames[rowIndex]}</NameCell>
</PredicateTR>
{expandedPredicates.has(row.name) && (
<>
<HighLevelStats
before={row.before}
after={row.after}
comparison={comparison}
/>
{collatePipelines(
isPresent(row.before) ? row.before.pipelines : {},
isPresent(row.after) ? row.after.pipelines : {},
).map(({ name, first, second }, pipelineIndex) => (
<Fragment key={pipelineIndex}>
<HeaderTR>
<td></td>
{comparison && (
<NumberHeader>{first != null && "Before"}</NumberHeader>
)}
<NumberHeader>{second != null && "After"}</NumberHeader>
{comparison && (
<NumberHeader>
{first != null && second != null && "Delta"}
</NumberHeader>
)}
<NameHeader>
Tuple counts for &apos;{name}&apos; pipeline
{comparison &&
(first == null
? " (after)"
: second == null
? " (before)"
: "")}
</NameHeader>
</HeaderTR>
{abbreviateRASteps(first?.steps ?? second!.steps).map(
(step, index) => (
<PipelineStep
key={index}
before={first?.counts[index]}
after={second?.counts[index]}
comparison={comparison}
step={step}
/>
),
)}
</Fragment>
))}
</>
)}
</tbody>
</Table>
<PredicateRow
key={rowIndex}
renderedName={rowNames[rowIndex]}
row={row}
comparison={comparison}
metric={metric}
/>
))}
<Table>
<tfoot>
@@ -619,6 +540,85 @@ function ComparePerformanceWithData(props: {
);
}
interface PredicateRowProps {
renderedName: React.ReactNode;
row: TRow;
comparison: boolean;
metric: Metric;
}
function PredicateRow(props: PredicateRowProps) {
const [isExpanded, setExpanded] = useState(false);
const { renderedName, row, comparison, metric } = props;
return (
<Table className={isExpanded ? "expanded" : ""}>
<tbody>
<PredicateTR
className={isExpanded ? "expanded" : ""}
key={"main"}
onClick={() => setExpanded(!isExpanded)}
>
<ChevronCell>
<Chevron expanded={isExpanded} />
</ChevronCell>
{comparison && renderPredicateMetric(row.before, metric)}
{renderPredicateMetric(row.after, metric)}
{comparison && renderDelta(row.diff, metric.unit)}
<NameCell>{renderedName}</NameCell>
</PredicateTR>
{isExpanded && (
<>
<HighLevelStats
before={row.before}
after={row.after}
comparison={comparison}
/>
{collatePipelines(
isPresent(row.before) ? row.before.pipelines : {},
isPresent(row.after) ? row.after.pipelines : {},
).map(({ name, first, second }, pipelineIndex) => (
<Fragment key={pipelineIndex}>
<HeaderTR>
<td></td>
{comparison && (
<NumberHeader>{first != null && "Before"}</NumberHeader>
)}
<NumberHeader>{second != null && "After"}</NumberHeader>
{comparison && (
<NumberHeader>
{first != null && second != null && "Delta"}
</NumberHeader>
)}
<NameHeader>
Tuple counts for &apos;{name}&apos; pipeline
{comparison &&
(first == null
? " (after)"
: second == null
? " (before)"
: "")}
</NameHeader>
</HeaderTR>
{abbreviateRASteps(first?.steps ?? second!.steps).map(
(step, index) => (
<PipelineStep
key={index}
before={first?.counts[index]}
after={second?.counts[index]}
comparison={comparison}
step={step}
/>
),
)}
</Fragment>
))}
</>
)}
</tbody>
</Table>
);
}
interface PipelinePair {
name: string;
first: PipelineSummary | undefined;