@parca/profile 0.16.148 → 0.16.149

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.16.149 (2023-03-23)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.16.148](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.147...@parca/profile@0.16.148) (2023-03-22)
 
 **Note:** Version bump only for package @parca/profile

package/dist/MetricsGraph/index.js

@@ -65,8 +65,9 @@ export var RawMetricsGraph = function (_a) {
     var marginRight = 20;
     var series = data.reduce(function (agg, s) {
         if (s.labelset !== undefined) {
+            var metric = s.labelset.labels.sort(function (a, b) { return a.name.localeCompare(b.name); });
             agg.push({
-                metric: s.labelset.labels,
+                metric: metric,
                 values: s.samples.reduce(function (agg, d) {
                     if (d.timestamp !== undefined && d.valuePerSecond !== undefined) {
                         var t = (+d.timestamp.seconds * 1e9 + d.timestamp.nanos) / 1e6; // https://github.com/microsoft/TypeScript/issues/5710#issuecomment-157886246
@@ -74,10 +75,13 @@ export var RawMetricsGraph = function (_a) {
                     }
                     return agg;
                 }, []),
+                labelset: metric.map(function (m) { return "".concat(m.name, "=").concat(m.value); }).join(','),
             });
         }
         return agg;
     }, []);
+    // Sort series by id to make sure the colors are consistent
+    series.sort(function (a, b) { return a.labelset.localeCompare(b.labelset); });
     var extentsY = series.map(function (s) {
         return d3.extent(s.values, function (d) {
             return d[1];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.16.148",
+  "version": "0.16.149",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@parca/client": "^0.16.69",
@@ -46,5 +46,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "a106fbc3fd024c484e659aa45e35aca5d6eacffe"
+  "gitHead": "ac30ab34fee416cb627972a15013e56b31320a8b"
 }

package/src/MetricsGraph/index.tsx

@@ -58,6 +58,7 @@ export interface HighlightedSeries {
 interface Series {
   metric: Label[];
   values: number[][];
+  labelset: string;
 }
 
 const MetricsGraph = ({
@@ -133,8 +134,9 @@ export const RawMetricsGraph = ({
 
   const series: Series[] = data.reduce<Series[]>(function (agg: Series[], s: MetricsSeriesPb) {
     if (s.labelset !== undefined) {
+      const metric = s.labelset.labels.sort((a, b) => a.name.localeCompare(b.name));
       agg.push({
-        metric: s.labelset.labels,
+        metric,
         values: s.samples.reduce<number[][]>(function (agg: number[][], d: MetricsSample) {
           if (d.timestamp !== undefined && d.valuePerSecond !== undefined) {
             const t = (+d.timestamp.seconds * 1e9 + d.timestamp.nanos) / 1e6; // https://github.com/microsoft/TypeScript/issues/5710#issuecomment-157886246
@@ -142,11 +144,15 @@ export const RawMetricsGraph = ({
           }
           return agg;
         }, []),
+        labelset: metric.map(m => `${m.name}=${m.value}`).join(','),
       });
     }
     return agg;
   }, []);
 
+  // Sort series by id to make sure the colors are consistent
+  series.sort((a, b) => a.labelset.localeCompare(b.labelset));
+
   const extentsY = series.map(function (s) {
     return d3.extent(s.values, function (d) {
       return d[1];