Merge cockroachdb#113710

113710: ui: remove duplicates of metrics on tooltip r=maryliag a=maryliag Fix cockroachdb#113701 When a cluster had several nodes, the metrics were being duplicate for each node on the charts. This commits removes the duplicates, generating a single unique list of metrics. Before (cluster with 4 nodes) <img width="397" alt="Screenshot 2023-11-02 at 4 35 04 PM" src="https://github.com/cockroachdb/cockroach/assets/1017486/c1a7b5bd-5c7e-4954-8f49-f4f0d5c1dc9f"> After (cluster with 4 nodes) <img width="355" alt="Screenshot 2023-11-02 at 4 39 01 PM" src="https://github.com/cockroachdb/cockroach/assets/1017486/701f7d9d-655a-450b-a108-eef130023897"> Release note (bug fix): Remove duplication of metrics on chart's tooltips. Co-authored-by: maryliag <[email protected]>
herkolategan · Nov 3, 2023 · d41e3eb · d41e3eb
2 parents e287737 + 3e2cf6c
commit d41e3eb
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/pkg/ui/workspaces/db-console/src/views/cluster/components/linegraph/index.tsx b/pkg/ui/workspaces/db-console/src/views/cluster/components/linegraph/index.tsx
@@ -52,6 +52,7 @@ import { isSecondaryTenant } from "src/redux/tenants";
 import { Tooltip } from "antd";
 import "antd/lib/tooltip/style";
 import { MonitoringIcon } from "src/views/shared/components/icons/monitoring";
+import { unique } from "src/util/arrays";
 
 type TSResponse = protos.cockroach.ts.tspb.TimeSeriesQueryResponse;
 
@@ -402,14 +403,15 @@ export class InternalLineGraph extends React.Component<LineGraphProps, {}> {
           </>
         );
       } else if (data?.results?.length > 1) {
+        const metrics = unique(data.results.map(m => m.query.name));
         tt = (
           <>
             {tt}
             {addLines}
             Metrics:
             <ul>
-              {data.results.map(m => (
-                <li key={m.query.name}>{m.query.name}</li>
+              {metrics.map(m => (
+                <li key={m}>{m}</li>
               ))}
             </ul>
           </>