@parca/profile 0.19.27 → 0.19.29

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.19.29](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.28...@parca/profile@0.19.29) (2025-07-22)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.19.28](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.27...@parca/profile@0.19.28) (2025-07-22)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.19.27](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.26...@parca/profile@0.19.27) (2025-07-21)
 
 **Note:** Version bump only for package @parca/profile

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ContextMenu.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAOnC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAO1C,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,kIAalB,gBAAgB,KAAG,GAAG,CAAC,OAiOzB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ContextMenu.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAOnC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAO1C,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,QAAA,MAAM,WAAW,GAAI,kIAalB,gBAAgB,KAAG,GAAG,CAAC,OAsOzB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenu.js

@@ -93,13 +93,16 @@ const ContextMenu = ({ menuId, table, total, totalUnfiltered, row, compareAbsolu
                         setDashboardItems([...dashboardItems, 'table']);
                     }
                 }, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "ph:table" }), _jsx("div", { children: "Show in table" })] }) }), enableSandwichView === true && (_jsx(Item, { id: "show-in-sandwich", onClick: () => {
+                    if (functionName === '' || functionName == null) {
+                        return;
+                    }
                     if (dashboardItems.includes('sandwich')) {
                         setSandwichFunctionName(functionName);
                         return;
                     }
                     setSandwichFunctionName(functionName);
                     setDashboardItems([...dashboardItems, 'sandwich']);
-                }, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "tdesign:sandwich-filled" }), _jsxs("div", { className: "relative", children: [dashboardItems.includes('sandwich')
+                }, disabled: functionName === '' || functionName == null, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "tdesign:sandwich-filled" }), _jsxs("div", { className: "relative", children: [dashboardItems.includes('sandwich')
                                     ? 'Focus sandwich on this frame.'
                                     : 'Show in sandwich', _jsx("span", { className: "absolute top-[-2px] text-xs lowercase text-red-500", children: "\u00A0alpha" })] })] }) })), _jsx(Item, { id: "reset-view", onClick: handleResetView, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "system-uicons:reset" }), _jsx("div", { children: "Reset graph" })] }) }), _jsxs(Item, { id: "hide-binary", onClick: () => hideBinary(getLastItem(mappingFile)), disabled: mappingFile === null || mappingFile === '', children: [_jsx("div", { "data-tooltip-id": "hide-binary-help", "data-tooltip-content": "Hide all frames for this binary", children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "bx:bxs-hide" }), _jsxs("div", { children: ["Hide binary ", mappingFile !== null && `(${getLastItem(mappingFile)})`] })] }) }), _jsx(Tooltip, { place: "left", id: "hide-binary-help" })] }), _jsx(Submenu, { label: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "ph:copy" }), _jsx("div", { children: "Copy" })] }), children: _jsx("div", { className: "max-h-[300px] overflow-scroll", children: nonEmptyValuesToCopy.map(({ id, value }) => (_jsx(Item, { id: id, onClick: () => handleCopyItem(value), className: "dark:bg-gray-800", children: _jsxs("div", { className: "flex flex-col dark:text-gray-300 hover:dark:text-gray-100", children: [_jsx("div", { className: "text-sm", children: id }), _jsx("div", { className: "text-xs", children: truncateString(value, 30) })] }) }, id))) }) }), checkDebuginfoStatusHandler !== undefined ? (_jsx(Item, { id: "check-debuginfo-status", onClick: () => checkDebuginfoStatusHandler(mappingBuildID), disabled: !isMappingBuildIDAvailable, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "bx:bx-info-circle" }), _jsx("div", { className: "relative pr-4", children: "Check debuginfo status" })] }) })) : null, _jsx(Separator, {}), _jsx(Item, { id: "dock-tooltip", onClick: handleDockTooltip, children: _jsxs("div", { className: "flex w-full items-center gap-2", children: [_jsx(Icon, { icon: "bx:dock-bottom" }), isGraphTooltipDocked ? 'Undock tooltip' : 'Dock tooltip'] }) })] }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuWrapper.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAEnC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAI1C,UAAU,uBAAuB;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,eAAe,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CACtD;AAED,QAAA,MAAM,kBAAkB,2HAkBvB,CAAC;AAIF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ContextMenuWrapper.d.ts","sourceRoot":"","sources":["../../../src/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAEnC,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAI1C,UAAU,uBAAuB;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,eAAe,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,cAAc,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,IAAI,KAAK,IAAI,CAAC;CACtD;AAED,QAAA,MAAM,kBAAkB,2HAwBvB,CAAC;AAIF,eAAe,kBAAkB,CAAC"}

package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.js

@@ -14,19 +14,24 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useImperativeHandle, useState } from 'react';
 import ContextMenu from './ContextMenu';
 const ContextMenuWrapper = forwardRef((props, ref) => {
-    // Fix for race condition: Always render ContextMenu to maintain component tree stability
-    // but use callback timing to ensure correct data is available when menu shows
-    const [row, setRow] = useState(0);
+    // Initialize with null to prevent rendering with invalid data
+    const [row, setRow] = useState(null);
     useImperativeHandle(ref, () => ({
         setRow: (newRow, callback) => {
             setRow(newRow);
             // Execute callback after state update using requestAnimationFrame
             if (callback != null) {
-                requestAnimationFrame(callback);
+                requestAnimationFrame(() => {
+                    requestAnimationFrame(callback);
+                });
             }
         },
     }));
-    return _jsx(ContextMenu, { ...props, row: row });
+    // Only render ContextMenu when we have a valid row
+    if (row === null) {
+        return null;
+    }
+    return _jsx(ContextMenu, { ...props, row: row, isSandwich: props.isInSandwichView });
 });
 ContextMenuWrapper.displayName = 'ContextMenuWrapper';
 export default ContextMenuWrapper;

package/dist/ProfileView/components/ProfileFilters/useProfileFilters.js

@@ -114,7 +114,7 @@ export const convertToProtoFilters = (profileFilters) => {
 };
 export const useProfileFilters = () => {
     const { appliedFilters, setAppliedFilters } = useProfileFiltersUrlState();
-    const [localFilters, setLocalFilters] = useState([]);
+    const [localFilters, setLocalFilters] = useState(appliedFilters ?? []);
     const lastAppliedFiltersRef = useRef([]);
     const localFiltersRef = useRef(localFilters);
     localFiltersRef.current = localFilters;
@@ -238,7 +238,7 @@ export const useProfileFilters = () => {
     }, [appliedFilters]);
     return {
         localFilters,
-        appliedFilters,
+        appliedFilters: appliedFilters ?? [],
         protoFilters,
         hasUnsavedChanges,
         onApplyFilters,

package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useProfileFiltersUrlState.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.ts"],"names":[],"mappings":"AAaA,OAAO,EAAoB,KAAK,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AAGjF,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAsDvD,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,KAAG,aAAa,EAkCnE,CAAC;AAEF,eAAO,MAAM,yBAAyB,QAAO;IAC3C,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,EAAE,sBAAsB,CAAC,aAAa,EAAE,CAAC,CAAC;CAmB5D,CAAC"}
+{"version":3,"file":"useProfileFiltersUrlState.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.ts"],"names":[],"mappings":"AAaA,OAAO,EAAoB,KAAK,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AAIjF,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAsDvD,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,KAAG,aAAa,EAuCnE,CAAC;AAEF,eAAO,MAAM,yBAAyB,QAAO;IAC3C,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,EAAE,sBAAsB,CAAC,aAAa,EAAE,CAAC,CAAC;CAoB5D,CAAC"}

package/dist/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.js

@@ -11,6 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useURLStateCustom } from '@parca/components';
+import { decodeMultipleEncodings } from '@parca/utilities';
 import { isPresetKey } from './filterPresets';
 // Compact encoding mappings
 const TYPE_MAP = {
@@ -62,12 +63,14 @@ export const decodeProfileFilters = (encoded) => {
     if (encoded === '' || encoded === undefined)
         return [];
     try {
-        return encoded.split(',').map((filter, index) => {
+        // Handle multiple levels of URL encoding
+        const decodedString = decodeMultipleEncodings(encoded) ?? encoded;
+        return decodedString.split(',').map((filter, index) => {
             const parts = filter.split(':');
             // Handle preset filters (format: p:presetKey:value)
             if (parts[0] === 'p' && parts.length >= 3) {
-                const presetKey = decodeURIComponent(parts[1]);
-                const value = decodeURIComponent(parts.slice(2).join(':')); // Handle values with colons
+                const presetKey = parts[1];
+                const value = parts.slice(2).join(':'); // Handle values with colons
                 return {
                     id: `filter-${Date.now()}-${index}`,
                     type: presetKey,
@@ -76,14 +79,15 @@ export const decodeProfileFilters = (encoded) => {
             }
             // Handle regular filters (format: type:field:match:value)
             const [type, field, match, ...valueParts] = parts;
-            const value = decodeURIComponent(valueParts.join(':')); // Handle values with colons
-            return {
+            const value = valueParts.join(':'); // Handle values with colons
+            const decodedFilter = {
                 id: `filter-${Date.now()}-${index}`,
                 type: TYPE_MAP_REVERSE[type],
                 field: FIELD_MAP_REVERSE[field],
                 matchType: MATCH_MAP_REVERSE[match],
                 value,
             };
+            return decodedFilter;
         });
     }
     catch {
@@ -99,9 +103,10 @@ export const useProfileFiltersUrlState = () => {
         stringify: value => {
             return encodeProfileFilters(value);
         },
+        defaultValue: [],
     });
     return {
-        appliedFilters,
+        appliedFilters: appliedFilters ?? [],
         setAppliedFilters,
     };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.19.27",
+  "version": "0.19.29",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@floating-ui/react": "^0.27.12",
@@ -78,5 +78,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "094674503d73496bf7c2621d04c1e6d087e88f05"
+  "gitHead": "3695a715bae0531c5654c99a604fd9f1a66a80aa"
 }

package/src/ProfileFlameGraph/FlameGraphArrow/ContextMenu.tsx

@@ -188,6 +188,10 @@ const ContextMenu = ({
         <Item
           id="show-in-sandwich"
           onClick={() => {
+            if (functionName === '' || functionName == null) {
+              return;
+            }
+
             if (dashboardItems.includes('sandwich')) {
               setSandwichFunctionName(functionName);
               return;
@@ -196,6 +200,7 @@ const ContextMenu = ({
             setSandwichFunctionName(functionName);
             setDashboardItems([...dashboardItems, 'sandwich']);
           }}
+          disabled={functionName === '' || functionName == null}
         >
           <div className="flex w-full items-center gap-2">
             <Icon icon="tdesign:sandwich-filled" />

package/src/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.tsx

@@ -39,21 +39,27 @@ export interface ContextMenuWrapperRef {
 
 const ContextMenuWrapper = forwardRef<ContextMenuWrapperRef, ContextMenuWrapperProps>(
   (props, ref) => {
-    // Fix for race condition: Always render ContextMenu to maintain component tree stability
-    // but use callback timing to ensure correct data is available when menu shows
-    const [row, setRow] = useState(0);
+    // Initialize with null to prevent rendering with invalid data
+    const [row, setRow] = useState<number | null>(null);
 
     useImperativeHandle(ref, () => ({
       setRow: (newRow: number, callback?: () => void) => {
         setRow(newRow);
         // Execute callback after state update using requestAnimationFrame
         if (callback != null) {
-          requestAnimationFrame(callback);
+          requestAnimationFrame(() => {
+            requestAnimationFrame(callback);
+          });
         }
       },
     }));
 
-    return <ContextMenu {...props} row={row} />;
+    // Only render ContextMenu when we have a valid row
+    if (row === null) {
+      return null;
+    }
+
+    return <ContextMenu {...props} row={row} isSandwich={props.isInSandwichView} />;
   }
 );
 

package/src/ProfileView/components/ProfileFilters/useProfileFilters.ts

@@ -145,7 +145,7 @@ export const useProfileFilters = (): {
 } => {
   const {appliedFilters, setAppliedFilters} = useProfileFiltersUrlState();
 
-  const [localFilters, setLocalFilters] = useState<ProfileFilter[]>([]);
+  const [localFilters, setLocalFilters] = useState<ProfileFilter[]>(appliedFilters ?? []);
 
   const lastAppliedFiltersRef = useRef<ProfileFilter[]>([]);
 
@@ -312,7 +312,7 @@ export const useProfileFilters = (): {
 
   return {
     localFilters,
-    appliedFilters,
+    appliedFilters: appliedFilters ?? [],
     protoFilters,
     hasUnsavedChanges,
     onApplyFilters,

package/src/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.ts

@@ -12,6 +12,7 @@
 // limitations under the License.
 
 import {useURLStateCustom, type ParamValueSetterCustom} from '@parca/components';
+import {decodeMultipleEncodings} from '@parca/utilities';
 
 import {isPresetKey} from './filterPresets';
 import {type ProfileFilter} from './useProfileFilters';
@@ -72,13 +73,16 @@ export const decodeProfileFilters = (encoded: string): ProfileFilter[] => {
   if (encoded === '' || encoded === undefined) return [];
 
   try {
-    return encoded.split(',').map((filter, index) => {
+    // Handle multiple levels of URL encoding
+    const decodedString = decodeMultipleEncodings(encoded) ?? encoded;
+
+    return decodedString.split(',').map((filter, index) => {
       const parts = filter.split(':');
 
       // Handle preset filters (format: p:presetKey:value)
       if (parts[0] === 'p' && parts.length >= 3) {
-        const presetKey = decodeURIComponent(parts[1]);
-        const value = decodeURIComponent(parts.slice(2).join(':')); // Handle values with colons
+        const presetKey = parts[1];
+        const value = parts.slice(2).join(':'); // Handle values with colons
 
         return {
           id: `filter-${Date.now()}-${index}`,
@@ -89,15 +93,17 @@ export const decodeProfileFilters = (encoded: string): ProfileFilter[] => {
 
       // Handle regular filters (format: type:field:match:value)
       const [type, field, match, ...valueParts] = parts;
-      const value = decodeURIComponent(valueParts.join(':')); // Handle values with colons
+      const value = valueParts.join(':'); // Handle values with colons
 
-      return {
+      const decodedFilter = {
         id: `filter-${Date.now()}-${index}`,
         type: TYPE_MAP_REVERSE[type] as ProfileFilter['type'],
         field: FIELD_MAP_REVERSE[field] as ProfileFilter['field'],
         matchType: MATCH_MAP_REVERSE[match] as ProfileFilter['matchType'],
         value,
       };
+
+      return decodedFilter;
     });
   } catch {
     return [];
@@ -118,11 +124,12 @@ export const useProfileFiltersUrlState = (): {
       stringify: value => {
         return encodeProfileFilters(value);
       },
+      defaultValue: [],
     }
   );
 
   return {
-    appliedFilters,
+    appliedFilters: appliedFilters ?? [],
     setAppliedFilters,
   };
 };