@parca/profile 0.19.140 → 0.19.142

package/dist/ProfileView/hooks/useVisualizationState.js

@@ -1,3 +1,14 @@
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+import { c as _c } from "react-compiler-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -10,79 +21,259 @@
 // 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 } from 'react';
-import { useQueryState } from 'nuqs';
+import { JSONParser, JSONSerializer, useURLState, useURLStateBatch, useURLStateCustom } from '@parca/components';
 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 { 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 [alignFunctionNamePreference, setAlignFunctionNamePreference] = useUserPreference(USER_PREFERENCES.ALIGN_FUNCTION_NAME.key);
-    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 levelsOfProfiling = useMemo(() => [
-        FIELD_FUNCTION_NAME,
-        FIELD_FUNCTION_FILE_NAME,
-        FIELD_LOCATION_ADDRESS,
-        FIELD_MAPPING_FILE,
-    ], []);
-    const setGroupBy = useCallback((keys) => {
-        void setStoreGroupBy(keys);
-    }, [setStoreGroupBy]);
-    const toggleGroupBy = useCallback((key) => {
+export var useVisualizationState = function useVisualizationState() {
+  var _ref, _ref2;
+  var $ = _c(47);
+  var _useUserPreference = useUserPreference(USER_PREFERENCES.COLOR_BY.key),
+    _useUserPreference2 = _slicedToArray(_useUserPreference, 2),
+    colorByPreference = _useUserPreference2[0],
+    setColorByPreference = _useUserPreference2[1];
+  var _useUserPreference3 = useUserPreference(USER_PREFERENCES.ALIGN_FUNCTION_NAME.key),
+    _useUserPreference4 = _slicedToArray(_useUserPreference3, 2),
+    alignFunctionNamePreference = _useUserPreference4[0],
+    setAlignFunctionNamePreference = _useUserPreference4[1];
+  var t0;
+  if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t0 = {
+      parse: JSONParser,
+      stringify: JSONSerializer,
+      defaultValue: "[]"
+    };
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  var _useURLStateCustom = useURLStateCustom("cur_path", t0),
+    _useURLStateCustom2 = _slicedToArray(_useURLStateCustom, 2),
+    curPathArrow = _useURLStateCustom2[0],
+    setCurPathArrow = _useURLStateCustom2[1];
+  var _useURLState = useURLState("color_stack_legend"),
+    _useURLState2 = _slicedToArray(_useURLState, 1),
+    colorStackLegend = _useURLState2[0];
+  var t1;
+  if ($[1] !== colorByPreference) {
+    t1 = {
+      defaultValue: colorByPreference
+    };
+    $[1] = colorByPreference;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  var _useURLState3 = useURLState("color_by", t1),
+    _useURLState4 = _slicedToArray(_useURLState3, 2),
+    colorBy = _useURLState4[0],
+    setStoreColorBy = _useURLState4[1];
+  var t2;
+  if ($[3] !== alignFunctionNamePreference) {
+    t2 = {
+      defaultValue: alignFunctionNamePreference
+    };
+    $[3] = alignFunctionNamePreference;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  var _useURLState5 = useURLState("align_function_name", t2),
+    _useURLState6 = _slicedToArray(_useURLState5, 2),
+    alignFunctionName = _useURLState6[0],
+    setStoreAlignFunctionName = _useURLState6[1];
+  var t3;
+  if ($[5] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t3 = {
+      defaultValue: [FIELD_FUNCTION_NAME],
+      alwaysReturnArray: true
+    };
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  var _useURLState7 = useURLState("group_by", t3),
+    _useURLState8 = _slicedToArray(_useURLState7, 2),
+    groupBy = _useURLState8[0],
+    setStoreGroupBy = _useURLState8[1];
+  var _useURLState9 = useURLState("sandwich_function_name"),
+    _useURLState0 = _slicedToArray(_useURLState9, 2),
+    sandwichFunctionName = _useURLState0[0],
+    setSandwichFunctionName = _useURLState0[1];
+  var t4;
+  if ($[6] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t4 = {
+      alwaysReturnArray: true
+    };
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  var _useURLState1 = useURLState("flamechart_dimension", t4),
+    _useURLState10 = _slicedToArray(_useURLState1, 2),
+    flamechartDimension = _useURLState10[0],
+    setStoreFlamechartDimension = _useURLState10[1];
+  var resetFlameGraphState = useResetFlameGraphState();
+  var batchUpdates = useURLStateBatch();
+  var t5;
+  if ($[7] === Symbol["for"]("react.memo_cache_sentinel")) {
+    t5 = [FIELD_FUNCTION_NAME, FIELD_FUNCTION_FILE_NAME, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE];
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  var levelsOfProfiling = t5;
+  var t6;
+  if ($[8] !== setStoreGroupBy) {
+    t6 = function t6(keys) {
+      setStoreGroupBy(keys);
+    };
+    $[8] = setStoreGroupBy;
+    $[9] = t6;
+  } else {
+    t6 = $[9];
+  }
+  var setGroupBy = t6;
+  var t7;
+  if ($[10] !== batchUpdates || $[11] !== groupBy || $[12] !== resetFlameGraphState || $[13] !== setGroupBy) {
+    t7 = function t7(key) {
+      batchUpdates(function () {
         if (groupBy.includes(key)) {
-            setGroupBy(groupBy.filter(v => v !== key));
-        }
-        else {
-            const filteredGroupBy = groupBy.filter(item => !levelsOfProfiling.includes(item));
-            setGroupBy([...filteredGroupBy, key]);
+          setGroupBy(groupBy.filter(function (v) {
+            return v !== key;
+          }));
+        } else {
+          var filteredGroupBy = groupBy.filter(function (item) {
+            return !levelsOfProfiling.includes(item);
+          });
+          setGroupBy([].concat(_toConsumableArray(filteredGroupBy), [key]));
         }
         resetFlameGraphState();
-    }, [groupBy, setGroupBy, levelsOfProfiling, resetFlameGraphState]);
-    const setGroupByLabels = useCallback((labels) => {
-        setGroupBy(groupBy.filter(l => !l.startsWith(`${FIELD_LABELS}.`)).concat(labels));
+      });
+    };
+    $[10] = batchUpdates;
+    $[11] = groupBy;
+    $[12] = resetFlameGraphState;
+    $[13] = setGroupBy;
+    $[14] = t7;
+  } else {
+    t7 = $[14];
+  }
+  var toggleGroupBy = t7;
+  var t8;
+  if ($[15] !== batchUpdates || $[16] !== groupBy || $[17] !== resetFlameGraphState || $[18] !== setGroupBy) {
+    t8 = function t8(labels) {
+      batchUpdates(function () {
+        setGroupBy(groupBy.filter(_temp).concat(labels));
         resetFlameGraphState();
-    }, [groupBy, setGroupBy, resetFlameGraphState]);
-    const setFlamechartDimension = useCallback((labels) => {
-        void setStoreFlamechartDimension(labels.filter(l => l.startsWith(`${FIELD_LABELS}.`)));
-    }, [setStoreFlamechartDimension]);
-    const resetSandwichFunctionName = useCallback(() => {
-        setSandwichFunctionName(null);
-    }, [setSandwichFunctionName]);
-    const setAlignFunctionName = useCallback((value) => {
-        void setStoreAlignFunctionName(value);
-        setAlignFunctionNamePreference(value);
-    }, [setStoreAlignFunctionName, setAlignFunctionNamePreference]);
-    return {
-        curPathArrow,
-        setCurPathArrow,
-        colorStackLegend,
-        colorBy,
-        setColorBy,
-        groupBy,
-        setGroupBy,
-        toggleGroupBy,
-        setGroupByLabels,
-        flamechartDimension,
-        setFlamechartDimension,
-        sandwichFunctionName,
-        setSandwichFunctionName,
-        resetSandwichFunctionName,
-        alignFunctionName,
-        setAlignFunctionName,
+      });
+    };
+    $[15] = batchUpdates;
+    $[16] = groupBy;
+    $[17] = resetFlameGraphState;
+    $[18] = setGroupBy;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  var setGroupByLabels = t8;
+  var t9;
+  if ($[20] !== setStoreFlamechartDimension) {
+    t9 = function t9(labels_0) {
+      setStoreFlamechartDimension(labels_0.filter(_temp2));
+    };
+    $[20] = setStoreFlamechartDimension;
+    $[21] = t9;
+  } else {
+    t9 = $[21];
+  }
+  var setFlamechartDimension = t9;
+  var t10;
+  if ($[22] !== setSandwichFunctionName) {
+    t10 = function t10() {
+      setSandwichFunctionName(undefined);
+    };
+    $[22] = setSandwichFunctionName;
+    $[23] = t10;
+  } else {
+    t10 = $[23];
+  }
+  var resetSandwichFunctionName = t10;
+  var t11;
+  if ($[24] !== setColorByPreference || $[25] !== setStoreColorBy) {
+    t11 = function t11(value) {
+      setStoreColorBy(value);
+      setColorByPreference(value);
+    };
+    $[24] = setColorByPreference;
+    $[25] = setStoreColorBy;
+    $[26] = t11;
+  } else {
+    t11 = $[26];
+  }
+  var setColorBy = t11;
+  var t12;
+  if ($[27] !== setAlignFunctionNamePreference || $[28] !== setStoreAlignFunctionName) {
+    t12 = function t12(value_0) {
+      setStoreAlignFunctionName(value_0);
+      setAlignFunctionNamePreference(value_0);
+    };
+    $[27] = setAlignFunctionNamePreference;
+    $[28] = setStoreAlignFunctionName;
+    $[29] = t12;
+  } else {
+    t12 = $[29];
+  }
+  var setAlignFunctionName = t12;
+  var t13 = (_ref = colorBy) !== null && _ref !== void 0 ? _ref : "";
+  var t14 = (_ref2 = alignFunctionName) !== null && _ref2 !== void 0 ? _ref2 : "left";
+  var t15;
+  if ($[30] !== colorStackLegend || $[31] !== curPathArrow || $[32] !== flamechartDimension || $[33] !== groupBy || $[34] !== resetSandwichFunctionName || $[35] !== sandwichFunctionName || $[36] !== setAlignFunctionName || $[37] !== setColorBy || $[38] !== setCurPathArrow || $[39] !== setFlamechartDimension || $[40] !== setGroupBy || $[41] !== setGroupByLabels || $[42] !== setSandwichFunctionName || $[43] !== t13 || $[44] !== t14 || $[45] !== toggleGroupBy) {
+    t15 = {
+      curPathArrow: curPathArrow,
+      setCurPathArrow: setCurPathArrow,
+      colorStackLegend: colorStackLegend,
+      colorBy: t13,
+      setColorBy: setColorBy,
+      groupBy: groupBy,
+      setGroupBy: setGroupBy,
+      toggleGroupBy: toggleGroupBy,
+      setGroupByLabels: setGroupByLabels,
+      flamechartDimension: flamechartDimension,
+      setFlamechartDimension: setFlamechartDimension,
+      sandwichFunctionName: sandwichFunctionName,
+      setSandwichFunctionName: setSandwichFunctionName,
+      resetSandwichFunctionName: resetSandwichFunctionName,
+      alignFunctionName: t14,
+      setAlignFunctionName: setAlignFunctionName
     };
+    $[30] = colorStackLegend;
+    $[31] = curPathArrow;
+    $[32] = flamechartDimension;
+    $[33] = groupBy;
+    $[34] = resetSandwichFunctionName;
+    $[35] = sandwichFunctionName;
+    $[36] = setAlignFunctionName;
+    $[37] = setColorBy;
+    $[38] = setCurPathArrow;
+    $[39] = setFlamechartDimension;
+    $[40] = setGroupBy;
+    $[41] = setGroupByLabels;
+    $[42] = setSandwichFunctionName;
+    $[43] = t13;
+    $[44] = t14;
+    $[45] = toggleGroupBy;
+    $[46] = t15;
+  } else {
+    t15 = $[46];
+  }
+  return t15;
 };
+function _temp(l) {
+  return !l.startsWith("".concat(FIELD_LABELS, "."));
+}
+function _temp2(l_0) {
+  return l_0.startsWith("".concat(FIELD_LABELS, "."));
+}