@parca/profile 0.16.123 → 0.16.124

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.124](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.123...@parca/profile@0.16.124) (2023-02-22)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.16.123](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.122...@parca/profile@0.16.123) (2023-02-22)
 
 **Note:** Version bump only for package @parca/profile

package/dist/MetricsGraph/MetricsTooltip/index.js

@@ -98,7 +98,7 @@ var MetricsTooltip = function (_a) {
     }, [x, y, contextElement, update]);
     var nameLabel = highlighted === null || highlighted === void 0 ? void 0 : highlighted.labels.find(function (e) { return e.name === '__name__'; });
     var highlightedNameLabel = nameLabel !== undefined ? nameLabel : { name: '', value: '' };
-    return (_jsx("div", __assign({ ref: setPopperElement, style: styles.popper }, attributes.popper, { className: "z-10" }, { children: _jsx("div", __assign({ className: "flex max-w-md" }, { children: _jsx("div", __assign({ className: "m-auto" }, { children: _jsx("div", __assign({ className: "border-gray-300 dark:border-gray-500 bg-gray-50 dark:bg-gray-900 rounded-lg p-3 shadow-lg opacity-90", style: { borderWidth: 1 } }, { children: _jsx("div", __assign({ className: "flex flex-row" }, { children: _jsxs("div", __assign({ className: "ml-2 mr-6" }, { children: [_jsx("span", __assign({ className: "font-semibold" }, { children: highlightedNameLabel.value })), _jsx("span", __assign({ className: "block text-gray-700 dark:text-gray-300 my-2" }, { children: _jsx("table", __assign({ className: "table-auto" }, { children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("td", __assign({ className: "w-1/4" }, { children: "Value" })), _jsx("td", __assign({ className: "w-3/4" }, { children: valueFormatter(highlighted.value, sampleUnit, 1) }))] }), _jsxs("tr", { children: [_jsx("td", __assign({ className: "w-1/4" }, { children: "At" })), _jsx("td", __assign({ className: "w-3/4" }, { children: formatDate(highlighted.timestamp, timeFormat) }))] })] }) })) })), _jsx("span", __assign({ className: "block text-gray-500 my-2" }, { children: highlighted.labels
+    return (_jsx("div", __assign({ ref: setPopperElement, style: styles.popper }, attributes.popper, { className: "z-10" }, { children: _jsx("div", __assign({ className: "flex max-w-md" }, { children: _jsx("div", __assign({ className: "m-auto" }, { children: _jsx("div", __assign({ className: "border-gray-300 dark:border-gray-500 bg-gray-50 dark:bg-gray-900 rounded-lg p-3 shadow-lg opacity-90", style: { borderWidth: 1 } }, { children: _jsx("div", __assign({ className: "flex flex-row" }, { children: _jsxs("div", __assign({ className: "ml-2 mr-6" }, { children: [_jsx("span", __assign({ className: "font-semibold" }, { children: highlightedNameLabel.value })), _jsx("span", __assign({ className: "block text-gray-700 dark:text-gray-300 my-2" }, { children: _jsx("table", __assign({ className: "table-auto" }, { children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("td", __assign({ className: "w-1/4" }, { children: "Value" })), _jsx("td", __assign({ className: "w-3/4" }, { children: valueFormatter(highlighted.valuePerSecond, sampleUnit, 5) }))] }), _jsxs("tr", { children: [_jsx("td", __assign({ className: "w-1/4" }, { children: "Total" })), _jsx("td", __assign({ className: "w-3/4" }, { children: valueFormatter(highlighted.value, sampleUnit, 2) }))] }), _jsxs("tr", { children: [_jsx("td", __assign({ className: "w-1/4" }, { children: "At" })), _jsx("td", __assign({ className: "w-3/4" }, { children: formatDate(highlighted.timestamp, timeFormat) }))] })] }) })) })), _jsx("span", __assign({ className: "block text-gray-500 my-2" }, { children: highlighted.labels
                                         .filter(function (label) { return label.name !== '__name__'; })
                                         .map(function (label) {
                                         return (_jsx("button", __assign({ type: "button", className: "inline-block rounded-lg text-gray-700 bg-gray-200 dark:bg-gray-700 dark:text-gray-400 px-2 py-1 text-xs font-bold mr-3", onClick: function () { return onLabelClick(label.name, label.value); } }, { children: _jsx(TextWithTooltip, { text: "".concat(label.name, "=\"").concat(label.value, "\""), maxTextLength: 37, id: "tooltip-".concat(label.name, "-").concat(label.value) }) }), label.name));

package/dist/MetricsGraph/index.d.ts

@@ -17,6 +17,7 @@ export interface HighlightedSeries {
     labels: Label[];
     timestamp: number;
     value: number;
+    valuePerSecond: number;
     x: number;
     y: number;
 }

package/dist/MetricsGraph/index.js

@@ -68,9 +68,9 @@ export var RawMetricsGraph = function (_a) {
             agg.push({
                 metric: s.labelset.labels,
                 values: s.samples.reduce(function (agg, d) {
-                    if (d.timestamp !== undefined && d.value !== undefined) {
+                    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
-                        agg.push([t, parseFloat(d.value)]);
+                        agg.push([t, d.valuePerSecond, parseFloat(d.value)]);
                     }
                     return agg;
                 }, []),
@@ -122,7 +122,8 @@ export var RawMetricsGraph = function (_a) {
             seriesIndex: closestSeriesIndex,
             labels: series[closestSeriesIndex].metric,
             timestamp: point[0],
-            value: point[1],
+            valuePerSecond: point[1],
+            value: point[2],
             x: xScale(point[0]),
             y: yScale(point[1]),
         };
@@ -228,7 +229,8 @@ export var RawMetricsGraph = function (_a) {
             labels: [],
             seriesIndex: seriesIndex,
             timestamp: sample[0],
-            value: sample[1],
+            valuePerSecond: sample[1],
+            value: sample[2],
             x: xScale(sample[0]),
             y: yScale(sample[1]),
         };

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@parca/profile",
-  "version": "0.16.123",
+  "version": "0.16.124",
   "description": "Profile viewing libraries",
   "dependencies": {
-    "@parca/client": "^0.16.63",
-    "@parca/components": "^0.16.102",
+    "@parca/client": "^0.16.64",
+    "@parca/components": "^0.16.103",
     "@parca/dynamicsize": "^0.16.53",
-    "@parca/functions": "^0.16.63",
+    "@parca/functions": "^0.16.64",
     "@parca/parser": "^0.16.54",
-    "@parca/store": "^0.16.59",
+    "@parca/store": "^0.16.60",
     "@types/react-beautiful-dnd": "^13.1.3",
     "d3": "7.8.2",
     "d3-scale": "^4.0.2",
@@ -45,5 +45,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "4b96b1698f421e95a0b6249943140020555936b1"
+  "gitHead": "bcca09575ec917fdd2669a0b32b7e3b7e3757117"
 }

package/src/MetricsGraph/MetricsTooltip/index.tsx

@@ -119,7 +119,13 @@ const MetricsTooltip = ({
                       <tr>
                         <td className="w-1/4">Value</td>
                         <td className="w-3/4">
-                          {valueFormatter(highlighted.value, sampleUnit, 1)}
+                          {valueFormatter(highlighted.valuePerSecond, sampleUnit, 5)}
+                        </td>
+                      </tr>
+                      <tr>
+                        <td className="w-1/4">Total</td>
+                        <td className="w-3/4">
+                          {valueFormatter(highlighted.value, sampleUnit, 2)}
                         </td>
                       </tr>
                       <tr>

package/src/MetricsGraph/index.tsx

@@ -49,6 +49,7 @@ export interface HighlightedSeries {
   labels: Label[];
   timestamp: number;
   value: number;
+  valuePerSecond: number;
   x: number;
   y: number;
 }
@@ -134,9 +135,9 @@ export const RawMetricsGraph = ({
       agg.push({
         metric: s.labelset.labels,
         values: s.samples.reduce<number[][]>(function (agg: number[][], d: MetricsSample) {
-          if (d.timestamp !== undefined && d.value !== undefined) {
+          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
-            agg.push([t, parseFloat(d.value)]);
+            agg.push([t, d.valuePerSecond, parseFloat(d.value)]);
           }
           return agg;
         }, []),
@@ -202,7 +203,8 @@ export const RawMetricsGraph = ({
       seriesIndex: closestSeriesIndex,
       labels: series[closestSeriesIndex].metric,
       timestamp: point[0],
-      value: point[1],
+      valuePerSecond: point[1],
+      value: point[2],
       x: xScale(point[0]),
       y: yScale(point[1]),
     };
@@ -325,7 +327,8 @@ export const RawMetricsGraph = ({
       labels: [],
       seriesIndex,
       timestamp: sample[0],
-      value: sample[1],
+      valuePerSecond: sample[1],
+      value: sample[2],
       x: xScale(sample[0]),
       y: yScale(sample[1]),
     };