Apply a background color to the pipeline header rows
This commit is contained in:
@@ -216,6 +216,10 @@ function PipelineStep(props: PipelineStepProps) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const HeaderTR = styled.tr`
|
||||||
|
background-color: var(--vscode-sideBar-background);
|
||||||
|
`;
|
||||||
|
|
||||||
interface HighLevelStatsProps {
|
interface HighLevelStatsProps {
|
||||||
before: PredicateInfo;
|
before: PredicateInfo;
|
||||||
after: PredicateInfo;
|
after: PredicateInfo;
|
||||||
@@ -229,13 +233,13 @@ function HighLevelStats(props: HighLevelStatsProps) {
|
|||||||
before.evaluationCount > 1 || after.evaluationCount > 1;
|
before.evaluationCount > 1 || after.evaluationCount > 1;
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<tr>
|
<HeaderTR>
|
||||||
<ChevronCell></ChevronCell>
|
<ChevronCell></ChevronCell>
|
||||||
<NumberHeader>{hasBefore ? "Before" : ""}</NumberHeader>
|
<NumberHeader>{hasBefore ? "Before" : ""}</NumberHeader>
|
||||||
<NumberHeader>{hasAfter ? "After" : ""}</NumberHeader>
|
<NumberHeader>{hasAfter ? "After" : ""}</NumberHeader>
|
||||||
<NumberHeader>{hasBefore && hasAfter ? "Delta" : ""}</NumberHeader>
|
<NumberHeader>{hasBefore && hasAfter ? "Delta" : ""}</NumberHeader>
|
||||||
<NameHeader>Stats</NameHeader>
|
<NameHeader>Stats</NameHeader>
|
||||||
</tr>
|
</HeaderTR>
|
||||||
{showEvaluationCount && (
|
{showEvaluationCount && (
|
||||||
<PipelineStep
|
<PipelineStep
|
||||||
before={before.evaluationCount || undefined}
|
before={before.evaluationCount || undefined}
|
||||||
@@ -393,13 +397,13 @@ export function ComparePerformance(_: Record<string, never>) {
|
|||||||
</SortOrderDropdown>
|
</SortOrderDropdown>
|
||||||
<Table>
|
<Table>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<HeaderTR>
|
||||||
<ChevronCell />
|
<ChevronCell />
|
||||||
<NumberHeader>Before</NumberHeader>
|
<NumberHeader>Before</NumberHeader>
|
||||||
<NumberHeader>After</NumberHeader>
|
<NumberHeader>After</NumberHeader>
|
||||||
<NumberHeader>Delta</NumberHeader>
|
<NumberHeader>Delta</NumberHeader>
|
||||||
<NameHeader>Predicate</NameHeader>
|
<NameHeader>Predicate</NameHeader>
|
||||||
</tr>
|
</HeaderTR>
|
||||||
</thead>
|
</thead>
|
||||||
</Table>
|
</Table>
|
||||||
{rows.map((row) => (
|
{rows.map((row) => (
|
||||||
@@ -433,7 +437,7 @@ export function ComparePerformance(_: Record<string, never>) {
|
|||||||
row.after.pipelines,
|
row.after.pipelines,
|
||||||
).map(({ name, first, second }, pipelineIndex) => (
|
).map(({ name, first, second }, pipelineIndex) => (
|
||||||
<Fragment key={pipelineIndex}>
|
<Fragment key={pipelineIndex}>
|
||||||
<tr>
|
<HeaderTR>
|
||||||
<td></td>
|
<td></td>
|
||||||
<NumberHeader>{first != null && "Before"}</NumberHeader>
|
<NumberHeader>{first != null && "Before"}</NumberHeader>
|
||||||
<NumberHeader>{second != null && "After"}</NumberHeader>
|
<NumberHeader>{second != null && "After"}</NumberHeader>
|
||||||
@@ -448,7 +452,7 @@ export function ComparePerformance(_: Record<string, never>) {
|
|||||||
? " (before)"
|
? " (before)"
|
||||||
: ""}
|
: ""}
|
||||||
</NameHeader>
|
</NameHeader>
|
||||||
</tr>
|
</HeaderTR>
|
||||||
{abbreviateRASteps(first?.steps ?? second!.steps).map(
|
{abbreviateRASteps(first?.steps ?? second!.steps).map(
|
||||||
(step, index) => (
|
(step, index) => (
|
||||||
<PipelineStep
|
<PipelineStep
|
||||||
|
|||||||
Reference in New Issue
Block a user