diff --git a/extensions/ql-vscode/src/view/compare-performance/ComparePerformance.tsx b/extensions/ql-vscode/src/view/compare-performance/ComparePerformance.tsx index 0aaa7619a..1b89b26a4 100644 --- a/extensions/ql-vscode/src/view/compare-performance/ComparePerformance.tsx +++ b/extensions/ql-vscode/src/view/compare-performance/ComparePerformance.tsx @@ -1,5 +1,5 @@ import type { ChangeEvent } from "react"; -import { Fragment, useMemo, useRef, useState } from "react"; +import { Fragment, memo, useMemo, useRef, useState } from "react"; import type { SetPerformanceComparisonQueries, ToComparePerformanceViewMessage, @@ -577,15 +577,12 @@ function ComparePerformanceWithData(props: { - {rowGroups.map((rowGroup, rowGroupIndex) => ( - - ))} + @@ -606,6 +603,28 @@ function ComparePerformanceWithData(props: { ); } +interface PredicateTableProps { + rowGroups: RowGroup[]; + rowGroupNames: React.ReactNode[]; + comparison: boolean; + metric: Metric; +} + +function PredicateTableRaw(props: PredicateTableProps) { + const { comparison, metric, rowGroupNames, rowGroups } = props; + return rowGroups.map((rowGroup, rowGroupIndex) => ( + + )); +} + +const PredicateTable = memo(PredicateTableRaw); + interface PredicateRowGroupProps { renderedName: React.ReactNode; rowGroup: RowGroup;