@parca/profile 0.19.52 → 0.19.53

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.19.53](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.52...@parca/profile@0.19.53) (2025-09-15)
+
+## 0.24.2 (2025-09-10)
+
+**Note:** Version bump only for package @parca/profile
+
 ## 0.19.52 (2025-09-15)
 
 ## 0.24.2 (2025-09-10)

package/dist/ProfileExplorer/index.js

@@ -19,7 +19,7 @@ import { createStore } from '@parca/store';
 import { capitalizeOnlyFirstLetter, safeDecode } from '@parca/utilities';
 import { ProfileSelectionFromParams, SuffixParams } from '..';
 import { useProfileTypes } from '../ProfileSelector';
-import { useResetStateOnNewSearch } from '../ProfileView/hooks/useResetStateOnNewSearch';
+import { useResetFlameGraphState } from '../ProfileView/hooks/useResetFlameGraphState';
 import { useResetStateOnProfileTypeChange } from '../ProfileView/hooks/useResetStateOnProfileTypeChange';
 import { sumByToParam, useSumByFromParams } from '../useSumBy';
 import ProfileExplorerCompare from './ProfileExplorerCompare';
@@ -89,7 +89,7 @@ const ProfileExplorerApp = ({ queryClient, queryParams, navigateTo, }) => {
     const [profileA, setProfileA] = useState(null);
     const [profileB, setProfileB] = useState(null);
     const resetStateOnProfileTypeChange = useResetStateOnProfileTypeChange();
-    const resetStateOnNewSearch = useResetStateOnNewSearch();
+    const resetFlameGraphState = useResetFlameGraphState();
     const sumByA = useSumByFromParams(sum_by_a);
     const sumByB = useSumByFromParams(sum_by_b);
     useEffect(() => {
@@ -156,7 +156,7 @@ const ProfileExplorerApp = ({ queryClient, queryParams, navigateTo, }) => {
                 }
                 else {
                     // Reset the state when a new search is performed.
-                    resetStateOnNewSearch();
+                    resetFlameGraphState();
                 }
             }
             const mergeParams = q.mergeFrom !== undefined && q.mergeTo !== undefined

package/dist/ProfileView/components/DashboardItems/index.d.ts

@@ -15,8 +15,6 @@ interface GetDashboardItemProps {
     profileSource: ProfileSource;
     total: bigint;
     filtered: bigint;
-    curPath: string[];
-    setNewCurPath: (path: string[]) => void;
     curPathArrow: CurrentPathFrame[];
     setNewCurPathArrow: (path: CurrentPathFrame[]) => void;
     perf?: {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAIrD,OAAO,KAAK,EACV,cAAc,EACd,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,iBAAiB,EAClB,MAAM,2BAA2B,CAAC;AAEnC,UAAU,qBAAqB;IAC7B,IAAI,EAAE,iBAAiB,CAAC;IACxB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,cAAc,EAAE,cAAc,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,kBAAkB,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACvD,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC;AAED,eAAO,MAAM,gBAAgB,GAAI,qLAe9B,qBAAqB,KAAG,GAAG,CAAC,OA+F9B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAIrD,OAAO,KAAK,EACV,cAAc,EACd,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,iBAAiB,EAClB,MAAM,2BAA2B,CAAC;AAEnC,UAAU,qBAAqB;IAC7B,IAAI,EAAE,iBAAiB,CAAC;IACxB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,cAAc,EAAE,cAAc,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,kBAAkB,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACvD,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC;AAED,eAAO,MAAM,gBAAgB,GAAI,qLAe9B,qBAAqB,KAAG,GAAG,CAAC,OA+F9B,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"useProfileFilters.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/useProfileFilters.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,MAAM,EAA6C,MAAM,eAAe,CAAC;AAKtF,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,UAAU,GAAG,SAAS,GAAG,aAAa,CAAC;IAC5F,SAAS,CAAC,EAAE,OAAO,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;CACf;AAqBD,eAAO,MAAM,uBAAuB,GAAI,cAAc,MAAM,EAAE,KAAG,aAAa,EA+E7E,CAAC;AAGF,eAAO,MAAM,qBAAqB,GAAI,gBAAgB,aAAa,EAAE,KAAG,MAAM,EAmF7E,CAAC;AAEF,eAAO,MAAM,iBAAiB,QAAO;IACnC,YAAY,EAAE,aAAa,EAAE,CAAC;IAC9B,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,mBAAmB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACpE,YAAY,EAAE,MAAM,IAAI,CAAC;CAsL1B,CAAC"}
+{"version":3,"file":"useProfileFilters.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/useProfileFilters.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,MAAM,EAA6C,MAAM,eAAe,CAAC;AAMtF,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,eAAe,GAAG,QAAQ,GAAG,aAAa,GAAG,UAAU,GAAG,SAAS,GAAG,aAAa,CAAC;IAC5F,SAAS,CAAC,EAAE,OAAO,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;CACf;AAqBD,eAAO,MAAM,uBAAuB,GAAI,cAAc,MAAM,EAAE,KAAG,aAAa,EA+E7E,CAAC;AAGF,eAAO,MAAM,qBAAqB,GAAI,gBAAgB,aAAa,EAAE,KAAG,MAAM,EAmF7E,CAAC;AAEF,eAAO,MAAM,iBAAiB,QAAO;IACnC,YAAY,EAAE,aAAa,EAAE,CAAC;IAC9B,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,mBAAmB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IACpE,YAAY,EAAE,MAAM,IAAI,CAAC;CA2L1B,CAAC"}

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

@@ -11,6 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useResetFlameGraphState } from '../../hooks/useResetFlameGraphState';
 import { getPresetByKey, isPresetKey } from './filterPresets';
 import { useProfileFiltersUrlState } from './useProfileFiltersUrlState';
 const createStringCondition = (matchType, value) => ({
@@ -182,6 +183,7 @@ export const convertToProtoFilters = (profileFilters) => {
 };
 export const useProfileFilters = () => {
     const { appliedFilters, setAppliedFilters } = useProfileFiltersUrlState();
+    const resetFlameGraphState = useResetFlameGraphState();
     const [localFilters, setLocalFilters] = useState(appliedFilters ?? []);
     const lastAppliedFiltersRef = useRef([]);
     const localFiltersRef = useRef(localFilters);
@@ -259,9 +261,10 @@ export const useProfileFilters = () => {
         // Auto-apply the filter since it has a value
         const filtersToApply = [...(appliedFilters ?? []), newFilter];
         setAppliedFilters(filtersToApply);
+        resetFlameGraphState();
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [setAppliedFilters]);
+    [setAppliedFilters, resetFlameGraphState]);
     const removeExcludeBinary = useCallback((binaryName) => {
         // Search for the exclude filter (not_contains) for this binary
         const filterToRemove = (appliedFilters ?? []).find(f => f.type === 'frame' &&
@@ -272,10 +275,11 @@ export const useProfileFilters = () => {
             // Remove the filter from applied filters
             const updatedAppliedFilters = (appliedFilters ?? []).filter(f => f.id !== filterToRemove.id);
             setAppliedFilters(updatedAppliedFilters);
+            resetFlameGraphState();
             // Also remove from local filters
             setLocalFilters(localFiltersRef.current.filter(f => f.id !== filterToRemove.id));
         }
-    }, [appliedFilters, setAppliedFilters]);
+    }, [appliedFilters, setAppliedFilters, resetFlameGraphState]);
     const removeFilter = useCallback((id) => {
         setLocalFilters(localFiltersRef.current.filter(f => f.id !== id));
     }, []);
@@ -285,7 +289,8 @@ export const useProfileFilters = () => {
     const resetFilters = useCallback(() => {
         setLocalFilters([]);
         setAppliedFilters([]);
-    }, [setAppliedFilters]);
+        resetFlameGraphState();
+    }, [setAppliedFilters, resetFlameGraphState]);
     const onApplyFilters = useCallback(() => {
         const validFilters = localFiltersRef.current.filter(f => {
             // For preset filters, only need type and value
@@ -300,7 +305,8 @@ export const useProfileFilters = () => {
             id: `filter-${Date.now()}-${index}`,
         }));
         setAppliedFilters(filtersToApply);
-    }, [setAppliedFilters]);
+        resetFlameGraphState();
+    }, [setAppliedFilters, resetFlameGraphState]);
     const protoFilters = useMemo(() => {
         return convertToProtoFilters(appliedFilters ?? []);
     }, [appliedFilters]);

package/dist/ProfileView/hooks/useResetFlameGraphState.d.ts

@@ -0,0 +1,2 @@
+export declare const useResetFlameGraphState: () => (() => void);
+//# sourceMappingURL=useResetFlameGraphState.d.ts.map

package/dist/ProfileView/hooks/useResetFlameGraphState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResetFlameGraphState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetFlameGraphState.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,uBAAuB,QAAO,CAAC,MAAM,IAAI,CAWrD,CAAC"}

package/dist/ProfileView/hooks/{useResetStateOnNewSearch.js → useResetFlameGraphState.js}

@@ -11,7 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useURLState } from '@parca/components';
-export const useResetStateOnNewSearch = () => {
+export const useResetFlameGraphState = () => {
     const [val, setCurPath] = useURLState('cur_path');
     return () => {
         setTimeout(() => {

package/dist/ProfileView/hooks/useVisualizationState.d.ts

@@ -1,7 +1,5 @@
 import { CurrentPathFrame } from '../../ProfileFlameGraph/FlameGraphArrow/utils';
 export declare const useVisualizationState: () => {
-    curPath: string[];
-    setCurPath: (path: string[]) => void;
     curPathArrow: CurrentPathFrame[];
     setCurPathArrow: (path: CurrentPathFrame[]) => void;
     colorStackLegend: string | undefined;

package/dist/ProfileView/hooks/useVisualizationState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useVisualizationState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useVisualizationState.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAC,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AAE/E,eAAO,MAAM,qBAAqB,QAAO;IACvC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5E,yBAAyB,EAAE,MAAM,IAAI,CAAC;CA0EvC,CAAC"}
+{"version":3,"file":"useVisualizationState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useVisualizationState.ts"],"names":[],"mappings":"AAwBA,OAAO,EAAC,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AAG/E,eAAO,MAAM,qBAAqB,QAAO;IACvC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5E,yBAAyB,EAAE,MAAM,IAAI,CAAC;CA0EvC,CAAC"}

package/dist/ProfileView/hooks/useVisualizationState.js

@@ -10,11 +10,11 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useMemo } from 'react';
 import { JSONParser, JSONSerializer, useURLState, useURLStateCustom } from '@parca/components';
 import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LABELS, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from '../../ProfileFlameGraph/FlameGraphArrow';
+import { useResetFlameGraphState } from './useResetFlameGraphState';
 export const useVisualizationState = () => {
-    const [curPath, setCurPath] = useState([]);
     const [curPathArrow, setCurPathArrow] = useURLStateCustom('cur_path', {
         parse: (JSONParser),
         stringify: JSONSerializer,
@@ -27,6 +27,7 @@ export const useVisualizationState = () => {
         alwaysReturnArray: true,
     });
     const [sandwichFunctionName, setSandwichFunctionName] = useURLState('sandwich_function_name');
+    const resetFlameGraphState = useResetFlameGraphState();
     const levelsOfProfiling = useMemo(() => [
         FIELD_FUNCTION_NAME,
         FIELD_FUNCTION_FILE_NAME,
@@ -44,7 +45,8 @@ export const useVisualizationState = () => {
             const filteredGroupBy = groupBy.filter(item => !levelsOfProfiling.includes(item));
             setGroupBy([...filteredGroupBy, key]); // add
         }
-    }, [groupBy, setGroupBy, levelsOfProfiling]);
+        resetFlameGraphState();
+    }, [groupBy, setGroupBy, levelsOfProfiling, resetFlameGraphState]);
     const setGroupByLabels = useCallback((labels) => {
         setGroupBy(groupBy.filter(l => !l.startsWith(`${FIELD_LABELS}.`)).concat(labels));
     }, [groupBy, setGroupBy]);
@@ -52,8 +54,6 @@ export const useVisualizationState = () => {
         setSandwichFunctionName(undefined);
     }, [setSandwichFunctionName]);
     return {
-        curPath,
-        setCurPath,
         curPathArrow,
         setCurPathArrow,
         colorStackLegend,

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAE/E,eAAO,MAAM,WAAW,GAAI,iMAczB,gBAAgB,KAAG,GAAG,CAAC,OA+HzB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAE/E,eAAO,MAAM,WAAW,GAAI,iMAczB,gBAAgB,KAAG,GAAG,CAAC,OA2HzB,CAAC"}

package/dist/ProfileView/index.js

@@ -26,7 +26,7 @@ import { useVisualizationState } from './hooks/useVisualizationState';
 export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, }) => {
     const { timezone, perf, profileViewExternalMainActions, preferencesModal, profileViewExternalSubActions, } = useParcaContext();
     const { ref, dimensions } = useContainerDimensions();
-    const { curPath, setCurPath, curPathArrow, setCurPathArrow, colorStackLegend, colorBy, groupBy, toggleGroupBy, setGroupByLabels, sandwichFunctionName, resetSandwichFunctionName, } = useVisualizationState();
+    const { curPathArrow, setCurPathArrow, colorStackLegend, colorBy, groupBy, toggleGroupBy, setGroupByLabels, sandwichFunctionName, resetSandwichFunctionName, } = useVisualizationState();
     const { colorMappings } = useProfileMetadata({
         flamegraphArrow: flamegraphData.arrow,
         metadataMappingFiles: flamegraphData.metadataMappingFiles,
@@ -49,8 +49,6 @@ export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, t
             profileSource,
             total,
             filtered,
-            curPath,
-            setNewCurPath: setCurPath,
             curPathArrow,
             setNewCurPathArrow: setCurPathArrow,
             perf,

package/dist/ProfileViewWithData.js

@@ -39,7 +39,7 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
     const { protoFilters } = useProfileFilters();
     useEffect(() => {
         // If profile type is not delta, remove flamechart from the dashboard items
-        // and set it to flame if no other items are selected.
+        // and set it to flame graph if no other items are selected.
         if (profileSource == null) {
             return;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.19.52",
+  "version": "0.19.53",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@floating-ui/react": "^0.27.12",
@@ -79,5 +79,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "df1f4ce1710f808dfc6af0a631b140cd346dfaab"
+  "gitHead": "364f74584252524568010bb27636fdb87fe7aee7"
 }

package/src/ProfileExplorer/index.tsx

@@ -23,7 +23,7 @@ import {capitalizeOnlyFirstLetter, safeDecode, type NavigateFunction} from '@par
 
 import {ProfileSelection, ProfileSelectionFromParams, SuffixParams} from '..';
 import {QuerySelection, useProfileTypes} from '../ProfileSelector';
-import {useResetStateOnNewSearch} from '../ProfileView/hooks/useResetStateOnNewSearch';
+import {useResetFlameGraphState} from '../ProfileView/hooks/useResetFlameGraphState';
 import {useResetStateOnProfileTypeChange} from '../ProfileView/hooks/useResetStateOnProfileTypeChange';
 import {sumByToParam, useSumByFromParams} from '../useSumBy';
 import ProfileExplorerCompare from './ProfileExplorerCompare';
@@ -162,7 +162,7 @@ const ProfileExplorerApp = ({
   const [profileB, setProfileB] = useState<ProfileSelection | null>(null);
 
   const resetStateOnProfileTypeChange = useResetStateOnProfileTypeChange();
-  const resetStateOnNewSearch = useResetStateOnNewSearch();
+  const resetFlameGraphState = useResetFlameGraphState();
 
   const sumByA = useSumByFromParams(sum_by_a);
   const sumByB = useSumByFromParams(sum_by_b);
@@ -250,7 +250,7 @@ const ProfileExplorerApp = ({
           resetStateOnProfileTypeChange();
         } else {
           // Reset the state when a new search is performed.
-          resetStateOnNewSearch();
+          resetFlameGraphState();
         }
       }
 

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

@@ -42,8 +42,6 @@ interface GetDashboardItemProps {
   profileSource: ProfileSource;
   total: bigint;
   filtered: bigint;
-  curPath: string[];
-  setNewCurPath: (path: string[]) => void;
   curPathArrow: CurrentPathFrame[];
   setNewCurPathArrow: (path: CurrentPathFrame[]) => void;
   perf?: {

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

@@ -15,6 +15,7 @@ import {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 
 import {type Filter, type NumberCondition, type StringCondition} from '@parca/client';
 
+import {useResetFlameGraphState} from '../../hooks/useResetFlameGraphState';
 import {getPresetByKey, isPresetKey} from './filterPresets';
 import {useProfileFiltersUrlState} from './useProfileFiltersUrlState';
 
@@ -226,6 +227,7 @@ export const useProfileFilters = (): {
   resetFilters: () => void;
 } => {
   const {appliedFilters, setAppliedFilters} = useProfileFiltersUrlState();
+  const resetFlameGraphState = useResetFlameGraphState();
 
   const [localFilters, setLocalFilters] = useState<ProfileFilter[]>(appliedFilters ?? []);
 
@@ -327,9 +329,10 @@ export const useProfileFilters = (): {
       // Auto-apply the filter since it has a value
       const filtersToApply = [...(appliedFilters ?? []), newFilter];
       setAppliedFilters(filtersToApply);
+      resetFlameGraphState();
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [setAppliedFilters]
+    [setAppliedFilters, resetFlameGraphState]
   );
 
   const removeExcludeBinary = useCallback(
@@ -349,12 +352,13 @@ export const useProfileFilters = (): {
           f => f.id !== filterToRemove.id
         );
         setAppliedFilters(updatedAppliedFilters);
+        resetFlameGraphState();
 
         // Also remove from local filters
         setLocalFilters(localFiltersRef.current.filter(f => f.id !== filterToRemove.id));
       }
     },
-    [appliedFilters, setAppliedFilters]
+    [appliedFilters, setAppliedFilters, resetFlameGraphState]
   );
 
   const removeFilter = useCallback((id: string) => {
@@ -368,7 +372,8 @@ export const useProfileFilters = (): {
   const resetFilters = useCallback(() => {
     setLocalFilters([]);
     setAppliedFilters([]);
-  }, [setAppliedFilters]);
+    resetFlameGraphState();
+  }, [setAppliedFilters, resetFlameGraphState]);
 
   const onApplyFilters = useCallback((): void => {
     const validFilters = localFiltersRef.current.filter(f => {
@@ -386,7 +391,8 @@ export const useProfileFilters = (): {
     }));
 
     setAppliedFilters(filtersToApply);
-  }, [setAppliedFilters]);
+    resetFlameGraphState();
+  }, [setAppliedFilters, resetFlameGraphState]);
 
   const protoFilters = useMemo(() => {
     return convertToProtoFilters(appliedFilters ?? []);

package/src/ProfileView/hooks/{useResetStateOnNewSearch.ts → useResetFlameGraphState.ts}

@@ -13,7 +13,7 @@
 
 import {useURLState} from '@parca/components';
 
-export const useResetStateOnNewSearch = (): (() => void) => {
+export const useResetFlameGraphState = (): (() => void) => {
   const [val, setCurPath] = useURLState('cur_path');
 
   return () => {

package/src/ProfileView/hooks/useVisualizationState.ts

@@ -11,7 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import {useCallback, useMemo, useState} from 'react';
+import {useCallback, useMemo} from 'react';
 
 import {JSONParser, JSONSerializer, useURLState, useURLStateCustom} from '@parca/components';
 
@@ -23,10 +23,9 @@ import {
   FIELD_MAPPING_FILE,
 } from '../../ProfileFlameGraph/FlameGraphArrow';
 import {CurrentPathFrame} from '../../ProfileFlameGraph/FlameGraphArrow/utils';
+import {useResetFlameGraphState} from './useResetFlameGraphState';
 
 export const useVisualizationState = (): {
-  curPath: string[];
-  setCurPath: (path: string[]) => void;
   curPathArrow: CurrentPathFrame[];
   setCurPathArrow: (path: CurrentPathFrame[]) => void;
   colorStackLegend: string | undefined;
@@ -40,7 +39,6 @@ export const useVisualizationState = (): {
   setSandwichFunctionName: (sandwichFunctionName: string | undefined) => void;
   resetSandwichFunctionName: () => void;
 } => {
-  const [curPath, setCurPath] = useState<string[]>([]);
   const [curPathArrow, setCurPathArrow] = useURLStateCustom<CurrentPathFrame[]>('cur_path', {
     parse: JSONParser<CurrentPathFrame[]>,
     stringify: JSONSerializer,
@@ -55,6 +53,7 @@ export const useVisualizationState = (): {
   const [sandwichFunctionName, setSandwichFunctionName] = useURLState<string | undefined>(
     'sandwich_function_name'
   );
+  const resetFlameGraphState = useResetFlameGraphState();
 
   const levelsOfProfiling = useMemo(
     () => [
@@ -81,8 +80,10 @@ export const useVisualizationState = (): {
         const filteredGroupBy = groupBy.filter(item => !levelsOfProfiling.includes(item));
         setGroupBy([...filteredGroupBy, key]); // add
       }
+
+      resetFlameGraphState();
     },
-    [groupBy, setGroupBy, levelsOfProfiling]
+    [groupBy, setGroupBy, levelsOfProfiling, resetFlameGraphState]
   );
 
   const setGroupByLabels = useCallback(
@@ -97,8 +98,6 @@ export const useVisualizationState = (): {
   }, [setSandwichFunctionName]);
 
   return {
-    curPath,
-    setCurPath,
     curPathArrow,
     setCurPathArrow,
     colorStackLegend,

package/src/ProfileView/index.tsx

@@ -56,8 +56,6 @@ export const ProfileView = ({
   const {ref, dimensions} = useContainerDimensions();
 
   const {
-    curPath,
-    setCurPath,
     curPathArrow,
     setCurPathArrow,
     colorStackLegend,
@@ -100,8 +98,6 @@ export const ProfileView = ({
       profileSource,
       total,
       filtered,
-      curPath,
-      setNewCurPath: setCurPath,
       curPathArrow,
       setNewCurPathArrow: setCurPathArrow,
       perf,

package/src/ProfileViewWithData.tsx

@@ -58,7 +58,7 @@ export const ProfileViewWithData = ({
 
   useEffect(() => {
     // If profile type is not delta, remove flamechart from the dashboard items
-    // and set it to flame if no other items are selected.
+    // and set it to flame graph if no other items are selected.
     if (profileSource == null) {
       return;
     }

package/dist/ProfileView/hooks/useResetStateOnNewSearch.d.ts

@@ -1,2 +0,0 @@
-export declare const useResetStateOnNewSearch: () => (() => void);
-//# sourceMappingURL=useResetStateOnNewSearch.d.ts.map

package/dist/ProfileView/hooks/useResetStateOnNewSearch.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useResetStateOnNewSearch.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetStateOnNewSearch.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,wBAAwB,QAAO,CAAC,MAAM,IAAI,CAWtD,CAAC"}