@parca/profile 0.19.140 → 0.19.143

package/dist/ProfileView/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+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.
@@ -11,6 +11,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // 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 { KeyDownProvider, useParcaContext } from '@parca/components';
 import { useContainerDimensions } from '@parca/hooks';
 import { selectQueryParam } from '@parca/utilities';
@@ -18,55 +19,392 @@ import ColorStackLegend from './components/ColorStackLegend';
 import { getDashboardItem } from './components/DashboardItems';
 import { DashboardLayout } from './components/DashboardLayout';
 import { ProfileHeader } from './components/ProfileHeader';
-import { FlameGraphToolbar, SandwichFlameGraphToolbar, TableToolbar, VisualisationToolbar, } from './components/Toolbars';
+import { FlameGraphToolbar, SandwichFlameGraphToolbar, TableToolbar, VisualisationToolbar } from './components/Toolbars';
 import { DashboardProvider } from './context/DashboardContext';
 import { ProfileViewContextProvider } from './context/ProfileViewContext';
 import { useAutoSelectDimension } from './hooks/useAutoSelectDimension';
 import { useProfileMetadata } from './hooks/useProfileMetadata';
 import { useVisualizationState } from './hooks/useVisualizationState';
-export const ProfileView = ({ total, filtered, flamegraphData, samplesData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, onSwitchToFifteenMinutes, }) => {
-    const { timezone, perf, profileViewExternalMainActions, preferencesModal, profileViewExternalSubActions, } = useParcaContext();
-    const { ref, dimensions } = useContainerDimensions();
-    const { curPathArrow, setCurPathArrow, colorStackLegend, colorBy, setColorBy, groupBy, toggleGroupBy, setGroupByLabels, flamechartDimension, setFlamechartDimension, sandwichFunctionName, resetSandwichFunctionName, alignFunctionName, setAlignFunctionName, } = useVisualizationState();
-    useAutoSelectDimension(flamegraphData.metadataLabels, flamechartDimension, setFlamechartDimension, profileSource?.ProfileType());
-    const { colorMappings } = useProfileMetadata({
-        flamegraphArrow: flamegraphData.arrow,
-        metadataMappingFiles: flamegraphData.metadataMappingFiles,
-        metadataLoading: flamegraphData.metadataLoading,
-        colorBy,
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var ProfileView = function ProfileView(t0) {
+  var $ = _c(105);
+  var total = t0.total,
+    filtered = t0.filtered,
+    flamegraphData = t0.flamegraphData,
+    samplesData = t0.samplesData,
+    topTableData = t0.topTableData,
+    sourceData = t0.sourceData,
+    profileSource = t0.profileSource,
+    queryClient = t0.queryClient,
+    onDownloadPProf = t0.onDownloadPProf,
+    pprofDownloading = t0.pprofDownloading,
+    compare = t0.compare,
+    showVisualizationSelector = t0.showVisualizationSelector,
+    sandwichData = t0.sandwichData,
+    onSwitchToFifteenMinutes = t0.onSwitchToFifteenMinutes;
+  var _useParcaContext = useParcaContext(),
+    timezone = _useParcaContext.timezone,
+    perf = _useParcaContext.perf,
+    profileViewExternalMainActions = _useParcaContext.profileViewExternalMainActions,
+    preferencesModal = _useParcaContext.preferencesModal,
+    profileViewExternalSubActions = _useParcaContext.profileViewExternalSubActions;
+  var _useContainerDimensio = useContainerDimensions(),
+    ref = _useContainerDimensio.ref,
+    dimensions = _useContainerDimensio.dimensions;
+  var _useVisualizationStat = useVisualizationState(),
+    curPathArrow = _useVisualizationStat.curPathArrow,
+    setCurPathArrow = _useVisualizationStat.setCurPathArrow,
+    colorStackLegend = _useVisualizationStat.colorStackLegend,
+    colorBy = _useVisualizationStat.colorBy,
+    setColorBy = _useVisualizationStat.setColorBy,
+    groupBy = _useVisualizationStat.groupBy,
+    toggleGroupBy = _useVisualizationStat.toggleGroupBy,
+    setGroupByLabels = _useVisualizationStat.setGroupByLabels,
+    flamechartDimension = _useVisualizationStat.flamechartDimension,
+    setFlamechartDimension = _useVisualizationStat.setFlamechartDimension,
+    sandwichFunctionName = _useVisualizationStat.sandwichFunctionName,
+    resetSandwichFunctionName = _useVisualizationStat.resetSandwichFunctionName,
+    alignFunctionName = _useVisualizationStat.alignFunctionName,
+    setAlignFunctionName = _useVisualizationStat.setAlignFunctionName;
+  var t1;
+  if ($[0] !== profileSource) {
+    t1 = profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType();
+    $[0] = profileSource;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  useAutoSelectDimension(flamegraphData.metadataLabels, flamechartDimension, setFlamechartDimension, t1);
+  var t2;
+  if ($[2] !== colorBy || $[3] !== flamegraphData.arrow || $[4] !== flamegraphData.metadataLoading || $[5] !== flamegraphData.metadataMappingFiles) {
+    t2 = {
+      flamegraphArrow: flamegraphData.arrow,
+      metadataMappingFiles: flamegraphData.metadataMappingFiles,
+      metadataLoading: flamegraphData.metadataLoading,
+      colorBy: colorBy
+    };
+    $[2] = colorBy;
+    $[3] = flamegraphData.arrow;
+    $[4] = flamegraphData.metadataLoading;
+    $[5] = flamegraphData.metadataMappingFiles;
+    $[6] = t2;
+  } else {
+    t2 = $[6];
+  }
+  var _useProfileMetadata = useProfileMetadata(t2),
+    colorMappings = _useProfileMetadata.colorMappings;
+  var isColorStackLegendEnabled = colorStackLegend === "true";
+  var t3;
+  if ($[7] !== compare) {
+    t3 = compare === true || selectQueryParam("compare_a") === "true" && selectQueryParam("compare_b") === "true";
+    $[7] = compare;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  var compareMode = t3;
+  var t4;
+  if ($[9] !== curPathArrow || $[10] !== dimensions || $[11] !== filtered || $[12] !== flamegraphData || $[13] !== onSwitchToFifteenMinutes || $[14] !== perf || $[15] !== profileSource || $[16] !== queryClient || $[17] !== samplesData || $[18] !== sandwichData || $[19] !== setCurPathArrow || $[20] !== sourceData || $[21] !== topTableData || $[22] !== total) {
+    t4 = function t4(t5) {
+      var type = t5.type,
+        isHalfScreen = t5.isHalfScreen;
+      return getDashboardItem({
+        sandwichData: sandwichData,
+        type: type,
+        isHalfScreen: isHalfScreen,
+        dimensions: dimensions,
+        flamegraphData: flamegraphData,
+        samplesData: samplesData,
+        topTableData: topTableData,
+        sourceData: sourceData,
+        profileSource: profileSource,
+        total: total,
+        filtered: filtered,
+        curPathArrow: curPathArrow,
+        setNewCurPathArrow: setCurPathArrow,
+        perf: perf,
+        queryClient: queryClient,
+        onSwitchToFifteenMinutes: onSwitchToFifteenMinutes
+      });
+    };
+    $[9] = curPathArrow;
+    $[10] = dimensions;
+    $[11] = filtered;
+    $[12] = flamegraphData;
+    $[13] = onSwitchToFifteenMinutes;
+    $[14] = perf;
+    $[15] = profileSource;
+    $[16] = queryClient;
+    $[17] = samplesData;
+    $[18] = sandwichData;
+    $[19] = setCurPathArrow;
+    $[20] = sourceData;
+    $[21] = topTableData;
+    $[22] = total;
+    $[23] = t4;
+  } else {
+    t4 = $[23];
+  }
+  var getDashboardItemByType = t4;
+  var t5;
+  if ($[24] !== curPathArrow || $[25] !== setCurPathArrow) {
+    t5 = /*#__PURE__*/_jsx(FlameGraphToolbar, {
+      curPath: curPathArrow,
+      setNewCurPath: setCurPathArrow
     });
-    const isColorStackLegendEnabled = colorStackLegend === 'true';
-    const compareMode = compare === true ||
-        (selectQueryParam('compare_a') === 'true' && selectQueryParam('compare_b') === 'true');
-    const getDashboardItemByType = ({ type, isHalfScreen, }) => {
-        return getDashboardItem({
-            sandwichData,
-            type,
-            isHalfScreen,
-            dimensions,
-            flamegraphData,
-            samplesData,
-            topTableData,
-            sourceData,
-            profileSource,
-            total,
-            filtered,
-            curPathArrow,
-            setNewCurPathArrow: setCurPathArrow,
-            perf,
-            queryClient,
-            onSwitchToFifteenMinutes,
-        });
+    $[24] = curPathArrow;
+    $[25] = setCurPathArrow;
+    $[26] = t5;
+  } else {
+    t5 = $[26];
+  }
+  var t6;
+  if ($[27] !== profileSource) {
+    t6 = profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType();
+    $[27] = profileSource;
+    $[28] = t6;
+  } else {
+    t6 = $[28];
+  }
+  var t7;
+  if ($[29] !== filtered || $[30] !== t6 || $[31] !== total) {
+    t7 = /*#__PURE__*/_jsx(TableToolbar, {
+      profileType: t6,
+      total: total,
+      filtered: filtered
+    });
+    $[29] = filtered;
+    $[30] = t6;
+    $[31] = total;
+    $[32] = t7;
+  } else {
+    t7 = $[32];
+  }
+  var t8;
+  if ($[33] !== resetSandwichFunctionName || $[34] !== sandwichFunctionName) {
+    t8 = /*#__PURE__*/_jsx(SandwichFlameGraphToolbar, {
+      resetSandwichFunctionName: resetSandwichFunctionName,
+      sandwichFunctionName: sandwichFunctionName
+    });
+    $[33] = resetSandwichFunctionName;
+    $[34] = sandwichFunctionName;
+    $[35] = t8;
+  } else {
+    t8 = $[35];
+  }
+  var t9;
+  if ($[36] !== t5 || $[37] !== t7 || $[38] !== t8) {
+    t9 = {
+      flame: t5,
+      table: t7,
+      sandwich: t8
+    };
+    $[36] = t5;
+    $[37] = t7;
+    $[38] = t8;
+    $[39] = t9;
+  } else {
+    t9 = $[39];
+  }
+  var actionButtons = t9;
+  var t10;
+  if ($[40] !== profileSource || $[41] !== timezone) {
+    t10 = profileSource !== undefined && profileSource.toString(timezone) !== "";
+    $[40] = profileSource;
+    $[41] = timezone;
+    $[42] = t10;
+  } else {
+    t10 = $[42];
+  }
+  var hasProfileSource = t10;
+  var t11;
+  if ($[43] !== compareMode || $[44] !== profileSource) {
+    t11 = {
+      profileSource: profileSource,
+      compareMode: compareMode
     };
-    const actionButtons = {
-        flame: _jsx(FlameGraphToolbar, { curPath: curPathArrow, setNewCurPath: setCurPathArrow }),
-        table: (_jsx(TableToolbar, { profileType: profileSource?.ProfileType(), total: total, filtered: filtered })),
-        sandwich: (_jsx(SandwichFlameGraphToolbar, { resetSandwichFunctionName: resetSandwichFunctionName, sandwichFunctionName: sandwichFunctionName })),
+    $[43] = compareMode;
+    $[44] = profileSource;
+    $[45] = t11;
+  } else {
+    t11 = $[45];
+  }
+  var t12;
+  if ($[46] !== profileSource || $[47] !== timezone) {
+    t12 = profileSource === null || profileSource === void 0 ? void 0 : profileSource.toString(timezone);
+    $[46] = profileSource;
+    $[47] = timezone;
+    $[48] = t12;
+  } else {
+    t12 = $[48];
+  }
+  var t13;
+  if ($[49] !== hasProfileSource || $[50] !== profileViewExternalMainActions || $[51] !== t12) {
+    t13 = /*#__PURE__*/_jsx(ProfileHeader, {
+      profileSourceString: t12,
+      hasProfileSource: hasProfileSource,
+      externalMainActions: profileViewExternalMainActions
+    });
+    $[49] = hasProfileSource;
+    $[50] = profileViewExternalMainActions;
+    $[51] = t12;
+    $[52] = t13;
+  } else {
+    t13 = $[52];
+  }
+  var t14;
+  if ($[53] !== profileSource) {
+    t14 = profileSource === null || profileSource === void 0 ? void 0 : profileSource.ProfileType();
+    $[53] = profileSource;
+    $[54] = t14;
+  } else {
+    t14 = $[54];
+  }
+  var t15;
+  if ($[55] !== flamegraphData.metadataLabels) {
+    var _flamegraphData$metad;
+    t15 = (_flamegraphData$metad = flamegraphData.metadataLabels) !== null && _flamegraphData$metad !== void 0 ? _flamegraphData$metad : [];
+    $[55] = flamegraphData.metadataLabels;
+    $[56] = t15;
+  } else {
+    t15 = $[56];
+  }
+  var t16;
+  if ($[57] !== flamegraphData.metadataLoading || $[58] !== flamegraphData.metadataRefetch || $[59] !== t15) {
+    t16 = {
+      labels: t15,
+      refetch: flamegraphData.metadataRefetch,
+      loading: flamegraphData.metadataLoading
     };
-    const hasProfileSource = profileSource !== undefined && profileSource.toString(timezone) !== '';
-    return (_jsx(KeyDownProvider, { children: _jsx(ProfileViewContextProvider, { value: { profileSource, compareMode }, children: _jsxs(DashboardProvider, { children: [_jsx(ProfileHeader, { profileSourceString: profileSource?.toString(timezone), hasProfileSource: hasProfileSource, externalMainActions: profileViewExternalMainActions }), _jsx(VisualisationToolbar, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, hasProfileSource: hasProfileSource, pprofdownloading: pprofDownloading, profileSource: profileSource, queryClient: queryClient, onDownloadPProf: onDownloadPProf, curPath: curPathArrow, setNewCurPath: setCurPathArrow, profileType: profileSource?.ProfileType(), total: total, filtered: filtered, metadata: {
-                            labels: flamegraphData.metadataLabels ?? [],
-                            refetch: flamegraphData.metadataRefetch,
-                            loading: flamegraphData.metadataLoading,
-                        }, preferencesModal: preferencesModal, profileViewExternalSubActions: profileViewExternalSubActions, setGroupByLabels: setGroupByLabels, flamechartDimension: flamechartDimension, setFlamechartDimension: setFlamechartDimension, showVisualizationSelector: showVisualizationSelector, sandwichFunctionName: sandwichFunctionName, alignFunctionName: alignFunctionName, setAlignFunctionName: setAlignFunctionName, colorBy: colorBy, setColorBy: setColorBy }), isColorStackLegendEnabled && (_jsx(ColorStackLegend, { compareMode: compareMode, mappings: colorMappings, loading: flamegraphData.metadataLoading })), _jsx("div", { className: "w-full", ref: ref, children: _jsx(DashboardLayout, { getDashboardItemByType: getDashboardItemByType, actionButtons: actionButtons }) })] }) }) }));
-};
+    $[57] = flamegraphData.metadataLoading;
+    $[58] = flamegraphData.metadataRefetch;
+    $[59] = t15;
+    $[60] = t16;
+  } else {
+    t16 = $[60];
+  }
+  var t17;
+  if ($[61] !== alignFunctionName || $[62] !== colorBy || $[63] !== curPathArrow || $[64] !== filtered || $[65] !== flamechartDimension || $[66] !== groupBy || $[67] !== hasProfileSource || $[68] !== onDownloadPProf || $[69] !== pprofDownloading || $[70] !== preferencesModal || $[71] !== profileSource || $[72] !== profileViewExternalSubActions || $[73] !== queryClient || $[74] !== sandwichFunctionName || $[75] !== setAlignFunctionName || $[76] !== setColorBy || $[77] !== setCurPathArrow || $[78] !== setFlamechartDimension || $[79] !== setGroupByLabels || $[80] !== showVisualizationSelector || $[81] !== t14 || $[82] !== t16 || $[83] !== toggleGroupBy || $[84] !== total) {
+    t17 = /*#__PURE__*/_jsx(VisualisationToolbar, {
+      groupBy: groupBy,
+      toggleGroupBy: toggleGroupBy,
+      hasProfileSource: hasProfileSource,
+      pprofdownloading: pprofDownloading,
+      profileSource: profileSource,
+      queryClient: queryClient,
+      onDownloadPProf: onDownloadPProf,
+      curPath: curPathArrow,
+      setNewCurPath: setCurPathArrow,
+      profileType: t14,
+      total: total,
+      filtered: filtered,
+      metadata: t16,
+      preferencesModal: preferencesModal,
+      profileViewExternalSubActions: profileViewExternalSubActions,
+      setGroupByLabels: setGroupByLabels,
+      flamechartDimension: flamechartDimension,
+      setFlamechartDimension: setFlamechartDimension,
+      showVisualizationSelector: showVisualizationSelector,
+      sandwichFunctionName: sandwichFunctionName,
+      alignFunctionName: alignFunctionName,
+      setAlignFunctionName: setAlignFunctionName,
+      colorBy: colorBy,
+      setColorBy: setColorBy
+    });
+    $[61] = alignFunctionName;
+    $[62] = colorBy;
+    $[63] = curPathArrow;
+    $[64] = filtered;
+    $[65] = flamechartDimension;
+    $[66] = groupBy;
+    $[67] = hasProfileSource;
+    $[68] = onDownloadPProf;
+    $[69] = pprofDownloading;
+    $[70] = preferencesModal;
+    $[71] = profileSource;
+    $[72] = profileViewExternalSubActions;
+    $[73] = queryClient;
+    $[74] = sandwichFunctionName;
+    $[75] = setAlignFunctionName;
+    $[76] = setColorBy;
+    $[77] = setCurPathArrow;
+    $[78] = setFlamechartDimension;
+    $[79] = setGroupByLabels;
+    $[80] = showVisualizationSelector;
+    $[81] = t14;
+    $[82] = t16;
+    $[83] = toggleGroupBy;
+    $[84] = total;
+    $[85] = t17;
+  } else {
+    t17 = $[85];
+  }
+  var t18;
+  if ($[86] !== colorMappings || $[87] !== compareMode || $[88] !== flamegraphData.metadataLoading || $[89] !== isColorStackLegendEnabled) {
+    t18 = isColorStackLegendEnabled && /*#__PURE__*/_jsx(ColorStackLegend, {
+      compareMode: compareMode,
+      mappings: colorMappings,
+      loading: flamegraphData.metadataLoading
+    });
+    $[86] = colorMappings;
+    $[87] = compareMode;
+    $[88] = flamegraphData.metadataLoading;
+    $[89] = isColorStackLegendEnabled;
+    $[90] = t18;
+  } else {
+    t18 = $[90];
+  }
+  var t19;
+  if ($[91] !== actionButtons || $[92] !== getDashboardItemByType) {
+    t19 = /*#__PURE__*/_jsx(DashboardLayout, {
+      getDashboardItemByType: getDashboardItemByType,
+      actionButtons: actionButtons
+    });
+    $[91] = actionButtons;
+    $[92] = getDashboardItemByType;
+    $[93] = t19;
+  } else {
+    t19 = $[93];
+  }
+  var t20;
+  if ($[94] !== ref || $[95] !== t19) {
+    t20 = /*#__PURE__*/_jsx("div", {
+      className: "w-full",
+      ref: ref,
+      children: t19
+    });
+    $[94] = ref;
+    $[95] = t19;
+    $[96] = t20;
+  } else {
+    t20 = $[96];
+  }
+  var t21;
+  if ($[97] !== t13 || $[98] !== t17 || $[99] !== t18 || $[100] !== t20) {
+    t21 = /*#__PURE__*/_jsxs(DashboardProvider, {
+      children: [t13, t17, t18, t20]
+    });
+    $[97] = t13;
+    $[98] = t17;
+    $[99] = t18;
+    $[100] = t20;
+    $[101] = t21;
+  } else {
+    t21 = $[101];
+  }
+  var t22;
+  if ($[102] !== t11 || $[103] !== t21) {
+    t22 = /*#__PURE__*/_jsx(KeyDownProvider, {
+      children: /*#__PURE__*/_jsx(ProfileViewContextProvider, {
+        value: t11,
+        children: t21
+      })
+    });
+    $[102] = t11;
+    $[103] = t21;
+    $[104] = t22;
+  } else {
+    t22 = $[104];
+  }
+  return t22;
+};

package/dist/ProfileView/types/visualization.js

@@ -1,13 +1 @@
-// 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.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// 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.
-export {};
+export {};

package/dist/ProfileView/utils/colorUtils.js

@@ -10,12 +10,13 @@
 // 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 { scaleLinear } from 'd3';
-export const getColorRange = (isDarkMode) => {
-    const maxColor = getNewSpanColor(isDarkMode);
-    const minColor = scaleLinear([isDarkMode ? 'black' : 'white', maxColor])(0.3);
-    return [minColor, maxColor];
-};
-export const getNewSpanColor = (isDarkMode) => {
-    return isDarkMode ? '#4F46E5' : '#4338CA'; // Example colors - adjust as needed
+export var getColorRange = function getColorRange(isDarkMode) {
+  var maxColor = getNewSpanColor(isDarkMode);
+  var minColor = scaleLinear([isDarkMode ? 'black' : 'white', maxColor])(0.3);
+  return [minColor, maxColor];
 };
+export var getNewSpanColor = function getNewSpanColor(isDarkMode) {
+  return isDarkMode ? '#4F46E5' : '#4338CA'; // Example colors - adjust as needed
+};