@parca/profile 0.19.55 → 0.19.56

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.19.56](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.55...@parca/profile@0.19.56) (2025-09-18)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.19.55](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.54...@parca/profile@0.19.55) (2025-09-16)
 
 **Note:** Version bump only for package @parca/profile

package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FlameGraphNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAErC,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAKnC,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAelD,eAAO,MAAM,SAAS,KAAK,CAAC;AAE5B,MAAM,WAAW,aAAa;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,oBAAoB,EAAE,MAAM,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,aAAa,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,eAAe;;;CAG3B,CAAC;AACF,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,eAAO,MAAM,SAAS,4CA8NrB,CAAC"}
+{"version":3,"file":"FlameGraphNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAErC,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAKnC,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAelD,eAAO,MAAM,SAAS,KAAK,CAAC;AAE5B,MAAM,WAAW,aAAa;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,oBAAoB,EAAE,MAAM,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,aAAa,CAAC;IAC7B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,eAAe;;;CAG3B,CAAC;AACF,eAAO,MAAM,oBAAoB;;;;CAIhC,CAAC;AAEF,eAAO,MAAM,SAAS,4CA6NrB,CAAC"}

package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.js

@@ -43,8 +43,8 @@ export const FlameNode = React.memo(function FlameNodeNoMemo({ table, row, color
     const binaries = useAppSelector(selectBinaries);
     const mappingFile = arrowToString(mappingColumn?.get(row));
     const functionName = arrowToString(functionNameColumn?.get(row));
-    const cumulative = cumulativeColumn?.get(row) !== null ? BigInt(cumulativeColumn?.get(row)) : 0n;
-    const diff = diffColumn?.get(row) !== null ? BigInt(diffColumn?.get(row)) : null;
+    const cumulative = cumulativeColumn?.get(row) != null ? BigInt(cumulativeColumn?.get(row)) : 0n;
+    const diff = diffColumn?.get(row) != null ? BigInt(diffColumn?.get(row)) : null;
     const filename = arrowToString(filenameColumn?.get(row));
     const depth = depthColumn?.get(row) ?? 0;
     const valueOffset = valueOffsetColumn?.get(row) !== null && valueOffsetColumn?.get(row) !== undefined

package/dist/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useVisibleNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAInC,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAiClD,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,QAAQ,EAAE,aAAa,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,eAAe,GAAI,iEAO7B,qBAAqB,KAAG,MAAM,EAsFhC,CAAC"}
+{"version":3,"file":"useVisibleNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAInC,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAiClD,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,QAAQ,EAAE,aAAa,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,eAAe,GAAI,iEAO7B,qBAAqB,KAAG,MAAM,EAwFhC,CAAC"}

package/dist/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.js

@@ -55,7 +55,7 @@ export const useVisibleNodes = ({ table, viewport, total, width, selectedRow, ef
     const lastResultRef = useRef({ key: '', result: [] });
     return useMemo(() => {
         // Create a stable key for memoization to prevent unnecessary recalculations
-        const memoKey = `${viewport.scrollTop}-${viewport.containerHeight}-${selectedRow}-${effectiveDepth}-${width}`;
+        const memoKey = `${viewport.scrollTop}-${viewport.containerHeight}-${selectedRow}-${effectiveDepth}-${width}-${Number(total)}-${table.numRows}`;
         // Return cached result if viewport hasn't meaningfully changed
         if (lastResultRef.current.key === memoKey) {
             return lastResultRef.current.result;
@@ -75,7 +75,7 @@ export const useVisibleNodes = ({ table, viewport, total, width, selectedRow, ef
             valueOffsetColumn?.get(selectedRow) !== undefined
             ? BigInt(valueOffsetColumn?.get(selectedRow))
             : 0n;
-        const selectionCumulative = cumulativeColumn?.get(selectedRow) !== null ? BigInt(cumulativeColumn?.get(selectedRow)) : 0n;
+        const selectionCumulative = cumulativeColumn?.get(selectedRow) != null ? BigInt(cumulativeColumn?.get(selectedRow)) : 0n;
         const totalNumber = Number(total);
         const selectionOffsetNumber = Number(selectionOffset);
         const selectionCumulativeNumber = Number(selectionCumulative);
@@ -87,7 +87,7 @@ export const useVisibleNodes = ({ table, viewport, total, width, selectedRow, ef
             }
             const rowsAtDepth = depthBuckets[depth];
             for (const row of rowsAtDepth) {
-                const cumulative = cumulativeColumn?.get(row) !== null ? Number(cumulativeColumn?.get(row)) : 0;
+                const cumulative = cumulativeColumn?.get(row) != null ? Number(cumulativeColumn?.get(row)) : 0;
                 const valueOffset = valueOffsetColumn?.get(row) !== null && valueOffsetColumn?.get(row) !== undefined
                     ? Number(valueOffsetColumn?.get(row))
                     : 0;

package/dist/ProfileView/components/InvertCallStack/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/InvertCallStack/index.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,eAAe,QAAO,GAAG,CAAC,OAkB/B,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/InvertCallStack/index.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,eAAe,QAAO,GAAG,CAAC,OAyB/B,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/ProfileView/components/InvertCallStack/index.js

@@ -13,9 +13,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // limitations under the License.
 import { Icon } from '@iconify/react';
 import { Button, useURLState } from '@parca/components';
+import { useResetFlameGraphState } from '../../hooks/useResetFlameGraphState';
 const InvertCallStack = () => {
     const [invertStack = '', setInvertStack] = useURLState('invert_call_stack');
     const isInvert = invertStack === 'true';
-    return (_jsxs("div", { className: "flex flex-col", children: [_jsx("label", { className: "text-sm", children: "\u00A0" }), _jsxs(Button, { variant: "neutral", className: "flex items-center gap-2 whitespace-nowrap", onClick: () => setInvertStack(isInvert ? '' : 'true'), id: "h-invert-call-stack", children: [_jsx(Icon, { icon: isInvert ? 'ph:sort-ascending' : 'ph:sort-descending', className: "h-4 w-4" }), isInvert ? 'Original' : 'Invert', " Call Stack"] })] }));
+    const resetFlameGraphState = useResetFlameGraphState();
+    const handleSetInvert = (value) => {
+        setInvertStack(value ? 'true' : '');
+        resetFlameGraphState();
+    };
+    return (_jsxs("div", { className: "flex flex-col", children: [_jsx("label", { className: "text-sm", children: "\u00A0" }), _jsxs(Button, { variant: "neutral", className: "flex items-center gap-2 whitespace-nowrap", onClick: () => handleSetInvert(!isInvert), id: "h-invert-call-stack", children: [_jsx(Icon, { icon: isInvert ? 'ph:sort-ascending' : 'ph:sort-descending', className: "h-4 w-4" }), isInvert ? 'Original' : 'Invert', " Call Stack"] })] }));
 };
 export default InvertCallStack;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.19.55",
+  "version": "0.19.56",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@floating-ui/react": "^0.27.12",
@@ -79,5 +79,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "345d9fd77a27f537e110fd04060ae55c7ebb9266"
+  "gitHead": "dbcf3191c529c532ac3d6a573c40678942ec80a7"
 }

package/src/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.tsx

@@ -116,9 +116,8 @@ export const FlameNode = React.memo(
 
     const mappingFile: string | null = arrowToString(mappingColumn?.get(row));
     const functionName: string | null = arrowToString(functionNameColumn?.get(row));
-    const cumulative =
-      cumulativeColumn?.get(row) !== null ? BigInt(cumulativeColumn?.get(row)) : 0n;
-    const diff: bigint | null = diffColumn?.get(row) !== null ? BigInt(diffColumn?.get(row)) : null;
+    const cumulative = cumulativeColumn?.get(row) != null ? BigInt(cumulativeColumn?.get(row)) : 0n;
+    const diff: bigint | null = diffColumn?.get(row) != null ? BigInt(diffColumn?.get(row)) : null;
     const filename: string | null = arrowToString(filenameColumn?.get(row));
     const depth: number = depthColumn?.get(row) ?? 0;
 

package/src/ProfileFlameGraph/FlameGraphArrow/useVisibleNodes.ts

@@ -87,7 +87,9 @@ export const useVisibleNodes = ({
 
   return useMemo(() => {
     // Create a stable key for memoization to prevent unnecessary recalculations
-    const memoKey = `${viewport.scrollTop}-${viewport.containerHeight}-${selectedRow}-${effectiveDepth}-${width}`;
+    const memoKey = `${viewport.scrollTop}-${
+      viewport.containerHeight
+    }-${selectedRow}-${effectiveDepth}-${width}-${Number(total)}-${table.numRows}`;
 
     // Return cached result if viewport hasn't meaningfully changed
     if (lastResultRef.current.key === memoKey) {
@@ -117,7 +119,7 @@ export const useVisibleNodes = ({
         ? BigInt(valueOffsetColumn?.get(selectedRow))
         : 0n;
     const selectionCumulative =
-      cumulativeColumn?.get(selectedRow) !== null ? BigInt(cumulativeColumn?.get(selectedRow)) : 0n;
+      cumulativeColumn?.get(selectedRow) != null ? BigInt(cumulativeColumn?.get(selectedRow)) : 0n;
 
     const totalNumber = Number(total);
     const selectionOffsetNumber = Number(selectionOffset);
@@ -134,7 +136,7 @@ export const useVisibleNodes = ({
 
       for (const row of rowsAtDepth) {
         const cumulative =
-          cumulativeColumn?.get(row) !== null ? Number(cumulativeColumn?.get(row)) : 0;
+          cumulativeColumn?.get(row) != null ? Number(cumulativeColumn?.get(row)) : 0;
 
         const valueOffset =
           valueOffsetColumn?.get(row) !== null && valueOffsetColumn?.get(row) !== undefined

package/src/ProfileView/components/InvertCallStack/index.tsx

@@ -15,9 +15,18 @@ import {Icon} from '@iconify/react';
 
 import {Button, useURLState} from '@parca/components';
 
+import {useResetFlameGraphState} from '../../hooks/useResetFlameGraphState';
+
 const InvertCallStack = (): JSX.Element => {
   const [invertStack = '', setInvertStack] = useURLState('invert_call_stack');
   const isInvert = invertStack === 'true';
+  const resetFlameGraphState = useResetFlameGraphState();
+
+  const handleSetInvert = (value: boolean): void => {
+    setInvertStack(value ? 'true' : '');
+
+    resetFlameGraphState();
+  };
 
   return (
     <div className="flex flex-col">
@@ -25,7 +34,7 @@ const InvertCallStack = (): JSX.Element => {
       <Button
         variant="neutral"
         className="flex items-center gap-2 whitespace-nowrap"
-        onClick={() => setInvertStack(isInvert ? '' : 'true')}
+        onClick={() => handleSetInvert(!isInvert)}
         id="h-invert-call-stack"
       >
         <Icon icon={isInvert ? 'ph:sort-ascending' : 'ph:sort-descending'} className="h-4 w-4" />