@parca/profile 0.19.138 → 0.19.140

package/dist/ProfileView/components/ActionButtons/SortByDropdown.js

@@ -11,13 +11,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 // 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 { Select, useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
+import { Select } from '@parca/components';
 import { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_NAME, } from '../../../ProfileFlameGraph/FlameGraphArrow';
+import { stringParam } from '../../../hooks/urlParsers';
 import { useProfileViewContext } from '../../context/ProfileViewContext';
 const SortByDropdown = () => {
-    const [storeSortBy, setStoreSortBy] = useURLState('sort_by', {
-        defaultValue: FIELD_FUNCTION_NAME,
-    });
+    const [storeSortBy, setStoreSortBy] = useQueryState('sort_by', stringParam.withDefault(FIELD_FUNCTION_NAME));
     const { compareMode } = useProfileViewContext();
     return (_jsxs("div", { children: [_jsx("label", { className: "text-sm", children: "Sort by" }), _jsx(Select, { className: "!px-3", items: [
                     {
@@ -44,6 +44,6 @@ const SortByDropdown = () => {
                             expanded: (_jsx(_Fragment, { children: _jsx("span", { children: "Diff" }) })),
                         },
                     },
-                ], selectedKey: storeSortBy, onSelection: key => setStoreSortBy(key), placeholder: 'Sort By', primary: false, disabled: false, id: "h-sort-by-filter" })] }));
+                ], selectedKey: storeSortBy, onSelection: key => void setStoreSortBy(key), placeholder: 'Sort By', primary: false, disabled: false, id: "h-sort-by-filter" })] }));
 };
 export default SortByDropdown;

package/dist/ProfileView/components/ColorStackLegend.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorStackLegend.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/components/ColorStackLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAarC,UAAU,KAAK;IACb,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,gBAAgB,GAAI,oCAA0C,KAAK,KAAG,KAAK,CAAC,GAAG,CAAC,OAuGrF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"ColorStackLegend.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/components/ColorStackLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAarC,UAAU,KAAK;IACb,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,gBAAgB,GAAI,oCAA0C,KAAK,KAAG,KAAK,CAAC,GAAG,CAAC,OAqGrF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/ProfileView/components/ColorStackLegend.js

@@ -14,18 +14,17 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { useMemo } from 'react';
 import { Icon } from '@iconify/react';
 import cx from 'classnames';
-import { useURLState } from '@parca/components';
 import { USER_PREFERENCES, useCurrentColorProfile, useUserPreference } from '@parca/hooks';
 import { EVERYTHING_ELSE, selectDarkMode, useAppSelector } from '@parca/store';
 import { getMappingColors } from '../../ProfileFlameGraph/FlameGraphArrow';
 import useMappingList from '../../ProfileFlameGraph/FlameGraphArrow/useMappingList';
+import { useColorBy } from '../../hooks/useColorBy';
 import { useProfileFilters } from './ProfileFilters/useProfileFilters';
 const ColorStackLegend = ({ mappings, compareMode = false, loading }) => {
     const isDarkMode = useAppSelector(selectDarkMode);
     const currentColorProfile = useCurrentColorProfile();
     const [colorProfileName] = useUserPreference(USER_PREFERENCES.FLAMEGRAPH_COLOR_PROFILE.key);
-    const [colorByValue, _] = useURLState('color_by');
-    const colorBy = colorByValue === 'binary' || colorByValue === undefined ? 'binary' : 'filename';
+    const { colorBy } = useColorBy();
     const { appliedFilters, removeExcludeBinary, excludeBinary } = useProfileFilters();
     // Get current binary filters from the new ProfileFilters system
     const currentBinaryFilters = useMemo(() => {

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":"AAoBA,QAAA,MAAM,eAAe,QAAO,GAAG,CAAC,OA0B/B,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/InvertCallStack/index.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,eAAe,QAAO,GAAG,CAAC,OAyB/B,CAAC;AAEF,eAAe,eAAe,CAAC"}

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

@@ -12,15 +12,16 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { Icon } from '@iconify/react';
-import { Button, useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
+import { Button } from '@parca/components';
 import { TEST_IDS, testId } from '@parca/test-utils';
+import { invertCallStackParser } from '../../../hooks/urlParsers';
 import { useResetFlameGraphState } from '../../hooks/useResetFlameGraphState';
 const InvertCallStack = () => {
-    const [invertStack = '', setInvertStack] = useURLState('invert_call_stack');
-    const isInvert = invertStack === 'true';
+    const [isInvert, setInvertStack] = useQueryState('invert_call_stack', invertCallStackParser);
     const resetFlameGraphState = useResetFlameGraphState();
     const handleSetInvert = (value) => {
-        setInvertStack(value ? 'true' : '');
+        void setInvertStack(value);
         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", ...testId(TEST_IDS.INVERT_CALL_STACK_BUTTON), children: [_jsx(Icon, { icon: isInvert ? 'ph:sort-ascending' : 'ph:sort-descending', className: "h-4 w-4" }), isInvert ? 'Original' : 'Invert', " Call Stack"] })] }));

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

@@ -1,9 +1,8 @@
-import { type ParamValueSetterCustom } from '@parca/components';
 import { type ProfileFilter } from './useProfileFilters';
 export declare const decodeProfileFilters: (encoded: string) => ProfileFilter[];
 export declare const useProfileFiltersUrlState: () => {
     appliedFilters: ProfileFilter[];
-    setAppliedFilters: ParamValueSetterCustom<ProfileFilter[]>;
+    setAppliedFilters: (filters: ProfileFilter[]) => void;
     forceApplyFilters: (filters: ProfileFilter[]) => void;
 };
 //# sourceMappingURL=useProfileFiltersUrlState.d.ts.map

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":"AAeA,OAAO,EAAsC,KAAK,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AAInG,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAsEvD,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,KAAG,aAAa,EAgDnE,CAAC;AAEF,eAAO,MAAM,yBAAyB,QAAO;IAC3C,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,EAAE,sBAAsB,CAAC,aAAa,EAAE,CAAC,CAAC;IAC3D,iBAAiB,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CA4CvD,CAAC"}
+{"version":3,"file":"useProfileFiltersUrlState.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ProfileFilters/useProfileFiltersUrlState.ts"],"names":[],"mappings":"AAoBA,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAsEvD,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,KAAG,aAAa,EAgDnE,CAAC;AAUF,eAAO,MAAM,yBAAyB,QAAO;IAC3C,cAAc,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IACtD,iBAAiB,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;CAmCvD,CAAC"}

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

@@ -11,7 +11,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useCallback, useMemo } from 'react';
-import { useURLStateBatch, useURLStateCustom } from '@parca/components';
+import { createParser, useQueryState } from 'nuqs';
 import { safeDecode } from '@parca/utilities';
 import { isPresetKey } from './filterPresets';
 // Compact encoding mappings
@@ -113,21 +113,21 @@ export const decodeProfileFilters = (encoded) => {
         return [];
     }
 };
+const profileFiltersParser = createParser({
+    parse: (value) => decodeProfileFilters(value),
+    serialize: (value) => encodeProfileFilters(value),
+    eq: (a, b) => encodeProfileFilters(a) === encodeProfileFilters(b),
+})
+    .withDefault([])
+    .withOptions({ history: 'replace' });
 export const useProfileFiltersUrlState = () => {
-    const batchUpdates = useURLStateBatch();
-    // Store applied filters in URL state for persistence using compact encoding
-    const [appliedFilters, setAppliedFilters] = useURLStateCustom(`profile_filters`, {
-        parse: value => {
-            return decodeProfileFilters(value);
-        },
-        stringify: value => {
-            return encodeProfileFilters(value);
-        },
-        defaultValue: [],
-    });
+    const [appliedFilters, setRawFilters] = useQueryState('profile_filters', profileFiltersParser);
     const memoizedAppliedFilters = useMemo(() => {
         return appliedFilters ?? [];
     }, [appliedFilters]);
+    const setAppliedFilters = useCallback((filters) => {
+        void setRawFilters(filters);
+    }, [setRawFilters]);
     // Force apply filters (bypasses preserve-existing strategy)
     const forceApplyFilters = useCallback((filters) => {
         const validFilters = filters.filter(f => {
@@ -136,10 +136,8 @@ export const useProfileFiltersUrlState = () => {
             }
             return f.value !== '' && f.type != null && f.field != null && f.matchType != null;
         });
-        batchUpdates(() => {
-            setAppliedFilters(validFilters);
-        });
-    }, [batchUpdates, setAppliedFilters]);
+        setAppliedFilters(validFilters);
+    }, [setAppliedFilters]);
     return {
         appliedFilters: memoizedAppliedFilters,
         setAppliedFilters,

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

@@ -1,70 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 // eslint-disable-next-line import/named
 import { act, renderHook, waitFor } from '@testing-library/react';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-import { URLStateProvider } from '@parca/components';
+// eslint-disable-next-line import/no-unresolved
+import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
+import { describe, expect, it, vi } from 'vitest';
 import { decodeProfileFilters, useProfileFiltersUrlState } from './useProfileFiltersUrlState';
-// Mock window.location
-const mockLocation = {
-    pathname: '/test',
-    search: '',
-};
-// Mock the navigate function
-const mockNavigateTo = vi.fn((path, params) => {
-    const searchParams = new URLSearchParams();
-    Object.entries(params).forEach(([key, value]) => {
-        if (value !== undefined && value !== null) {
-            if (Array.isArray(value)) {
-                searchParams.set(key, value.join(','));
-            }
-            else {
-                searchParams.set(key, String(value));
-            }
-        }
-    });
-    mockLocation.search = `?${searchParams.toString()}`;
-});
-// Mock getQueryParamsFromURL
-vi.mock('@parca/components/src/hooks/URLState/utils', async () => {
-    const actual = await vi.importActual('@parca/components/src/hooks/URLState/utils');
-    return {
-        ...actual,
-        getQueryParamsFromURL: () => {
-            if (mockLocation.search === '')
-                return {};
-            const params = new URLSearchParams(mockLocation.search);
-            const result = {};
-            for (const [key, value] of params.entries()) {
-                const decodedValue = decodeURIComponent(value);
-                const existing = result[key];
-                if (existing !== undefined) {
-                    result[key] = Array.isArray(existing)
-                        ? [...existing, decodedValue]
-                        : [existing, decodedValue];
-                }
-                else {
-                    result[key] = decodedValue;
-                }
-            }
-            return result;
-        },
-    };
-});
-// Helper to create wrapper with URLStateProvider
-const createWrapper = () => {
-    const Wrapper = ({ children }) => (_jsx(URLStateProvider, { navigateTo: mockNavigateTo, children: children }));
-    Wrapper.displayName = 'URLStateProviderWrapper';
+// Helper to create wrapper with NuqsTestingAdapter
+const createWrapper = (searchParams = {}, onUrlUpdate) => {
+    const Wrapper = ({ children }) => (_jsx(NuqsTestingAdapter, { searchParams: searchParams, onUrlUpdate: onUrlUpdate, hasMemory: true, children: children }));
+    Wrapper.displayName = 'NuqsTestingWrapper';
     return Wrapper;
 };
 describe('useProfileFiltersUrlState', () => {
-    beforeEach(() => {
-        mockNavigateTo.mockClear();
-        Object.defineProperty(window, 'location', {
-            value: mockLocation,
-            writable: true,
-        });
-        mockLocation.search = '';
-    });
     describe('decodeProfileFilters', () => {
         it('should return empty array for empty string', () => {
             expect(decodeProfileFilters('')).toEqual([]);
@@ -206,8 +153,9 @@ describe('useProfileFiltersUrlState', () => {
             expect(result.current.appliedFilters).toEqual([]);
         });
         it('should read filters from URL', async () => {
-            mockLocation.search = '?profile_filters=s:fn:=:testFunc';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:testFunc' }),
+            });
             await waitFor(() => {
                 expect(result.current.appliedFilters).toHaveLength(1);
                 expect(result.current.appliedFilters[0]).toMatchObject({
@@ -219,7 +167,10 @@ describe('useProfileFiltersUrlState', () => {
             });
         });
         it('should update URL when setting filters', async () => {
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({}, onUrlUpdate),
+            });
             const newFilters = [
                 {
                     id: 'test-1',
@@ -233,22 +184,23 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.setAppliedFilters(newFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                expect(params.profile_filters).toBe('f:b:!~:libc.so');
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.get('profile_filters')).toBe('f:b:!~:libc.so');
             });
         });
         it('should clear URL param when setting empty filters', async () => {
-            mockLocation.search = '?profile_filters=s:fn:=:testFunc';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:testFunc' }, onUrlUpdate),
+            });
             act(() => {
                 result.current.setAppliedFilters([]);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                // When filters are empty, the param is either empty string or undefined (removed)
-                expect(params.profile_filters === '' || params.profile_filters === undefined).toBe(true);
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.has('profile_filters')).toBe(false);
             });
         });
     });
@@ -258,8 +210,10 @@ describe('useProfileFiltersUrlState', () => {
             expect(typeof result.current.forceApplyFilters).toBe('function');
         });
         it('should force apply filters overwriting existing', async () => {
-            mockLocation.search = '?profile_filters=s:fn:=:existingFunc';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:existingFunc' }, onUrlUpdate),
+            });
             // Verify existing filter is loaded
             await waitFor(() => {
                 expect(result.current.appliedFilters).toHaveLength(1);
@@ -277,28 +231,32 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.forceApplyFilters(newFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                expect(params.profile_filters).toBe('f:b:!~:forcedValue');
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.get('profile_filters')).toBe('f:b:!~:forcedValue');
             });
         });
         it('should clear filters when force applying empty array', async () => {
-            mockLocation.search = '?profile_filters=s:fn:=:existingFunc';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:existingFunc' }, onUrlUpdate),
+            });
             act(() => {
                 result.current.forceApplyFilters([]);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                // When filters are empty, the param is either empty string or undefined (removed)
-                expect(params.profile_filters === '' || params.profile_filters === undefined).toBe(true);
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.has('profile_filters')).toBe(false);
             });
         });
     });
     describe('Preset filter encoding', () => {
         it('should encode preset filters correctly', async () => {
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({}, onUrlUpdate),
+            });
             const presetFilters = [
                 {
                     id: 'preset-1',
@@ -310,13 +268,16 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.setAppliedFilters(presetFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                expect(params.profile_filters).toBe('p:hide_libc:enabled');
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.get('profile_filters')).toBe('p:hide_libc:enabled');
             });
         });
         it('should handle mixed preset and regular filters', async () => {
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({}, onUrlUpdate),
+            });
             const mixedFilters = [
                 {
                     id: 'preset-1',
@@ -335,15 +296,18 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.setAppliedFilters(mixedFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                expect(params.profile_filters).toBe('p:hide_libc:enabled,f:b:!~:node');
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                expect(lastCall.searchParams.get('profile_filters')).toBe('p:hide_libc:enabled,f:b:!~:node');
             });
         });
     });
     describe('URL encoding edge cases', () => {
         it('should handle special characters in filter values', async () => {
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({}, onUrlUpdate),
+            });
             const filtersWithSpecialChars = [
                 {
                     id: 'special-1',
@@ -357,14 +321,18 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.setAppliedFilters(filtersWithSpecialChars);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                // Value should be URL encoded
-                expect(params.profile_filters).toContain('std%3A%3Avector%3Cint%3E');
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                const filterValue = lastCall.searchParams.get('profile_filters');
+                // The value should contain the encoded special characters
+                expect(filterValue).toContain('std%3A%3Avector%3Cint%3E');
             });
         });
         it('should filter out incomplete filters when encoding', async () => {
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({}, onUrlUpdate),
+            });
             const incompleteFilters = [
                 {
                     id: 'complete-1',
@@ -389,10 +357,10 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.setAppliedFilters(incompleteFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
                 // Only the complete filter should be encoded
-                expect(params.profile_filters).toBe('f:b:!~:valid');
+                expect(lastCall.searchParams.get('profile_filters')).toBe('f:b:!~:valid');
             });
         });
     });
@@ -409,8 +377,9 @@ describe('useProfileFiltersUrlState', () => {
             expect(result.current.appliedFilters).toEqual([]);
         });
         it('should return correctly structured filters from URL', async () => {
-            mockLocation.search = '?profile_filters=s:fn:=:testFunc';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:testFunc' }),
+            });
             await waitFor(() => {
                 expect(result.current.appliedFilters).toHaveLength(1);
             });
@@ -426,13 +395,12 @@ describe('useProfileFiltersUrlState', () => {
     });
     describe('View switching scenarios', () => {
         it('should completely replace filters when switching views using forceApplyFilters', async () => {
-            // Start with View A's filters (2 filters)
-            mockLocation.search = '?profile_filters=s:fn:=:viewAFunc,f:b:!=:viewABinary';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const onUrlUpdate = vi.fn();
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:viewAFunc,f:b:!=:viewABinary' }, onUrlUpdate),
+            });
             await waitFor(() => {
                 expect(result.current.appliedFilters).toHaveLength(2);
-                expect(result.current.appliedFilters[0].value).toBe('viewAFunc');
-                expect(result.current.appliedFilters[1].value).toBe('viewABinary');
             });
             // Switch to View B (completely different filter)
             const viewBFilters = [
@@ -448,77 +416,23 @@ describe('useProfileFiltersUrlState', () => {
                 result.current.forceApplyFilters(viewBFilters);
             });
             await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
+                expect(onUrlUpdate).toHaveBeenCalled();
+                const lastCall = onUrlUpdate.mock.calls[onUrlUpdate.mock.calls.length - 1][0];
+                const filterValue = lastCall.searchParams.get('profile_filters');
                 // View A's filters should be completely gone
-                expect(params.profile_filters).not.toContain('viewAFunc');
-                expect(params.profile_filters).not.toContain('viewABinary');
+                expect(filterValue).not.toContain('viewAFunc');
+                expect(filterValue).not.toContain('viewABinary');
                 // Only View B's filter should be present
-                expect(params.profile_filters).toBe('f:fn:~:viewBOnly');
-            });
-        });
-        it('should handle sequential view switches correctly', async () => {
-            // Simulate: [default] -> [storage] -> [testing-view]
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
-            // View 1: default view (1 filter)
-            const defaultFilters = [{ id: 'd-1', type: 'hide_libc', value: 'enabled' }];
-            act(() => {
-                result.current.forceApplyFilters(defaultFilters);
-            });
-            await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                expect(params.profile_filters).toBe('p:hide_libc:enabled');
-            });
-            mockNavigateTo.mockClear();
-            // View 2: storage view (3 filters)
-            const storageFilters = [
-                { id: 's-1', type: 'stack', field: 'function_name', matchType: 'not_contains', value: 'io' },
-                { id: 's-2', type: 'frame', field: 'binary', matchType: 'not_contains', value: 'disk' },
-                { id: 's-3', type: 'frame', field: 'function_name', matchType: 'contains', value: 'storage' },
-            ];
-            act(() => {
-                result.current.forceApplyFilters(storageFilters);
-            });
-            await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                // Default view's filter should be gone
-                expect(params.profile_filters).not.toContain('hide_libc');
-                // Storage view should have 3 filters
-                expect(params.profile_filters).toContain('io');
-                expect(params.profile_filters).toContain('disk');
-                expect(params.profile_filters).toContain('storage');
-            });
-            mockNavigateTo.mockClear();
-            // View 3: testing-view (2 filters)
-            const testingFilters = [
-                { id: 't-1', type: 'stack', field: 'function_name', matchType: 'equal', value: 'test_main' },
-                { id: 't-2', type: 'frame', field: 'binary', matchType: 'contains', value: 'test' },
-            ];
-            act(() => {
-                result.current.forceApplyFilters(testingFilters);
-            });
-            await waitFor(() => {
-                expect(mockNavigateTo).toHaveBeenCalled();
-                const [, params] = mockNavigateTo.mock.calls[mockNavigateTo.mock.calls.length - 1];
-                // Storage view's filters should be gone
-                expect(params.profile_filters).not.toContain('io');
-                expect(params.profile_filters).not.toContain('disk');
-                expect(params.profile_filters).not.toContain('storage');
-                // Testing view should have its 2 filters
-                expect(params.profile_filters).toContain('test_main');
-                expect(params.profile_filters).toContain('test');
+                expect(filterValue).toBe('f:fn:~:viewBOnly');
             });
         });
         it('should not change filters when clicking the same view tab', async () => {
-            // Start with existing filters
-            mockLocation.search = '?profile_filters=s:fn:=:existingFilter';
-            const { result } = renderHook(() => useProfileFiltersUrlState(), { wrapper: createWrapper() });
+            const { result } = renderHook(() => useProfileFiltersUrlState(), {
+                wrapper: createWrapper({ profile_filters: 's:fn:=:existingFilter' }),
+            });
             await waitFor(() => {
                 expect(result.current.appliedFilters).toHaveLength(1);
             });
-            mockNavigateTo.mockClear();
             // Apply the same filters (simulating clicking the same view tab)
             const sameFilters = [
                 {

package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MultiLevelDropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAQtE,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAkK1C,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAsPzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"MultiLevelDropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAQtE,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAmK1C,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAoPzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}