@parca/profile 0.19.138 → 0.19.140

package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js

@@ -15,9 +15,10 @@ import { useCallback, useEffect, useRef, useState } from 'react';
 import { Menu } from '@headlessui/react';
 import { Icon } from '@iconify/react';
 import cx from 'classnames';
-import { useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
 import { USER_PREFERENCES, useUserPreference } from '@parca/hooks';
 import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from '../../../ProfileFlameGraph/FlameGraphArrow';
+import { boolParam, hiddenBinariesParser, stringParam } from '../../../hooks/urlParsers';
 import { useProfileViewContext } from '../../context/ProfileViewContext';
 import SwitchMenuItem from './SwitchMenuItem';
 const MenuItem = ({ label, items, onclick, onSelect, path = [], id, closeDropdown, isNested = false, activeValueForSortBy, activeValueForColorBy, activeValuesForLevel, value, disabled = false, icon, customSubmenu, renderAsDiv = false, }) => {
@@ -73,23 +74,18 @@ const MenuItem = ({ label, items, onclick, onSelect, path = [], id, closeDropdow
 const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isTableVizOnly, alignFunctionName, setAlignFunctionName, colorBy, setColorBy, }) => {
     const dropdownRef = useRef(null);
     const [shouldOpenLeft, setShouldOpenLeft] = useState(false);
-    const [storeSortBy] = useURLState('sort_by', {
-        defaultValue: FIELD_FUNCTION_NAME,
-    });
-    const [colorStackLegend, setStoreColorStackLegend] = useURLState('color_stack_legend');
-    const [hiddenBinaries, setHiddenBinaries] = useURLState('hidden_binaries', {
-        defaultValue: [],
-        alwaysReturnArray: true,
-    });
+    const [storeSortBy] = useQueryState('sort_by', stringParam.withDefault(FIELD_FUNCTION_NAME));
+    const [colorStackLegend, setStoreColorStackLegend] = useQueryState('color_stack_legend', stringParam);
+    const [hiddenBinaries, setHiddenBinaries] = useQueryState('hidden_binaries', hiddenBinariesParser);
     const { compareMode } = useProfileViewContext();
     const [colorProfileName] = useUserPreference(USER_PREFERENCES.FLAMEGRAPH_COLOR_PROFILE.key);
     const isColorStackLegendEnabled = colorStackLegend === 'true';
     const isLeftAligned = alignFunctionName === 'left';
     // By default, we want delta profiles (CPU) to be relatively compared.
     // For non-delta profiles, like goroutines or memory, we want the profiles to be compared absolutely.
-    const compareAbsoluteDefault = profileType?.delta === false ? 'true' : 'false';
-    const [compareAbsolute = compareAbsoluteDefault, setCompareAbsolute] = useURLState('compare_absolute');
-    const isCompareAbsolute = compareAbsolute === 'true';
+    const compareAbsoluteDefault = profileType?.delta === false;
+    const [compareAbsolute, setCompareAbsolute] = useQueryState('compare_absolute', boolParam);
+    const isCompareAbsolute = compareAbsolute ?? compareAbsoluteDefault;
     useEffect(() => {
         const checkOverflow = () => {
             if (dropdownRef.current !== null) {
@@ -108,13 +104,13 @@ const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isT
     const handleBinaryToggle = (index) => {
         const updatedBinaries = [...hiddenBinaries];
         updatedBinaries.splice(index, 1);
-        setHiddenBinaries(updatedBinaries);
+        void setHiddenBinaries(updatedBinaries);
     };
     const setColorStackLegend = useCallback((value) => {
-        setStoreColorStackLegend(value);
+        void setStoreColorStackLegend(value);
     }, [setStoreColorStackLegend]);
     const resetLegend = () => {
-        setHiddenBinaries([]);
+        void setHiddenBinaries([]);
     };
     const menuItems = [
         {
@@ -181,7 +177,7 @@ const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isT
         },
         {
             label: isCompareAbsolute ? 'Compare Relative' : 'Compare Absolute',
-            onclick: () => setCompareAbsolute(isCompareAbsolute ? 'false' : 'true'),
+            onclick: () => void setCompareAbsolute(!isCompareAbsolute),
             hide: !compareMode,
             icon: isCompareAbsolute ? 'fluent-mdl2:compare' : 'fluent-mdl2:compare-uneven',
         },
@@ -199,7 +195,7 @@ const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isT
         },
         {
             label: 'Reset Legend',
-            hide: hiddenBinaries === undefined || hiddenBinaries.length === 0,
+            hide: hiddenBinaries.length === 0,
             onclick: () => resetLegend(),
             id: 'h-reset-legend-button',
             icon: 'system-uicons:reset',
@@ -207,16 +203,16 @@ const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isT
         {
             label: 'Hidden Binaries',
             id: 'h-hidden-binaries',
-            items: hiddenBinaries?.map((binary, index) => ({
+            items: hiddenBinaries.map((binary, index) => ({
                 label: binary,
                 customSubmenu: (_jsxs("div", { className: "flex items-center gap-2 w-full", children: [_jsx("input", { id: binary, name: binary, type: "checkbox", className: "h-4 w-4 rounded-md border-2 border-gray-300 text-indigo-600 focus:ring-indigo-600 focus:ring-offset-0 checked:bg-indigo-600 checked:border-indigo-600", checked: hiddenBinaries?.includes(binary), onChange: () => handleBinaryToggle(index) }), _jsx("span", { children: binary })] })),
             })),
-            hide: hiddenBinaries === undefined || hiddenBinaries.length === 0,
+            hide: hiddenBinaries.length === 0,
             icon: 'ph:eye-closed',
         },
     ];
     return (_jsx("div", { className: "relative inline-block text-left", id: "h-visualisation-toolbar-actions", ref: dropdownRef, children: _jsx(Menu, { children: ({ open, close }) => (_jsxs(_Fragment, { children: [_jsxs(Menu.Button, { className: "flex dark:bg-gray-900 dark:border-gray-600 justify-center w-full px-4 py-2 text-sm font-normal text-gray-600 dark:text-gray-200 bg-white rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 border border-gray-200 pr-[1.7rem]", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Icon, { icon: "pajamas:preferences", className: "w-4 h-4" }), _jsx("span", { children: "Preferences" })] }), _jsx("span", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2 text-gray-400", children: _jsx(Icon, { icon: "heroicons:chevron-down-20-solid", "aria-hidden": "true" }) })] }), open && (_jsx(Menu.Items, { className: cx(isTableVizOnly ? 'w-64' : 'w-80', 'absolute z-50 mt-2 py-2 bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none border dark:bg-gray-900 dark:border-gray-600', shouldOpenLeft ? 'right-0 origin-top-right' : 'left-0 origin-top-left'), children: menuItems
                             .filter(item => item.hide !== undefined && !item.hide)
-                            .map((item, index) => (_jsx(MenuItem, { ...item, onSelect: onSelect, closeDropdown: close, activeValueForSortBy: storeSortBy, activeValueForColorBy: colorBy === undefined || colorBy === '' ? 'binary' : colorBy, activeValuesForLevel: groupBy, renderAsDiv: item.renderAsDiv }, index))) }))] })) }) }));
+                            .map((item, index) => (_jsx(MenuItem, { ...item, onSelect: onSelect, closeDropdown: close, activeValueForSortBy: storeSortBy, activeValueForColorBy: colorBy, activeValuesForLevel: groupBy, renderAsDiv: item.renderAsDiv }, index))) }))] })) }) }));
 };
 export default MultiLevelDropdown;

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

@@ -1 +1 @@
-{"version":3,"file":"TableColumnsDropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/TableColumnsDropdown.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAQ1C,UAAU,KAAK;IACb,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,QAAA,MAAM,oBAAoB,GAAI,kCAAgC,KAAK,KAAG,GAAG,CAAC,OA+KzE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"TableColumnsDropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/TableColumnsDropdown.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAS1C,UAAU,KAAK;IACb,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,QAAA,MAAM,oBAAoB,GAAI,kCAAgC,KAAK,KAAG,GAAG,CAAC,OA6KzE,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/dist/ProfileView/components/Toolbars/TableColumnsDropdown.js

@@ -13,16 +13,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // limitations under the License.
 import { useEffect, useMemo, useState } from 'react';
 import { createColumnHelper } from '@tanstack/table-core';
-import { useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
 import { valueFormatter } from '@parca/utilities';
 import ColumnsVisibility from '../../../Table/ColumnsVisibility';
 import { addPlusSign, getRatioString } from '../../../Table/utils/functions';
+import { tableColumnsParser } from '../../../hooks/urlParsers';
 import { useProfileViewContext } from '../../context/ProfileViewContext';
 const TableColumnsDropdown = ({ profileType, total, filtered }) => {
     const { compareMode } = useProfileViewContext();
-    const [tableColumns, setTableColumns] = useURLState('table_columns', {
-        alwaysReturnArray: true,
-    });
+    const [tableColumns, setTableColumns] = useQueryState('table_columns', tableColumnsParser);
     const columnHelper = createColumnHelper();
     const unit = useMemo(() => profileType?.sampleUnit ?? '', [profileType?.sampleUnit]);
     const columns = useMemo(() => {
@@ -169,7 +168,7 @@ const TableColumnsDropdown = ({ profileType, total, filtered }) => {
     const updateColumnVisibility = (column, isVisible) => {
         const updatedColumns = { ...columnVisibility, [column]: isVisible };
         const newTableColumns = Object.keys(updatedColumns).filter(col => updatedColumns[col]);
-        setTableColumns(newTableColumns);
+        void setTableColumns(newTableColumns);
     };
     return (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("label", { className: "text-sm", children: "Table Columns" }), _jsx(ColumnsVisibility, { columns: columns, visibility: columnVisibility, setVisibility: (id, visible) => {
                     updateColumnVisibility(id, visible);

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

@@ -22,7 +22,7 @@ export interface VisualisationToolbarProps {
     flamechartDimension: string[];
     setFlamechartDimension: (labels: string[]) => void;
     showVisualizationSelector?: boolean;
-    sandwichFunctionName?: string;
+    sandwichFunctionName: string | null;
     alignFunctionName: string;
     setAlignFunctionName: (align: string) => void;
     colorBy: string;
@@ -44,7 +44,7 @@ export interface FlameGraphToolbarProps {
 }
 export interface SandwichFlameGraphToolbarProps {
     resetSandwichFunctionName: () => void;
-    sandwichFunctionName?: string;
+    sandwichFunctionName: string | null;
 }
 export declare const TableToolbar: FC<TableToolbarProps>;
 export declare const FlameGraphToolbar: FC<FlameGraphToolbarProps>;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAIzB,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAUrD,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6BAA6B,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChD,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,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;IACtC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,EAAE,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;QAC9B,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;CACnD;AAED,MAAM,WAAW,8BAA8B;IAC7C,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAQ9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkBxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAmBxE,CAAC;AAMF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAoH9D,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAIzB,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAUrD,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6BAA6B,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChD,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC,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;IACtC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,EAAE,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;QAC9B,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;CACnD;AAED,MAAM,WAAW,8BAA8B;IAC7C,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAQ9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkBxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAmBxE,CAAC;AAMF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAoH9D,CAAC"}

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

@@ -17,7 +17,7 @@ export const FlameGraphToolbar = ({ curPath, setNewCurPath }) => {
     return (_jsx(_Fragment, { children: _jsx("div", { className: "flex w-full gap-2 items-end", children: _jsxs(Button, { variant: "neutral", className: "gap-2 w-max h-fit", onClick: () => setNewCurPath([]), disabled: curPath.length === 0, id: "h-reset-graph", ...testId(TEST_IDS.FLAMEGRAPH_RESET_BUTTON), children: ["Reset graph", _jsx(Icon, { icon: "system-uicons:reset", width: 20 })] }) }) }));
 };
 export const SandwichFlameGraphToolbar = ({ resetSandwichFunctionName, sandwichFunctionName, }) => {
-    return (_jsx(_Fragment, { children: _jsx("div", { className: "flex w-full gap-2 items-end justify-between", children: _jsx(Button, { color: "neutral", onClick: () => resetSandwichFunctionName(), className: "w-auto", variant: "neutral", disabled: sandwichFunctionName === undefined || sandwichFunctionName.length === 0, children: "Reset view" }) }) }));
+    return (_jsx(_Fragment, { children: _jsx("div", { className: "flex w-full gap-2 items-end justify-between", children: _jsx(Button, { color: "neutral", onClick: () => resetSandwichFunctionName(), className: "w-auto", variant: "neutral", disabled: sandwichFunctionName == null || sandwichFunctionName.length === 0, children: "Reset view" }) }) }));
 };
 const Divider = () => (_jsx("div", { className: "border-t mt-4 border-gray-200 dark:border-gray-700 h-[1px] w-full pb-4" }));
 export const VisualisationToolbar = ({ groupBy, toggleGroupBy, setGroupByLabels, flamechartDimension, setFlamechartDimension, profileType, profileSource, queryClient, onDownloadPProf, pprofdownloading, profileViewExternalSubActions, curPath, setNewCurPath, total, filtered, showVisualizationSelector = true, alignFunctionName, setAlignFunctionName, colorBy, setColorBy, metadata: { labels: groupByLabels, refetch: metadataRefetch, loading: metadataLoading }, }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,YAAY,GAAI,mBAAiB,KAAK,KAAG,GAAG,CAAC,OA+JlD,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAKrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,QAAA,MAAM,YAAY,GAAI,mBAAiB,KAAK,KAAG,GAAG,CAAC,OAoJlD,CAAC;AAEF,eAAe,YAAY,CAAC"}

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

@@ -1,13 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useParcaContext, useURLState, useURLStateBatch } from '@parca/components';
+import { useQueryState } from 'nuqs';
+import { useParcaContext } from '@parca/components';
+import { stringParam } from '../../../hooks/urlParsers';
+import { useDashboardItems } from '../../../hooks/useDashboardItems';
 import Dropdown from './Dropdown';
 const ViewSelector = ({ profileSource }) => {
-    const [dashboardItems = ['flamegraph'], setDashboardItems] = useURLState('dashboard_items', {
-        alwaysReturnArray: true,
-    });
-    const [, setSandwichFunctionName] = useURLState('sandwich_function_name');
+    const { dashboardItems, setDashboardItems } = useDashboardItems();
+    const [, setSandwichFunctionName] = useQueryState('sandwich_function_name', stringParam);
     const { enableSourcesView, enableSandwichView } = useParcaContext();
-    const batchUpdates = useURLStateBatch();
     const allItems = [
         {
             key: 'flamegraph',
@@ -61,15 +61,9 @@ const ViewSelector = ({ profileSource }) => {
                 }
                 else {
                     const newDashboardItems = dashboardItems.filter(v => v !== item.key);
-                    // Batch updates when removing sandwich panel to combine both URL changes
+                    setDashboardItems(newDashboardItems);
                     if (item.key === 'sandwich') {
-                        batchUpdates(() => {
-                            setDashboardItems(newDashboardItems);
-                            setSandwichFunctionName(undefined);
-                        });
-                    }
-                    else {
-                        setDashboardItems(newDashboardItems);
+                        void setSandwichFunctionName(null);
                     }
                 }
             },

package/dist/ProfileView/context/DashboardContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardContext.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/context/DashboardContext.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAE,iBAAiB,EAA4B,MAAM,OAAO,CAAC;AAIvE,OAAO,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AAEzD,UAAU,oBAAoB;IAC5B,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,gBAAgB,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACjE,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAID,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,iBAAiB,CA8BnD,CAAC;AAEF,eAAO,MAAM,YAAY,QAAO,oBAM/B,CAAC"}
+{"version":3,"file":"DashboardContext.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/context/DashboardContext.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAE,iBAAiB,EAA4B,MAAM,OAAO,CAAC;AAMvE,OAAO,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AAEzD,UAAU,oBAAoB;IAC5B,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,gBAAgB,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACjE,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAID,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,iBAAiB,CA4BnD,CAAC;AAEF,eAAO,MAAM,YAAY,QAAO,oBAM/B,CAAC"}

package/dist/ProfileView/context/DashboardContext.js

@@ -12,19 +12,19 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { createContext, useContext } from 'react';
-import { useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
+import { stringParam } from '../../hooks/urlParsers';
+import { useDashboardItems } from '../../hooks/useDashboardItems';
 const DashboardContext = createContext(undefined);
 export const DashboardProvider = ({ children }) => {
-    const [dashboardItems, setDashboardItems] = useURLState('dashboard_items', {
-        alwaysReturnArray: true,
-    });
-    const [, setSandwichFunctionName] = useURLState('sandwich_function_name');
+    const { dashboardItems, setDashboardItems } = useDashboardItems();
+    const [, setSandwichFunctionName] = useQueryState('sandwich_function_name', stringParam);
     const handleClosePanel = (visualizationType) => {
         const newDashboardItems = dashboardItems.filter(item => item !== visualizationType);
         setDashboardItems(newDashboardItems);
         // Reset sandwich function name when closing sandwich panel
         if (visualizationType === 'sandwich') {
-            setSandwichFunctionName(undefined);
+            void setSandwichFunctionName(null);
         }
     };
     const isMultiPanelView = dashboardItems.length > 1;

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

@@ -1 +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"}
+{"version":3,"file":"useResetFlameGraphState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetFlameGraphState.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,uBAAuB,QAAO,CAAC,MAAM,IAAI,CAWrD,CAAC"}

package/dist/ProfileView/hooks/useResetFlameGraphState.js

@@ -10,15 +10,16 @@
 // 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 { useURLState } from '@parca/components';
+import { useQueryState } from 'nuqs';
+import { stringParam } from '../../hooks/urlParsers';
 export const useResetFlameGraphState = () => {
-    const [val, setCurPath] = useURLState('cur_path');
+    const [val, setCurPath] = useQueryState('cur_path', stringParam);
     return () => {
         setTimeout(() => {
-            if (val === undefined) {
+            if (val === null) {
                 return;
             }
-            setCurPath(undefined);
+            void setCurPath(null);
         });
     };
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useResetStateOnProfileTypeChange.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetStateOnProfileTypeChange.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,gCAAgC,QAAO,CAAC,MAAM,IAAI,CA+B9D,CAAC"}
+{"version":3,"file":"useResetStateOnProfileTypeChange.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetStateOnProfileTypeChange.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,gCAAgC,QAAO,CAAC,MAAM,IAAI,CA4B9D,CAAC"}

package/dist/ProfileView/hooks/useResetStateOnProfileTypeChange.js

@@ -10,35 +10,34 @@
 // 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 { useURLState, useURLStateBatch } from '@parca/components';
+import { useQueryStates } from 'nuqs';
+import { stringParam } from '../../hooks/urlParsers';
 import { useProfileFilters } from '../components/ProfileFilters/useProfileFilters';
 export const useResetStateOnProfileTypeChange = () => {
-    const [groupBy, setGroupBy] = useURLState('group_by');
-    const [curPath, setCurPath] = useURLState('cur_path');
-    const [sumByA, setSumByA] = useURLState('sum_by_a');
-    const [sumByB, setSumByB] = useURLState('sum_by_b');
+    const [state, setState] = useQueryStates({
+        group_by: stringParam,
+        cur_path: stringParam,
+        sum_by_a: stringParam,
+        sum_by_b: stringParam,
+        sandwich_function_name: stringParam,
+    }, { history: 'replace' });
     const { resetFilters } = useProfileFilters();
-    const [sandwichFunctionName, setSandwichFunctionName] = useURLState('sandwich_function_name');
-    const batchUpdates = useURLStateBatch();
     return () => {
-        // Batch all URL state resets into a single navigation
-        batchUpdates(() => {
-            if (groupBy !== undefined) {
-                setGroupBy(undefined);
-            }
-            if (curPath !== undefined) {
-                setCurPath(undefined);
-            }
-            if (sandwichFunctionName !== undefined) {
-                setSandwichFunctionName(undefined);
-            }
-            if (sumByA !== undefined) {
-                setSumByA(undefined);
-            }
-            if (sumByB !== undefined) {
-                setSumByB(undefined);
-            }
-            resetFilters();
-        });
+        // Atomic reset: clear all params in single URL update
+        const updates = {};
+        if (state.group_by !== null)
+            updates.group_by = null;
+        if (state.cur_path !== null)
+            updates.cur_path = null;
+        if (state.sandwich_function_name !== null)
+            updates.sandwich_function_name = null;
+        if (state.sum_by_a !== null)
+            updates.sum_by_a = null;
+        if (state.sum_by_b !== null)
+            updates.sum_by_b = null;
+        if (Object.keys(updates).length > 0) {
+            void setState(updates);
+        }
+        resetFilters();
     };
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useResetStateOnSeriesChange.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetStateOnSeriesChange.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,2BAA2B,QAAO,CAAC,MAAM,IAAI,CAczD,CAAC"}
+{"version":3,"file":"useResetStateOnSeriesChange.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useResetStateOnSeriesChange.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,2BAA2B,QAAO,CAAC,MAAM,IAAI,CAoBzD,CAAC"}

package/dist/ProfileView/hooks/useResetStateOnSeriesChange.js

@@ -10,17 +10,22 @@
 // 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 { useURLState } from '@parca/components';
+import { useQueryStates } from 'nuqs';
+import { stringParam } from '../../hooks/urlParsers';
 export const useResetStateOnSeriesChange = () => {
-    const [curPath, setCurPath] = useURLState('cur_path');
-    const [sandwichFunctionName, setSandwichFunctionName] = useURLState('sandwich_function_name');
+    const [state, setState] = useQueryStates({
+        cur_path: stringParam,
+        sandwich_function_name: stringParam,
+    }, { history: 'replace' });
     return () => {
         setTimeout(() => {
-            if (curPath !== undefined) {
-                setCurPath(undefined);
-            }
-            if (sandwichFunctionName !== undefined) {
-                setSandwichFunctionName(undefined);
+            const updates = {};
+            if (state.cur_path !== null)
+                updates.cur_path = null;
+            if (state.sandwich_function_name !== null)
+                updates.sandwich_function_name = null;
+            if (Object.keys(updates).length > 0) {
+                void setState(updates);
             }
         });
     };

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

@@ -2,7 +2,7 @@ import { CurrentPathFrame } from '../../ProfileFlameGraph/FlameGraphArrow/utils'
 export declare const useVisualizationState: () => {
     curPathArrow: CurrentPathFrame[];
     setCurPathArrow: (path: CurrentPathFrame[]) => void;
-    colorStackLegend: string | undefined;
+    colorStackLegend: string | null;
     colorBy: string;
     setColorBy: (colorBy: string) => void;
     groupBy: string[];
@@ -11,8 +11,8 @@ export declare const useVisualizationState: () => {
     setGroupByLabels: (labels: string[]) => void;
     flamechartDimension: string[];
     setFlamechartDimension: (labels: string[]) => void;
-    sandwichFunctionName: string | undefined;
-    setSandwichFunctionName: (sandwichFunctionName: string | undefined) => void;
+    sandwichFunctionName: string | null;
+    setSandwichFunctionName: (sandwichFunctionName: string | null) => void;
     resetSandwichFunctionName: () => void;
     alignFunctionName: string;
     setAlignFunctionName: (align: string) => void;

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":"AA+BA,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,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5E,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAgI/C,CAAC"}
+{"version":3,"file":"useVisualizationState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useVisualizationState.ts"],"names":[],"mappings":"AA0BA,OAAO,EAAC,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AAU/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,IAAI,CAAC;IAChC,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,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAC;IACpC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACvE,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAsH/C,CAAC"}

package/dist/ProfileView/hooks/useVisualizationState.js

@@ -11,35 +11,29 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useCallback, useMemo } from 'react';
-import { JSONParser, JSONSerializer, useURLState, useURLStateBatch, useURLStateCustom, } from '@parca/components';
+import { useQueryState } from 'nuqs';
 import { USER_PREFERENCES, useUserPreference } from '@parca/hooks';
 import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LABELS, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from '../../ProfileFlameGraph/FlameGraphArrow';
+import { flamechartDimensionParser, groupByParser, jsonParser, stringParam, } from '../../hooks/urlParsers';
+import { useColorBy } from '../../hooks/useColorBy';
 import { useResetFlameGraphState } from './useResetFlameGraphState';
 export const useVisualizationState = () => {
-    const [colorByPreference, setColorByPreference] = useUserPreference(USER_PREFERENCES.COLOR_BY.key);
     const [alignFunctionNamePreference, setAlignFunctionNamePreference] = useUserPreference(USER_PREFERENCES.ALIGN_FUNCTION_NAME.key);
-    const [curPathArrow, setCurPathArrow] = useURLStateCustom('cur_path', {
-        parse: (JSONParser),
-        stringify: JSONSerializer,
-        defaultValue: '[]',
-    });
-    const [colorStackLegend] = useURLState('color_stack_legend');
-    const [colorBy, setStoreColorBy] = useURLState('color_by', {
-        defaultValue: colorByPreference,
-    });
-    const [alignFunctionName, setStoreAlignFunctionName] = useURLState('align_function_name', {
-        defaultValue: alignFunctionNamePreference,
-    });
-    const [groupBy, setStoreGroupBy] = useURLState('group_by', {
-        defaultValue: [FIELD_FUNCTION_NAME],
-        alwaysReturnArray: true,
-    });
-    const [sandwichFunctionName, setSandwichFunctionName] = useURLState('sandwich_function_name');
-    const [flamechartDimension, setStoreFlamechartDimension] = useURLState('flamechart_dimension', {
-        alwaysReturnArray: true,
-    });
+    const [curPathArrow, setRawCurPathArrow] = useQueryState('cur_path', jsonParser().withDefault([]));
+    const setCurPathArrow = useCallback((path) => {
+        void setRawCurPathArrow(path);
+    }, [setRawCurPathArrow]);
+    const [colorStackLegend] = useQueryState('color_stack_legend', stringParam);
+    const { colorBy, setColorBy } = useColorBy();
+    const [alignFunctionNameRaw, setStoreAlignFunctionName] = useQueryState('align_function_name', stringParam);
+    const alignFunctionName = alignFunctionNameRaw ?? alignFunctionNamePreference ?? 'left';
+    const [groupBy, setStoreGroupBy] = useQueryState('group_by', groupByParser.withDefault([FIELD_FUNCTION_NAME]));
+    const [sandwichFunctionName, setRawSandwichFunctionName] = useQueryState('sandwich_function_name', stringParam);
+    const setSandwichFunctionName = useCallback((name) => {
+        void setRawSandwichFunctionName(name);
+    }, [setRawSandwichFunctionName]);
+    const [flamechartDimension, setStoreFlamechartDimension] = useQueryState('flamechart_dimension', flamechartDimensionParser.withDefault([]));
     const resetFlameGraphState = useResetFlameGraphState();
-    const batchUpdates = useURLStateBatch();
     const levelsOfProfiling = useMemo(() => [
         FIELD_FUNCTION_NAME,
         FIELD_FUNCTION_FILE_NAME,
@@ -47,47 +41,37 @@ export const useVisualizationState = () => {
         FIELD_MAPPING_FILE,
     ], []);
     const setGroupBy = useCallback((keys) => {
-        setStoreGroupBy(keys);
+        void setStoreGroupBy(keys);
     }, [setStoreGroupBy]);
     const toggleGroupBy = useCallback((key) => {
-        // Batch updates to combine setGroupBy + resetFlameGraphState into single URL navigation
-        batchUpdates(() => {
-            if (groupBy.includes(key)) {
-                setGroupBy(groupBy.filter(v => v !== key)); // remove
-            }
-            else {
-                const filteredGroupBy = groupBy.filter(item => !levelsOfProfiling.includes(item));
-                setGroupBy([...filteredGroupBy, key]); // add
-            }
-            resetFlameGraphState();
-        });
-    }, [groupBy, setGroupBy, levelsOfProfiling, resetFlameGraphState, batchUpdates]);
+        if (groupBy.includes(key)) {
+            setGroupBy(groupBy.filter(v => v !== key));
+        }
+        else {
+            const filteredGroupBy = groupBy.filter(item => !levelsOfProfiling.includes(item));
+            setGroupBy([...filteredGroupBy, key]);
+        }
+        resetFlameGraphState();
+    }, [groupBy, setGroupBy, levelsOfProfiling, resetFlameGraphState]);
     const setGroupByLabels = useCallback((labels) => {
-        // Batch updates to combine setGroupBy + resetFlameGraphState into single URL navigation
-        batchUpdates(() => {
-            setGroupBy(groupBy.filter(l => !l.startsWith(`${FIELD_LABELS}.`)).concat(labels));
-            resetFlameGraphState();
-        });
-    }, [groupBy, setGroupBy, resetFlameGraphState, batchUpdates]);
+        setGroupBy(groupBy.filter(l => !l.startsWith(`${FIELD_LABELS}.`)).concat(labels));
+        resetFlameGraphState();
+    }, [groupBy, setGroupBy, resetFlameGraphState]);
     const setFlamechartDimension = useCallback((labels) => {
-        setStoreFlamechartDimension(labels.filter(l => l.startsWith(`${FIELD_LABELS}.`)));
+        void setStoreFlamechartDimension(labels.filter(l => l.startsWith(`${FIELD_LABELS}.`)));
     }, [setStoreFlamechartDimension]);
     const resetSandwichFunctionName = useCallback(() => {
-        setSandwichFunctionName(undefined);
+        setSandwichFunctionName(null);
     }, [setSandwichFunctionName]);
-    const setColorBy = useCallback((value) => {
-        setStoreColorBy(value);
-        setColorByPreference(value);
-    }, [setStoreColorBy, setColorByPreference]);
     const setAlignFunctionName = useCallback((value) => {
-        setStoreAlignFunctionName(value);
+        void setStoreAlignFunctionName(value);
         setAlignFunctionNamePreference(value);
     }, [setStoreAlignFunctionName, setAlignFunctionNamePreference]);
     return {
         curPathArrow,
         setCurPathArrow,
         colorStackLegend,
-        colorBy: colorBy ?? '',
+        colorBy,
         setColorBy,
         groupBy,
         setGroupBy,
@@ -98,7 +82,7 @@ export const useVisualizationState = () => {
         sandwichFunctionName,
         setSandwichFunctionName,
         resetSandwichFunctionName,
-        alignFunctionName: alignFunctionName ?? 'left',
+        alignFunctionName,
         setAlignFunctionName,
     };
 };

package/dist/ProfileViewWithData.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAkB1E,OAAO,EAAsB,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAOnE,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,wBAAwB,CAAC,EAAE,MAAM,IAAI,CAAC;CACvC;AAED,eAAO,MAAM,mBAAmB,GAAI,sFAKjC,wBAAwB,KAAG,GAAG,CAAC,OA4UjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAW1E,OAAO,EAAsB,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAenE,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,wBAAwB,CAAC,EAAE,MAAM,IAAI,CAAC;CACvC;AAED,eAAO,MAAM,mBAAmB,GAAI,sFAKjC,wBAAwB,KAAG,GAAG,CAAC,OAmUjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}