@parca/profile 0.19.16 → 0.19.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/GraphTooltipArrow/Content.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/DockedGraphTooltip/index.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/ExpandOnHoverValue.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/index.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/useGraphTooltip/index.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/useGraphTooltip/index.js +2 -2
- package/dist/GraphTooltipArrow/useGraphTooltipMetaInfo/index.d.ts.map +1 -1
- package/dist/GraphTooltipArrow/useGraphTooltipMetaInfo/index.js +2 -2
- package/dist/MatchersInput/SuggestionItem.d.ts.map +1 -1
- package/dist/MatchersInput/SuggestionsList.d.ts.map +1 -1
- package/dist/MatchersInput/index.d.ts.map +1 -1
- package/dist/MetricsCircle/index.d.ts.map +1 -1
- package/dist/MetricsGraph/MetricsContextMenu/index.d.ts.map +1 -1
- package/dist/MetricsGraph/MetricsInfoPanel/index.d.ts.map +1 -1
- package/dist/MetricsGraph/MetricsTooltip/index.d.ts.map +1 -1
- package/dist/MetricsGraph/UtilizationMetrics/Throughput.d.ts.map +1 -1
- package/dist/MetricsGraph/UtilizationMetrics/index.d.ts.map +1 -1
- package/dist/MetricsGraph/index.d.ts.map +1 -1
- package/dist/MetricsGraph/useMetricsGraphDimensions.d.ts.map +1 -1
- package/dist/MetricsGraphStrips/AreaGraph/index.d.ts.map +1 -1
- package/dist/MetricsGraphStrips/index.d.ts.map +1 -1
- package/dist/MetricsSeries/index.d.ts.map +1 -1
- package/dist/ProfileExplorer/ProfileExplorerCompare.d.ts.map +1 -1
- package/dist/ProfileExplorer/ProfileExplorerSingle.d.ts.map +1 -1
- package/dist/ProfileExplorer/index.d.ts.map +1 -1
- package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenu.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.d.ts +1 -1
- package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.d.ts} +8 -8
- package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.js → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.js} +14 -14
- package/dist/ProfileFlameGraph/FlameGraphArrow/MemoizedTooltip.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.js +1 -1
- package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.d.ts.map +1 -0
- package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.d.ts +7 -7
- package/dist/ProfileFlameGraph/FlameGraphArrow/index.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.js +38 -12
- package/dist/ProfileFlameGraph/FlameGraphArrow/useMappingList.d.ts.map +1 -0
- package/dist/ProfileFlameGraph/FlameGraphArrow/useNodeColor.d.ts.map +1 -0
- package/dist/ProfileFlameGraph/FlameGraphArrow/utils.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph → ProfileFlameGraph}/index.d.ts +8 -8
- package/dist/ProfileFlameGraph/index.d.ts.map +1 -0
- package/dist/{ProfileIcicleGraph → ProfileFlameGraph}/index.js +33 -33
- package/dist/ProfileMetricsGraph/hooks/useQueryRange.d.ts.map +1 -1
- package/dist/ProfileMetricsGraph/index.d.ts.map +1 -1
- package/dist/ProfileSelector/CompareButton.d.ts.map +1 -1
- package/dist/ProfileSelector/index.d.ts.map +1 -1
- package/dist/ProfileSelector/useAutoQuerySelector.d.ts.map +1 -1
- package/dist/ProfileSelector/useAutoQuerySelector.js +1 -1
- package/dist/ProfileSource.d.ts.map +1 -1
- package/dist/ProfileTypeSelector/index.d.ts.map +1 -1
- package/dist/ProfileView/components/ActionButtons/SortByDropdown.js +1 -1
- package/dist/ProfileView/components/ColorStackLegend.d.ts.map +1 -1
- package/dist/ProfileView/components/ColorStackLegend.js +2 -2
- package/dist/ProfileView/components/DashboardItems/index.d.ts +1 -1
- package/dist/ProfileView/components/DashboardItems/index.d.ts.map +1 -1
- package/dist/ProfileView/components/DashboardItems/index.js +7 -7
- package/dist/ProfileView/components/DashboardLayout/index.d.ts +1 -1
- package/dist/ProfileView/components/DashboardLayout/index.d.ts.map +1 -1
- package/dist/ProfileView/components/DiffLegend.js +1 -1
- package/dist/ProfileView/components/GroupByLabelsDropdown/index.d.ts.map +1 -1
- package/dist/ProfileView/components/GroupByLabelsDropdown/index.js +1 -1
- package/dist/ProfileView/components/ShareButton/ResultBox.d.ts.map +1 -1
- package/dist/ProfileView/components/ShareButton/index.d.ts.map +1 -1
- package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js +1 -1
- package/dist/ProfileView/components/Toolbars/TableColumnsDropdown.d.ts.map +1 -1
- package/dist/ProfileView/components/Toolbars/index.d.ts +5 -5
- package/dist/ProfileView/components/Toolbars/index.d.ts.map +1 -1
- package/dist/ProfileView/components/Toolbars/index.js +4 -4
- package/dist/ProfileView/components/ViewSelector/Dropdown.d.ts +2 -1
- package/dist/ProfileView/components/ViewSelector/Dropdown.d.ts.map +1 -1
- package/dist/ProfileView/components/ViewSelector/Dropdown.js +2 -2
- package/dist/ProfileView/components/ViewSelector/index.d.ts.map +1 -1
- package/dist/ProfileView/components/ViewSelector/index.js +12 -8
- package/dist/ProfileView/components/VisualizationContainer/index.d.ts +1 -1
- package/dist/ProfileView/components/VisualizationContainer/index.d.ts.map +1 -1
- package/dist/ProfileView/components/VisualizationPanel.d.ts +1 -1
- package/dist/ProfileView/components/VisualizationPanel.d.ts.map +1 -1
- package/dist/ProfileView/components/VisualizationPanel.js +1 -1
- package/dist/ProfileView/context/ProfileViewContext.d.ts.map +1 -1
- package/dist/ProfileView/hooks/useProfileMetadata.d.ts.map +1 -1
- package/dist/ProfileView/hooks/useProfileMetadata.js +1 -1
- package/dist/ProfileView/hooks/useVisualizationState.d.ts +1 -1
- package/dist/ProfileView/hooks/useVisualizationState.d.ts.map +1 -1
- package/dist/ProfileView/hooks/useVisualizationState.js +1 -1
- package/dist/ProfileView/index.d.ts.map +1 -1
- package/dist/ProfileView/index.js +3 -3
- package/dist/ProfileView/types/visualization.d.ts +1 -1
- package/dist/ProfileView/types/visualization.d.ts.map +1 -1
- package/dist/ProfileView/utils/colorUtils.d.ts.map +1 -1
- package/dist/ProfileViewWithData.d.ts.map +1 -1
- package/dist/ProfileViewWithData.js +10 -10
- package/dist/Sandwich/components/CalleesSection.d.ts +1 -1
- package/dist/Sandwich/components/CalleesSection.d.ts.map +1 -1
- package/dist/Sandwich/components/CalleesSection.js +3 -3
- package/dist/Sandwich/components/CallersSection.d.ts +1 -1
- package/dist/Sandwich/components/CallersSection.d.ts.map +1 -1
- package/dist/Sandwich/components/CallersSection.js +3 -3
- package/dist/Sandwich/index.d.ts.map +1 -1
- package/dist/Sandwich/index.js +3 -5
- package/dist/Sandwich/utils/processRowData.d.ts +1 -1
- package/dist/Sandwich/utils/processRowData.d.ts.map +1 -1
- package/dist/SimpleMatchers/index.d.ts.map +1 -1
- package/dist/SourceView/Highlighter.d.ts.map +1 -1
- package/dist/SourceView/LineNo.d.ts.map +1 -1
- package/dist/SourceView/lang-detector/index.d.ts.map +1 -1
- package/dist/Table/ColorCell.d.ts.map +1 -1
- package/dist/Table/ColumnsVisibility.d.ts.map +1 -1
- package/dist/Table/MoreDropdown.d.ts.map +1 -1
- package/dist/Table/TableContextMenu.d.ts.map +1 -1
- package/dist/Table/hooks/useColorManagement.js +1 -1
- package/dist/Table/index.js +2 -2
- package/dist/Table/utils/functions.d.ts +1 -1
- package/dist/Table/utils/functions.d.ts.map +1 -1
- package/dist/TimelineGuide/index.d.ts.map +1 -1
- package/dist/TopTable/index.d.ts.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/useDelayedLoader.d.ts.map +1 -1
- package/dist/useGrpcQuery/index.d.ts.map +1 -1
- package/dist/useQuery.d.ts.map +1 -1
- package/dist/useSumBy.d.ts.map +1 -1
- package/dist/utils.d.ts.map +1 -1
- package/package.json +7 -7
- package/src/GraphTooltipArrow/useGraphTooltip/index.ts +2 -2
- package/src/GraphTooltipArrow/useGraphTooltipMetaInfo/index.ts +2 -2
- package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.tsx +1 -1
- package/src/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.tsx → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.tsx} +27 -30
- package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.tsx +1 -1
- package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.tsx +55 -23
- package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-10M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-10M.benchmark.tsx} +2 -2
- package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-1M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-1M.benchmark.tsx} +2 -2
- package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-20M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-20M.benchmark.tsx} +2 -2
- package/src/{ProfileIcicleGraph → ProfileFlameGraph}/index.tsx +57 -57
- package/src/ProfileSelector/useAutoQuerySelector.ts +1 -1
- package/src/ProfileView/components/ActionButtons/SortByDropdown.tsx +1 -1
- package/src/ProfileView/components/ColorStackLegend.tsx +2 -2
- package/src/ProfileView/components/DashboardItems/index.tsx +8 -8
- package/src/ProfileView/components/DashboardLayout/index.tsx +1 -1
- package/src/ProfileView/components/DiffLegend.tsx +3 -3
- package/src/ProfileView/components/GroupByLabelsDropdown/index.tsx +1 -1
- package/src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx +1 -1
- package/src/ProfileView/components/Toolbars/index.tsx +7 -7
- package/src/ProfileView/components/ViewSelector/Dropdown.tsx +8 -1
- package/src/ProfileView/components/ViewSelector/index.tsx +12 -7
- package/src/ProfileView/components/VisualizationContainer/index.tsx +1 -1
- package/src/ProfileView/components/VisualizationPanel.tsx +4 -4
- package/src/ProfileView/hooks/useProfileMetadata.ts +1 -1
- package/src/ProfileView/hooks/useVisualizationState.ts +2 -2
- package/src/ProfileView/index.tsx +4 -4
- package/src/ProfileView/types/visualization.ts +2 -2
- package/src/ProfileViewWithData.tsx +10 -10
- package/src/Sandwich/components/CalleesSection.tsx +4 -4
- package/src/Sandwich/components/CallersSection.tsx +5 -5
- package/src/Sandwich/index.tsx +10 -4
- package/src/Sandwich/utils/processRowData.ts +1 -1
- package/src/Table/hooks/useColorManagement.ts +1 -1
- package/src/Table/index.tsx +2 -2
- package/src/Table/utils/functions.ts +1 -1
- package/src/index.tsx +2 -2
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/ContextMenu.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/ContextMenuWrapper.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/MemoizedTooltip.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/TextWithEllipsis.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/TooltipContext.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/useMappingList.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/useNodeColor.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/IcicleGraphArrow/utils.d.ts.map +0 -1
- package/dist/ProfileIcicleGraph/index.d.ts.map +0 -1
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.js +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.d.ts +0 -0
- /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.js +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.tsx +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.tsx +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.tsx +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.ts +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.ts +0 -0
- /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.ts +0 -0
- /package/src/{ProfileIcicleGraph → ProfileFlameGraph}/benchmarks/benchdata/populateData.js +0 -0
|
@@ -15,40 +15,40 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
|
15
15
|
import cx from 'classnames';
|
|
16
16
|
import { AnimatePresence, motion } from 'framer-motion';
|
|
17
17
|
import { useMeasure } from 'react-use';
|
|
18
|
-
import {
|
|
18
|
+
import { FlameGraphSkeleton, SandwichFlameGraphSkeleton, useParcaContext, useURLState, } from '@parca/components';
|
|
19
19
|
import { capitalizeOnlyFirstLetter, divide } from '@parca/utilities';
|
|
20
20
|
import DiffLegend from '../ProfileView/components/DiffLegend';
|
|
21
21
|
import { useProfileViewContext } from '../ProfileView/context/ProfileViewContext';
|
|
22
22
|
import { TimelineGuide } from '../TimelineGuide';
|
|
23
|
-
import {
|
|
24
|
-
import useMappingList from './
|
|
25
|
-
import { boundsFromProfileSource } from './
|
|
23
|
+
import { FlameGraphArrow } from './FlameGraphArrow';
|
|
24
|
+
import useMappingList from './FlameGraphArrow/useMappingList';
|
|
25
|
+
import { boundsFromProfileSource } from './FlameGraphArrow/utils';
|
|
26
26
|
const numberFormatter = new Intl.NumberFormat('en-US');
|
|
27
27
|
const ErrorContent = ({ errorMessage }) => {
|
|
28
28
|
return (_jsx("div", { className: "flex flex-col justify-center p-10 text-center gap-6 text-sm", children: errorMessage }));
|
|
29
29
|
};
|
|
30
|
-
export const
|
|
30
|
+
export const validateFlameChartQuery = (profileSource) => {
|
|
31
31
|
const isNonDelta = !profileSource.ProfileType().delta;
|
|
32
32
|
const isDurationTooLong = profileSource.mergeTo - profileSource.mergeFrom > 60000;
|
|
33
33
|
return { isValid: !isNonDelta && !isDurationTooLong, isNonDelta, isDurationTooLong };
|
|
34
34
|
};
|
|
35
|
-
const
|
|
36
|
-
const { onError, authenticationErrorMessage, isDarkMode,
|
|
35
|
+
const ProfileFlameGraph = function ProfileFlameGraphNonMemo({ arrow, total, filtered, curPathArrow, setNewCurPathArrow, profileType, loading, error, width, isHalfScreen, metadataMappingFiles, isFlameChart = false, profileSource, isInSandwichView = false, isRenderedAsFlamegraph = false, tooltipId, maxFrameCount, isExpanded = false, }) {
|
|
36
|
+
const { onError, authenticationErrorMessage, isDarkMode, flamechartHelpText } = useParcaContext();
|
|
37
37
|
const { compareMode } = useProfileViewContext();
|
|
38
38
|
const [isLoading, setIsLoading] = useState(true);
|
|
39
|
-
const [
|
|
39
|
+
const [flameChartRef, { height: flameChartHeight }] = useMeasure();
|
|
40
40
|
// Create local state for paths when in sandwich view to avoid URL updates
|
|
41
41
|
const [localCurPathArrow, setLocalCurPathArrow] = useState([]);
|
|
42
42
|
const setCurPathArrowWrapper = useCallback((path) => {
|
|
43
|
-
if (
|
|
43
|
+
if (isInSandwichView) {
|
|
44
44
|
setLocalCurPathArrow(path);
|
|
45
45
|
}
|
|
46
46
|
else {
|
|
47
47
|
setNewCurPathArrow(path);
|
|
48
48
|
}
|
|
49
|
-
}, [
|
|
50
|
-
// Determine which paths to use based on
|
|
51
|
-
const effectiveCurPathArrow =
|
|
49
|
+
}, [isInSandwichView, setNewCurPathArrow]);
|
|
50
|
+
// Determine which paths to use based on isInSandwichView flag
|
|
51
|
+
const effectiveCurPathArrow = isInSandwichView ? localCurPathArrow : curPathArrow;
|
|
52
52
|
const mappingsList = useMappingList(metadataMappingFiles);
|
|
53
53
|
const [colorBy, setColorBy] = useURLState('color_by');
|
|
54
54
|
// By default, we want delta profiles (CPU) to be relatively compared.
|
|
@@ -91,24 +91,24 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ arrow, total, fi
|
|
|
91
91
|
setIsLoading(true);
|
|
92
92
|
}
|
|
93
93
|
}, [loadingState]);
|
|
94
|
-
const
|
|
95
|
-
const { isValid:
|
|
96
|
-
?
|
|
94
|
+
const flameGraph = useMemo(() => {
|
|
95
|
+
const { isValid: isFlameChartValid, isNonDelta, isDurationTooLong, } = isFlameChart
|
|
96
|
+
? validateFlameChartQuery(profileSource)
|
|
97
97
|
: { isValid: true, isNonDelta: false, isDurationTooLong: false };
|
|
98
|
-
const
|
|
99
|
-
if (isLoading && !
|
|
100
|
-
return (_jsx("div", { className: "h-auto overflow-clip", children:
|
|
98
|
+
const isInvalidFlameChartQuery = isFlameChart && !isFlameChartValid;
|
|
99
|
+
if (isLoading && !isInvalidFlameChartQuery) {
|
|
100
|
+
return (_jsx("div", { className: "h-auto overflow-clip", children: isRenderedAsFlamegraph ? (_jsx(SandwichFlameGraphSkeleton, { isHalfScreen: isHalfScreen, isDarkMode: isDarkMode })) : (_jsx(FlameGraphSkeleton, { isHalfScreen: isHalfScreen, isDarkMode: isDarkMode })) }));
|
|
101
101
|
}
|
|
102
|
-
// Do necessary checks to ensure that
|
|
103
|
-
if (
|
|
102
|
+
// Do necessary checks to ensure that flame chart can be rendered for this query.
|
|
103
|
+
if (isInvalidFlameChartQuery) {
|
|
104
104
|
if (isNonDelta) {
|
|
105
|
-
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "To use the
|
|
105
|
+
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "To use the Flame chart, please switch to a Delta profile." }), flamechartHelpText ?? null] }) }));
|
|
106
106
|
}
|
|
107
107
|
else if (isDurationTooLong) {
|
|
108
|
-
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "
|
|
108
|
+
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "Flame chart is unavailable for queries longer than one minute. Please select a point in the metrics graph to continue." }), flamechartHelpText ?? null] }) }));
|
|
109
109
|
}
|
|
110
110
|
else {
|
|
111
|
-
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "The
|
|
111
|
+
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: "The Flame chart is not available for this query." }), flamechartHelpText ?? null] }) }));
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
114
|
if (arrow === undefined)
|
|
@@ -116,7 +116,7 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ arrow, total, fi
|
|
|
116
116
|
if (total === 0n && !loading)
|
|
117
117
|
return _jsx("div", { className: "mx-auto text-center", children: "Profile has no samples" });
|
|
118
118
|
if (arrow !== undefined) {
|
|
119
|
-
return (_jsxs("div", { className: "relative", children: [
|
|
119
|
+
return (_jsxs("div", { className: "relative", children: [isFlameChart ? (_jsx(TimelineGuide, { bounds: boundsFromProfileSource(profileSource), width: width, height: flameChartHeight ?? 420, margin: 0, ticks: 12, timeUnit: "nanoseconds" })) : null, _jsx("div", { ref: flameChartRef, children: _jsx(FlameGraphArrow, { width: width, arrow: arrow, total: total, filtered: filtered, curPath: effectiveCurPathArrow, setCurPath: setCurPathArrowWrapper, profileType: profileType, isHalfScreen: isHalfScreen, mappingsListFromMetadata: mappingsList, compareAbsolute: isCompareAbsolute, isFlameChart: isFlameChart, profileSource: profileSource, isRenderedAsFlamegraph: isRenderedAsFlamegraph, isInSandwichView: isInSandwichView, tooltipId: tooltipId, maxFrameCount: maxFrameCount, isExpanded: isExpanded }) })] }));
|
|
120
120
|
}
|
|
121
121
|
}, [
|
|
122
122
|
isLoading,
|
|
@@ -130,13 +130,13 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ arrow, total, fi
|
|
|
130
130
|
isDarkMode,
|
|
131
131
|
mappingsList,
|
|
132
132
|
isCompareAbsolute,
|
|
133
|
-
|
|
133
|
+
isFlameChart,
|
|
134
134
|
profileSource,
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
135
|
+
flameChartHeight,
|
|
136
|
+
flameChartRef,
|
|
137
|
+
flamechartHelpText,
|
|
138
|
+
isRenderedAsFlamegraph,
|
|
139
|
+
isInSandwichView,
|
|
140
140
|
effectiveCurPathArrow,
|
|
141
141
|
setCurPathArrowWrapper,
|
|
142
142
|
tooltipId,
|
|
@@ -160,8 +160,8 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ arrow, total, fi
|
|
|
160
160
|
if (isMergeError || isTimestampError) {
|
|
161
161
|
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { className: "font-semibold", children: "Unable to display overlapping data" }), _jsx("span", { className: "text-gray-600 dark:text-gray-400", children: "The selected data contains overlapping samples from multiple nodes or threads that cannot be merged." }), _jsx("span", { className: "text-gray-600 dark:text-gray-400", children: "To view this data, please apply more specific filters:" }), _jsxs("ul", { className: "list-disc list-inside text-left max-w-md mx-auto text-gray-600 dark:text-gray-400", children: [_jsx("li", { children: "Select a specific node from the node selector" }), _jsx("li", { children: "Filter by either CPU or thread" })] })] }) }));
|
|
162
162
|
}
|
|
163
|
-
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: capitalizeOnlyFirstLetter(error.message) }),
|
|
163
|
+
return (_jsx(ErrorContent, { errorMessage: _jsxs(_Fragment, { children: [_jsx("span", { children: capitalizeOnlyFirstLetter(error.message) }), isFlameChart ? flamechartHelpText ?? null : null] }) }));
|
|
164
164
|
}
|
|
165
|
-
return (_jsx(AnimatePresence, { children: _jsxs(motion.div, { className: "relative h-full w-full", initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.5 }, children: [compareMode ? _jsx(DiffLegend, {}) : null, _jsx("div", { className: cx(!
|
|
165
|
+
return (_jsx(AnimatePresence, { children: _jsxs(motion.div, { className: "relative h-full w-full", initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.5 }, children: [compareMode ? _jsx(DiffLegend, {}) : null, _jsx("div", { className: cx(!isInSandwichView ? 'min-h-48' : ''), id: "h-flame-graph", children: _jsx(_Fragment, { children: flameGraph }) }), !isInSandwichView && (_jsxs("p", { className: "my-2 text-xs", children: ["Showing ", totalFormatted, ' ', isFiltered ? (_jsxs("span", { children: ["(", filteredPercentage, "%) filtered of ", totalUnfilteredFormatted, ' '] })) : (_jsx(_Fragment, {})), "values.", ' '] }))] }, "flame-graph-loaded") }));
|
|
166
166
|
};
|
|
167
|
-
export default
|
|
167
|
+
export default ProfileFlameGraph;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useQueryRange.d.ts","sourceRoot":"","sources":["../../../src/ProfileMetricsGraph/hooks/useQueryRange.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAW,kBAAkB,EAAE,kBAAkB,EAAY,MAAM,eAAe,CAAC;AAM1F,UAAU,gBAAgB;IACxB,QAAQ,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACpC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,2BAA2B,
|
|
1
|
+
{"version":3,"file":"useQueryRange.d.ts","sourceRoot":"","sources":["../../../src/ProfileMetricsGraph/hooks/useQueryRange.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAW,kBAAkB,EAAE,kBAAkB,EAAY,MAAM,eAAe,CAAC;AAM1F,UAAU,gBAAgB;IACxB,QAAQ,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACpC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;CACxB;AAED,eAAO,MAAM,2BAA2B,GAAI,gBAAgB,MAAM,KAAG,MAQpE,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,QAAQ,kBAAkB,EAC1B,iBAAiB,MAAM,EACvB,OAAO,MAAM,EACb,KAAK,MAAM,EACX,OAAO,MAAM,EAAE,EACf,cAAY,KACX,gBA+CF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAC,KAAK,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAC,aAAa,EAAwC,MAAM,mBAAmB,CAAC;AAIvF,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAK5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAC,KAAK,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAC,aAAa,EAAwC,MAAM,mBAAmB,CAAC;AAIvF,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAK5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,GAAI,aAAW,6BAA6B,KAAG,GAAG,CAAC,OAMvF,CAAC;AAEF,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CACf,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KACvE,IAAI,CAAC;IACV,YAAY,EAAE,CACZ,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,KAAK,EAAE,EACf,eAAe,EAAE,MAAM,EACvB,QAAQ,EAAE,MAAM,KACb,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,GAAI,mIAY1B,wBAAwB,KAAG,GAAG,CAAC,OA4FjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompareButton.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/CompareButton.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"CompareButton.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/CompareButton.tsx"],"names":[],"mappings":"AAmBA,QAAA,MAAM,aAAa,GAAI,wBAGpB;IACD,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,KAAG,GAAG,CAAC,OA+CP,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,QAAQ,EAAE,cAAc,EAAuC,MAAM,OAAO,CAAC;AAErF,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAC,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAUvE,OAAO,EAAC,KAAK,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAC,gBAAgB,EAAC,MAAM,IAAI,CAAC;AASpC,MAAM,WAAW,cAAc;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,uBAAuB;IAC/B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC;AAED,MAAM,WAAW,kBAAkB;IACjC,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE;QACR,MAAM,EAAE,KAAK,CAAC;YACZ,IAAI,EAAE,MAAM,CAAC;YACb,KAAK,EAAE,MAAM,CAAC;SACf,CAAC,CAAC;KACJ,CAAC;IACF,OAAO,EAAE,KAAK,CAAC;QACb,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC,CAAC;CACJ;AAED,MAAM,WAAW,iBAAiB;IAChC,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;IACjC,2BAA2B,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;IACjE,sBAAsB,CAAC,EAAE,MAAM,EAAE,CAAC;IAClC,4BAA4B,CAAC,EAAE,OAAO,CAAC;CACxC;AAED,UAAU,oBAAqB,SAAQ,uBAAuB;IAC5D,WAAW,EAAE,kBAAkB,CAAC;IAChC,cAAc,EAAE,cAAc,CAAC;IAC/B,aAAa,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC7C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,gCAAgC,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACrE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kBAAkB,CAAC,EAAE,KAAK,CAAC;QACzB,IAAI,EAAE,MAAM,CAAC;QACb,iBAAiB,EAAE,MAAM,CAAC;QAC1B,IAAI,EAAE,kBAAkB,EAAE,CAAC;KAC5B,CAAC,CAAC;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,yBAAyB,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KAAK,IAAI,CAAC;CACnF;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,KAAK,CAAC,EAAE,QAAQ,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAutoQuerySelector.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/useAutoQuerySelector.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,oBAAoB,EAAC,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAC,KAAK,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAC,cAAc,EAAC,MAAM,oBAAoB,CAAC;AAGlD,UAAU,KAAK;IACb,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,oBAAoB,GAAG,SAAS,CAAC;IACnD,cAAc,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"useAutoQuerySelector.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/useAutoQuerySelector.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,oBAAoB,EAAC,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAC,KAAK,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAC,cAAc,EAAC,MAAM,oBAAoB,CAAC;AAGlD,UAAU,KAAK;IACb,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,oBAAoB,GAAG,SAAS,CAAC;IACnD,cAAc,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,oBAAoB,GAAI,qHAQlC,KAAK,KAAG,IAuIV,CAAC"}
|
|
@@ -62,7 +62,7 @@ export const useAutoQuerySelector = ({ selectedProfileName, profileTypesData, se
|
|
|
62
62
|
void navigateTo('/', {
|
|
63
63
|
...compareQuery,
|
|
64
64
|
search_string: '',
|
|
65
|
-
dashboard_items: ['
|
|
65
|
+
dashboard_items: ['flamegraph'],
|
|
66
66
|
});
|
|
67
67
|
}
|
|
68
68
|
}, [comparing, querySelection, navigateTo, expressionA, dispatch, loading]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProfileSource.d.ts","sourceRoot":"","sources":["../src/ProfileSource.tsx"],"names":[],"mappings":"AAaA,OAAO,EACL,oBAAoB,EAEpB,YAAY,EAIb,MAAM,eAAe,CAAC;AACvB,OAAO,EAAqB,WAAW,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAGrE,MAAM,WAAW,aAAa;IAC5B,YAAY,EAAE,MAAM,YAAY,CAAC;IACjC,WAAW,EAAE,MAAM,WAAW,CAAC;IAC/B,aAAa,EAAE,MAAM,oBAAoB,CAAC;IAC1C,QAAQ,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,WAAW,EAAE,MAAM,MAAM,CAAC;IAC1B,aAAa,EAAE,MAAM;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAC,CAAC;IAC1C,aAAa,EAAE,MAAM,aAAa,CAAC;IACnC,IAAI,EAAE,MAAM,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"ProfileSource.d.ts","sourceRoot":"","sources":["../src/ProfileSource.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileTypeSelector/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAC,WAAW,EAAE,oBAAoB,EAAC,MAAM,eAAe,CAAC;AAChE,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAE7D,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,iBAAiB;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG,gBAAgB,CAAC;CACjC;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAiF/B,CAAC;AAEF,wBAAgB,gCAAgC,CAAC,IAAI,EAAE,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAU3F;AAED,wBAAgB,oBAAoB,CAClC,IAAI,EAAE,MAAM,EACZ,8BAA8B,EAAE,OAAO,GACtC,aAAa,CAiBf;AAED,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileTypeSelector/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAC,WAAW,EAAE,oBAAoB,EAAC,MAAM,eAAe,CAAC;AAChE,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAE7D,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,iBAAiB;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG,gBAAgB,CAAC;CACjC;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAiF/B,CAAC;AAEF,wBAAgB,gCAAgC,CAAC,IAAI,EAAE,MAAM,GAAG,gBAAgB,GAAG,SAAS,CAU3F;AAED,wBAAgB,oBAAoB,CAClC,IAAI,EAAE,MAAM,EACZ,8BAA8B,EAAE,OAAO,GACtC,aAAa,CAiBf;AAED,eAAO,MAAM,oBAAoB,GAAI,MAAM,WAAW,KAAG,MAIxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,OAAO,WAAW,EAAE,KAAG,MAAM,EAItE,CAAC;AAEF,UAAU,KAAK;IACb,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC5B,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,8BAA8B,CAAC,EAAE,OAAO,CAAC;IACzC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,mBAAmB,GAAI,2GAQ1B,KAAK,KAAG,GAAG,CAAC,OAyBd,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -12,7 +12,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
12
12
|
// See the License for the specific language governing permissions and
|
|
13
13
|
// limitations under the License.
|
|
14
14
|
import { Select, useURLState } from '@parca/components';
|
|
15
|
-
import { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_NAME, } from '../../../
|
|
15
|
+
import { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_NAME, } from '../../../ProfileFlameGraph/FlameGraphArrow';
|
|
16
16
|
import { useProfileViewContext } from '../../context/ProfileViewContext';
|
|
17
17
|
const SortByDropdown = () => {
|
|
18
18
|
const [storeSortBy, setStoreSortBy] = useURLState('sort_by', {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorStackLegend.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/components/ColorStackLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAYrC,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,
|
|
1
|
+
{"version":3,"file":"ColorStackLegend.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/components/ColorStackLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAYrC,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,OAsGrF,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -17,8 +17,8 @@ import cx from 'classnames';
|
|
|
17
17
|
import { useURLState } from '@parca/components';
|
|
18
18
|
import { USER_PREFERENCES, useCurrentColorProfile, useUserPreference } from '@parca/hooks';
|
|
19
19
|
import { EVERYTHING_ELSE, selectDarkMode, useAppSelector } from '@parca/store';
|
|
20
|
-
import { getMappingColors } from '../../
|
|
21
|
-
import useMappingList from '../../
|
|
20
|
+
import { getMappingColors } from '../../ProfileFlameGraph/FlameGraphArrow';
|
|
21
|
+
import useMappingList from '../../ProfileFlameGraph/FlameGraphArrow/useMappingList';
|
|
22
22
|
const ColorStackLegend = ({ mappings, compareMode = false, loading }) => {
|
|
23
23
|
const isDarkMode = useAppSelector(selectDarkMode);
|
|
24
24
|
const currentColorProfile = useCurrentColorProfile();
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ProfilerOnRenderCallback } from 'react';
|
|
2
2
|
import { QueryServiceClient } from '@parca/client';
|
|
3
|
-
import { CurrentPathFrame } from '../../../
|
|
3
|
+
import { CurrentPathFrame } from '../../../ProfileFlameGraph/FlameGraphArrow/utils';
|
|
4
4
|
import { ProfileSource } from '../../../ProfileSource';
|
|
5
5
|
import type { FlamegraphData, SourceData, TopTableData, VisualizationType } from '../../types/visualization';
|
|
6
6
|
interface GetDashboardItemProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAIrD,OAAO,KAAK,EACV,cAAc,EACd,UAAU,EACV,YAAY,EACZ,iBAAiB,EAClB,MAAM,2BAA2B,CAAC;AAEnC,UAAU,qBAAqB;IAC7B,IAAI,EAAE,iBAAiB,CAAC;IACxB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,cAAc,EAAE,cAAc,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,kBAAkB,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC;AAED,eAAO,MAAM,gBAAgB,GAAI,0NAiB9B,qBAAqB,KAAG,GAAG,CAAC,OA2G9B,CAAC"}
|
|
@@ -13,27 +13,27 @@ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
|
13
13
|
// limitations under the License.
|
|
14
14
|
import { Profiler } from 'react';
|
|
15
15
|
import { ConditionalWrapper } from '@parca/components';
|
|
16
|
-
import
|
|
16
|
+
import ProfileFlameGraph from '../../../ProfileFlameGraph';
|
|
17
17
|
import Sandwich from '../../../Sandwich';
|
|
18
18
|
import { SourceView } from '../../../SourceView';
|
|
19
19
|
import { Table } from '../../../Table';
|
|
20
20
|
export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphData, flamechartData, topTableData, sourceData, profileSource, total, filtered, curPathArrow, setNewCurPathArrow, currentSearchString, setSearchString, perf, queryClient, }) => {
|
|
21
21
|
switch (type) {
|
|
22
|
-
case '
|
|
22
|
+
case 'flamegraph':
|
|
23
23
|
return (_jsx(ConditionalWrapper, { condition: perf?.onRender != null, WrapperComponent: Profiler, wrapperProps: {
|
|
24
|
-
id: '
|
|
24
|
+
id: 'flameGraph',
|
|
25
25
|
onRender: perf?.onRender ?? (() => { }),
|
|
26
|
-
}, children: _jsx(
|
|
26
|
+
}, children: _jsx(ProfileFlameGraph, { curPathArrow: curPathArrow, setNewCurPathArrow: setNewCurPathArrow, arrow: flamegraphData?.arrow, total: total, filtered: filtered, profileType: profileSource?.ProfileType(), loading: flamegraphData.loading, error: flamegraphData.error, isHalfScreen: isHalfScreen, width: dimensions?.width !== undefined
|
|
27
27
|
? isHalfScreen
|
|
28
28
|
? (dimensions.width - 54) / 2
|
|
29
29
|
: dimensions.width - 16
|
|
30
30
|
: 0, metadataMappingFiles: flamegraphData.metadataMappingFiles, metadataLoading: flamegraphData.metadataLoading, profileSource: profileSource }) }));
|
|
31
|
-
case '
|
|
32
|
-
return (_jsx(
|
|
31
|
+
case 'flamechart':
|
|
32
|
+
return (_jsx(ProfileFlameGraph, { curPathArrow: [], setNewCurPathArrow: () => { }, arrow: flamechartData?.arrow, total: total, filtered: filtered, profileType: profileSource?.ProfileType(), loading: flamechartData.loading, error: flamechartData.error, isHalfScreen: isHalfScreen, width: dimensions?.width !== undefined
|
|
33
33
|
? isHalfScreen
|
|
34
34
|
? (dimensions.width - 54) / 2
|
|
35
35
|
: dimensions.width - 16
|
|
36
|
-
: 0, metadataMappingFiles: flamechartData.metadataMappingFiles, metadataLoading: flamechartData.metadataLoading, profileSource: profileSource,
|
|
36
|
+
: 0, metadataMappingFiles: flamechartData.metadataMappingFiles, metadataLoading: flamechartData.metadataLoading, profileSource: profileSource, isFlameChart: true }));
|
|
37
37
|
case 'table':
|
|
38
38
|
return topTableData != null ? (_jsx(Table, { total: total, filtered: filtered, loading: topTableData.loading, data: topTableData.arrow?.record, unit: topTableData.unit, profileType: profileSource?.ProfileType(), currentSearchString: currentSearchString, setSearchString: setSearchString, isHalfScreen: isHalfScreen, metadataMappingFiles: flamegraphData.metadataMappingFiles })) : (_jsx(_Fragment, {}));
|
|
39
39
|
case 'sandwich':
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardLayout/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAYzB,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,oBAAoB;IAC5B,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,aAAa,EAAE;QACb,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardLayout/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAYzB,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,oBAAoB;IAC5B,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,aAAa,EAAE;QACb,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;QACnB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;KACpB,CAAC;CACH;AAED,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA2DpD,CAAC"}
|
|
@@ -45,6 +45,6 @@ const DiffLegend = () => {
|
|
|
45
45
|
const handleMouseLeave = () => {
|
|
46
46
|
setShowLegendTooltip(false);
|
|
47
47
|
};
|
|
48
|
-
return (_jsxs("div", { className: "mt-1 mb-2 hidden md:block", id: "h-diff-legend", children: [_jsxs("div", { ref: setReferenceElement, className: "flex items-center justify-center", children: [_jsx("span", { children: "Better" }), _jsx(DiffLegendBar, { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }), _jsx("span", { children: "Worse" })] }), _jsx(Popover, { className: "relative", children: () => (_jsx(Transition, { show: showLegendTooltip, as: Fragment, enter: "transition ease-out duration-200", enterFrom: "opacity-0 translate-y-1", enterTo: "opacity-100 translate-y-0", leave: "transition ease-in duration-150", leaveFrom: "opacity-100 translate-y-0", leaveTo: "opacity-0 translate-y-1", children: _jsx(Popover.Panel, { ref: setPopperElement, style: styles.popper, ...attributes.popper, children: _jsx("div", { className: "overflow-hidden rounded-lg shadow-lg ring-1 ring-black ring-opacity-5", children: _jsxs("div", { className: "bg-gray-50 p-4 dark:bg-gray-800", children: [_jsx("div", { className: "flex items-center justify-center" }), _jsx("span", { className: "block text-sm text-gray-500 dark:text-gray-50", children: "This is a differential
|
|
48
|
+
return (_jsxs("div", { className: "mt-1 mb-2 hidden md:block", id: "h-diff-legend", children: [_jsxs("div", { ref: setReferenceElement, className: "flex items-center justify-center", children: [_jsx("span", { children: "Better" }), _jsx(DiffLegendBar, { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }), _jsx("span", { children: "Worse" })] }), _jsx(Popover, { className: "relative", children: () => (_jsx(Transition, { show: showLegendTooltip, as: Fragment, enter: "transition ease-out duration-200", enterFrom: "opacity-0 translate-y-1", enterTo: "opacity-100 translate-y-0", leave: "transition ease-in duration-150", leaveFrom: "opacity-100 translate-y-0", leaveTo: "opacity-0 translate-y-1", children: _jsx(Popover.Panel, { ref: setPopperElement, style: styles.popper, ...attributes.popper, children: _jsx("div", { className: "overflow-hidden rounded-lg shadow-lg ring-1 ring-black ring-opacity-5", children: _jsxs("div", { className: "bg-gray-50 p-4 dark:bg-gray-800", children: [_jsx("div", { className: "flex items-center justify-center" }), _jsx("span", { className: "block text-sm text-gray-500 dark:text-gray-50", children: "This is a differential flame graph, where a purple-colored node means unchanged, and the darker the red, the worse the node got, and the darker the green, the better the node got." })] }) }) }) })) })] }));
|
|
49
49
|
};
|
|
50
50
|
export default DiffLegend;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/GroupByLabelsDropdown/index.tsx"],"names":[],"mappings":"AAsBA,UAAU,KAAK;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/GroupByLabelsDropdown/index.tsx"],"names":[],"mappings":"AAsBA,UAAU,KAAK;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,qBAAqB,GAAI,uCAAqC,KAAK,KAAG,GAAG,CAAC,OA6D/E,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
|
|
@@ -12,7 +12,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
12
12
|
// See the License for the specific language governing permissions and
|
|
13
13
|
// limitations under the License.
|
|
14
14
|
import Select from 'react-select';
|
|
15
|
-
import { FIELD_LABELS } from '../../../
|
|
15
|
+
import { FIELD_LABELS } from '../../../ProfileFlameGraph/FlameGraphArrow';
|
|
16
16
|
const GroupByLabelsDropdown = ({ labels, groupBy, setGroupByLabels }) => {
|
|
17
17
|
return (_jsxs("div", { children: [_jsx("div", { className: "flex items-center justify-between", children: _jsx("label", { className: "text-sm", children: "Group by" }) }), _jsx(Select, { id: "h-group-by-labels-selector", isMulti: true, defaultMenuIsOpen: false, defaultValue: undefined, name: "labels", options: labels.map(label => ({ label, value: `${FIELD_LABELS}.${label}` })), className: "parca-select-container text-sm w-full rounded-md bg-white", classNamePrefix: "parca-select", value: groupBy
|
|
18
18
|
.filter(l => l.startsWith(FIELD_LABELS))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResultBox.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ShareButton/ResultBox.tsx"],"names":[],"mappings":"AAoBA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,QAAA,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"ResultBox.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ShareButton/ResultBox.tsx"],"names":[],"mappings":"AAoBA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAID,QAAA,MAAM,SAAS,GAAI,sBAAyB,KAAK,KAAG,GAAG,CAAC,OAqCvD,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ShareButton/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,OAAO,EAAC,YAAY,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAG/D,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,6BAA6B,EAAE,KAAK,CAAC,SAAS,CAAC;CAChD;AAmGD,QAAA,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ShareButton/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAItC,OAAO,EAAC,YAAY,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAG/D,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,UAAU,KAAK;IACb,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,6BAA6B,EAAE,KAAK,CAAC,SAAS,CAAC;CAChD;AAmGD,QAAA,MAAM,WAAW,GAAI,iHAOlB,KAAK,KAAG,GAAG,CAAC,OAsFd,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -17,7 +17,7 @@ import { Icon } from '@iconify/react';
|
|
|
17
17
|
import cx from 'classnames';
|
|
18
18
|
import { useURLState } from '@parca/components';
|
|
19
19
|
import { USER_PREFERENCES, useUserPreference } from '@parca/hooks';
|
|
20
|
-
import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from '../../../
|
|
20
|
+
import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from '../../../ProfileFlameGraph/FlameGraphArrow';
|
|
21
21
|
import { useProfileViewContext } from '../../context/ProfileViewContext';
|
|
22
22
|
import SwitchMenuItem from './SwitchMenuItem';
|
|
23
23
|
const MenuItem = ({ label, items, onclick, onSelect, path = [], id, closeDropdown, isNested = false, activeValueForSortBy, activeValueForColorBy, activeValuesForLevel, value, disabled = false, icon, customSubmenu, renderAsDiv = false, }) => {
|
|
@@ -1 +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,
|
|
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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import { QueryServiceClient } from '@parca/client';
|
|
3
3
|
import { ProfileType } from '@parca/parser';
|
|
4
|
-
import { CurrentPathFrame } from '../../../
|
|
4
|
+
import { CurrentPathFrame } from '../../../ProfileFlameGraph/FlameGraphArrow/utils';
|
|
5
5
|
import { ProfileSource } from '../../../ProfileSource';
|
|
6
6
|
export interface VisualisationToolbarProps {
|
|
7
7
|
groupBy: string[];
|
|
@@ -33,16 +33,16 @@ export interface TableToolbarProps {
|
|
|
33
33
|
clearSelection: () => void;
|
|
34
34
|
currentSearchString?: string;
|
|
35
35
|
}
|
|
36
|
-
export interface
|
|
36
|
+
export interface FlameGraphToolbarProps {
|
|
37
37
|
curPath: CurrentPathFrame[];
|
|
38
38
|
setNewCurPath: (path: CurrentPathFrame[]) => void;
|
|
39
39
|
}
|
|
40
|
-
export interface
|
|
40
|
+
export interface SandwichFlameGraphToolbarProps {
|
|
41
41
|
resetSandwichFunctionName: () => void;
|
|
42
42
|
sandwichFunctionName?: string;
|
|
43
43
|
}
|
|
44
44
|
export declare const TableToolbar: FC<TableToolbarProps>;
|
|
45
|
-
export declare const
|
|
46
|
-
export declare const
|
|
45
|
+
export declare const FlameGraphToolbar: FC<FlameGraphToolbarProps>;
|
|
46
|
+
export declare const SandwichFlameGraphToolbar: FC<SandwichFlameGraphToolbarProps>;
|
|
47
47
|
export declare const VisualisationToolbar: FC<VisualisationToolbarProps>;
|
|
48
48
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +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;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,
|
|
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;AAE1C,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,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6BAA6B,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;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,CAwB9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAiBxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAmBxE,CAAC;AAMF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CA+F9D,CAAC"}
|
|
@@ -12,10 +12,10 @@ import TableColumnsDropdown from './TableColumnsDropdown';
|
|
|
12
12
|
export const TableToolbar = ({ profileType, total, filtered, clearSelection, currentSearchString, }) => {
|
|
13
13
|
return (_jsx(_Fragment, { children: _jsxs("div", { className: "flex w-full gap-2 items-end", children: [_jsx(TableColumnsDropdown, { profileType: profileType, total: total, filtered: filtered }), _jsx(Button, { color: "neutral", onClick: clearSelection, className: "w-auto", variant: "neutral", disabled: currentSearchString === undefined || currentSearchString.length === 0, children: "Clear selection" })] }) }));
|
|
14
14
|
};
|
|
15
|
-
export const
|
|
15
|
+
export const FlameGraphToolbar = ({ curPath, setNewCurPath }) => {
|
|
16
16
|
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", children: ["Reset graph", _jsx(Icon, { icon: "system-uicons:reset", width: 20 })] }) }) }));
|
|
17
17
|
};
|
|
18
|
-
export const
|
|
18
|
+
export const SandwichFlameGraphToolbar = ({ resetSandwichFunctionName, sandwichFunctionName, }) => {
|
|
19
19
|
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" }) }) }));
|
|
20
20
|
};
|
|
21
21
|
const Divider = () => (_jsx("div", { className: "border-t mt-4 border-gray-200 dark:border-gray-700 h-[1px] w-full pb-4" }));
|
|
@@ -23,7 +23,7 @@ export const VisualisationToolbar = ({ groupBy, toggleGroupBy, groupByLabels, se
|
|
|
23
23
|
const { dashboardItems } = useDashboard();
|
|
24
24
|
const isTableViz = dashboardItems?.includes('table');
|
|
25
25
|
const isTableVizOnly = dashboardItems?.length === 1 && isTableViz;
|
|
26
|
-
const isGraphViz = dashboardItems?.includes('
|
|
26
|
+
const isGraphViz = dashboardItems?.includes('flamegraph');
|
|
27
27
|
const isGraphVizOnly = dashboardItems?.length === 1 && isGraphViz;
|
|
28
28
|
const req = profileSource?.QueryRequest();
|
|
29
29
|
if (req !== null && req !== undefined) {
|
|
@@ -31,5 +31,5 @@ export const VisualisationToolbar = ({ groupBy, toggleGroupBy, groupByLabels, se
|
|
|
31
31
|
fields: groupBy ?? [],
|
|
32
32
|
};
|
|
33
33
|
}
|
|
34
|
-
return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex w-full justify-between items-end", children: [_jsxs("div", { className: "flex gap-3 items-end", children: [isGraphViz && (_jsxs(_Fragment, { children: [_jsx(GroupByDropdown, { groupBy: groupBy, labels: groupByLabels, setGroupByLabels: setGroupByLabels }), _jsx(InvertCallStack, {})] })), _jsx(FilterByFunctionButton, {}), profileViewExternalSubActions != null ? profileViewExternalSubActions : null] }), _jsxs("div", { className: "flex gap-3", children: [_jsx(MultiLevelDropdown, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, profileType: profileType, onSelect: () => { }, isTableVizOnly: isTableVizOnly }), _jsx(ShareButton, { profileSource: profileSource, queryClient: queryClient, queryRequest: req, onDownloadPProf: onDownloadPProf, pprofdownloading: pprofdownloading ?? false, profileViewExternalSubActions: profileViewExternalSubActions }), showVisualizationSelector ? _jsx(ViewSelector, { profileSource: profileSource }) : null] })] }), isGraphVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(
|
|
34
|
+
return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex w-full justify-between items-end", children: [_jsxs("div", { className: "flex gap-3 items-end", children: [isGraphViz && (_jsxs(_Fragment, { children: [_jsx(GroupByDropdown, { groupBy: groupBy, labels: groupByLabels, setGroupByLabels: setGroupByLabels }), _jsx(InvertCallStack, {})] })), _jsx(FilterByFunctionButton, {}), profileViewExternalSubActions != null ? profileViewExternalSubActions : null] }), _jsxs("div", { className: "flex gap-3", children: [_jsx(MultiLevelDropdown, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, profileType: profileType, onSelect: () => { }, isTableVizOnly: isTableVizOnly }), _jsx(ShareButton, { profileSource: profileSource, queryClient: queryClient, queryRequest: req, onDownloadPProf: onDownloadPProf, pprofdownloading: pprofdownloading ?? false, profileViewExternalSubActions: profileViewExternalSubActions }), showVisualizationSelector ? _jsx(ViewSelector, { profileSource: profileSource }) : null] })] }), isGraphVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(FlameGraphToolbar, { curPath: curPath, setNewCurPath: setNewCurPath })] })), isTableVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(TableToolbar, { profileType: profileType, total: total, filtered: filtered, clearSelection: clearSelection, currentSearchString: currentSearchString })] }))] }));
|
|
35
35
|
};
|
|
@@ -16,7 +16,7 @@ export interface InnerAction {
|
|
|
16
16
|
isDisabled?: boolean;
|
|
17
17
|
}
|
|
18
18
|
export declare function contructItemsFromArray(items: any[]): DropdownItem[];
|
|
19
|
-
declare const Dropdown: ({ items, selectedKey, onSelection, placeholder, width, className, loading, primary, disabled, icon, id, }: {
|
|
19
|
+
declare const Dropdown: ({ items, selectedKey, onSelection, placeholder, width, className, loading, primary, disabled, icon, id, optionsClassName, }: {
|
|
20
20
|
items: DropdownItem[];
|
|
21
21
|
selectedKey: string | undefined;
|
|
22
22
|
onSelection: (value: string) => void;
|
|
@@ -28,6 +28,7 @@ declare const Dropdown: ({ items, selectedKey, onSelection, placeholder, width,
|
|
|
28
28
|
disabled?: boolean;
|
|
29
29
|
icon?: JSX.Element;
|
|
30
30
|
id?: string;
|
|
31
|
+
optionsClassName?: string;
|
|
31
32
|
}) => JSX.Element;
|
|
32
33
|
export default Dropdown;
|
|
33
34
|
//# sourceMappingURL=Dropdown.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/Dropdown.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC;IACpB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAMnE;AAED,QAAA,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/Dropdown.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC;IACpB,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,eAAe,CAAC;IACzB,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAMnE;AAED,QAAA,MAAM,QAAQ,GAAI,6HAaf;IACD,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,KAAG,GAAG,CAAC,OA4DP,CAAC;AAwEF,eAAe,QAAQ,CAAC"}
|
|
@@ -23,7 +23,7 @@ export function contructItemsFromArray(items) {
|
|
|
23
23
|
innerAction: item.innerAction,
|
|
24
24
|
}));
|
|
25
25
|
}
|
|
26
|
-
const Dropdown = ({ items, selectedKey, onSelection, placeholder, width, className = '', loading, primary = false, disabled = false, icon, id, }) => {
|
|
26
|
+
const Dropdown = ({ items, selectedKey, onSelection, placeholder, width, className = '', loading, primary = false, disabled = false, icon, id, optionsClassName = '', }) => {
|
|
27
27
|
const selection = items.find(v => v.key === selectedKey) ?? {
|
|
28
28
|
key: selectedKey,
|
|
29
29
|
element: { active: _jsx(_Fragment, { children: selectedKey }), expanded: _jsx(_Fragment, { children: selectedKey }) },
|
|
@@ -32,7 +32,7 @@ const Dropdown = ({ items, selectedKey, onSelection, placeholder, width, classNa
|
|
|
32
32
|
const styles = 'relative border rounded-md shadow-sm px-4 py-2 text-left cursor-default focus:outline-none focus:ring-1 items-center focus:ring-indigo-500 focus:border-indigo-500 text-sm flex gap-2 flex items-center justify-between';
|
|
33
33
|
const defaultStyles = 'bg-white dark:bg-gray-900 dark:border-gray-600';
|
|
34
34
|
const primaryStyles = 'text-gray-100 dark:gray-900 bg-indigo-600 border-indigo-500 font-medium py-2 px-4';
|
|
35
|
-
return (_jsx(Listbox, { value: selectedKey, onChange: onSelection, children: ({ open }) => (_jsxs("div", { className: "relative", children: [_jsx("div", { id: id, children: _jsxs(Listbox.Button, { className: cx(styles, width !== undefined ? `w-${width}` : 'w-full', disabled ? 'cursor-not-allowed opacity-50 pointer-events-none' : '', primary ? primaryStyles : defaultStyles, { [className]: className.length > 0 }), children: [_jsx("div", { className: cx(icon != null ? '' : 'block overflow-x-hidden text-ellipsis'), children: selection?.key !== '' ? selection.element.active : placeholder }), _jsx("div", { className: cx(icon != null ? '' : 'pointer-events-none text-gray-400'), children: icon ?? _jsx(Icon, { icon: "heroicons:chevron-up-down-20-solid", "aria-hidden": "true" }) })] }) }), _jsx(Transition, { show: open, as: Fragment, leave: "transition ease-in duration-100", leaveFrom: "opacity-100", leaveTo: "opacity-0", children: _jsx(Listbox.Options, { className:
|
|
35
|
+
return (_jsx(Listbox, { value: selectedKey, onChange: onSelection, children: ({ open }) => (_jsxs("div", { className: "relative", children: [_jsx("div", { id: id, children: _jsxs(Listbox.Button, { className: cx(styles, width !== undefined ? `w-${width}` : 'w-full', disabled ? 'cursor-not-allowed opacity-50 pointer-events-none' : '', primary ? primaryStyles : defaultStyles, { [className]: className.length > 0 }), children: [_jsx("div", { className: cx(icon != null ? '' : 'block overflow-x-hidden text-ellipsis'), children: selection?.key !== '' ? selection.element.active : placeholder }), _jsx("div", { className: cx(icon != null ? '' : 'pointer-events-none text-gray-400'), children: icon ?? _jsx(Icon, { icon: "heroicons:chevron-up-down-20-solid", "aria-hidden": "true" }) })] }) }), _jsx(Transition, { show: open, as: Fragment, leave: "transition ease-in duration-100", leaveFrom: "opacity-100", leaveTo: "opacity-0", children: _jsx(Listbox.Options, { className: cx(optionsClassName, 'absolute w-[246px] right-0 z-50 mt-1 max-h-[50vh] overflow-auto rounded-md bg-gray-50 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-gray-600 dark:bg-gray-900 dark:ring-white dark:ring-opacity-20 sm:text-sm'), children: loading === true ? (_jsx("div", { className: "w-[270px]", children: loader })) : (items.length > 0 &&
|
|
36
36
|
items.map(option => _jsx(DropdownOption, { option: option }, option.key))) }) })] })) }));
|
|
37
37
|
};
|
|
38
38
|
const DropdownOption = ({ option }) => {
|
|
@@ -1 +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,
|
|
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,OA0JlD,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -2,20 +2,24 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
2
2
|
import { useParcaContext, useURLState } from '@parca/components';
|
|
3
3
|
import Dropdown from './Dropdown';
|
|
4
4
|
const ViewSelector = ({ profileSource }) => {
|
|
5
|
-
const [dashboardItems = ['
|
|
5
|
+
const [dashboardItems = ['flamegraph'], setDashboardItems] = useURLState('dashboard_items', {
|
|
6
6
|
alwaysReturnArray: true,
|
|
7
7
|
});
|
|
8
8
|
const [, setSandwichFunctionName] = useURLState('sandwich_function_name');
|
|
9
9
|
const { enableSourcesView, enableSandwichView } = useParcaContext();
|
|
10
10
|
const allItems = [
|
|
11
|
-
{
|
|
11
|
+
{
|
|
12
|
+
key: 'flamegraph',
|
|
13
|
+
label: 'Flame Graph',
|
|
14
|
+
canBeSelected: !dashboardItems.includes('flamegraph'),
|
|
15
|
+
},
|
|
12
16
|
{ key: 'table', label: 'Table', canBeSelected: !dashboardItems.includes('table') },
|
|
13
17
|
{
|
|
14
|
-
key: '
|
|
15
|
-
label: (_jsxs("span", { className: "relative", children: ["
|
|
16
|
-
canBeSelected: !dashboardItems.includes('
|
|
17
|
-
disabledText: !dashboardItems.includes('
|
|
18
|
-
? '
|
|
18
|
+
key: 'flamechart',
|
|
19
|
+
label: (_jsxs("span", { className: "relative", children: ["Flame Chart", _jsx("span", { className: "absolute top-[-2px] text-xs lowercase text-red-500", children: "\u00A0alpha" })] })),
|
|
20
|
+
canBeSelected: !dashboardItems.includes('flamechart') && profileSource?.ProfileType().delta === true,
|
|
21
|
+
disabledText: !dashboardItems.includes('flamechart') && profileSource?.ProfileType().delta !== true
|
|
22
|
+
? 'Flamechart is not available for non-delta profiles'
|
|
19
23
|
: undefined,
|
|
20
24
|
},
|
|
21
25
|
];
|
|
@@ -86,6 +90,6 @@ const ViewSelector = ({ profileSource }) => {
|
|
|
86
90
|
const newDashboardItems = [dashboardItems[0], value];
|
|
87
91
|
setDashboardItems(newDashboardItems);
|
|
88
92
|
};
|
|
89
|
-
return (_jsx(Dropdown, { className: "h-view-selector", items: items, selectedKey: dashboardItems.length >= 2 ? 'Multiple' : dashboardItems[0], onSelection: onSelection, placeholder: 'Select view type...', id: "h-view-selector" }));
|
|
93
|
+
return (_jsx(Dropdown, { className: "h-view-selector", items: items, selectedKey: dashboardItems.length >= 2 ? 'Multiple' : dashboardItems[0], onSelection: onSelection, placeholder: 'Select view type...', id: "h-view-selector", optionsClassName: "min-w-[260px]" }));
|
|
90
94
|
};
|
|
91
95
|
export default ViewSelector;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/VisualizationContainer/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAGzB,OAAO,KAAK,EAAC,iBAAiB,EAAE,sBAAsB,EAAC,MAAM,qBAAqB,CAAC;AAGnF,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,2BAA2B;IACnC,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,EAAE,sBAAsB,CAAC;IACjC,aAAa,EAAE,iBAAiB,CAAC;IACjC,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,gBAAgB,EAAE,OAAO,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE;QACb,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/VisualizationContainer/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAGzB,OAAO,KAAK,EAAC,iBAAiB,EAAE,sBAAsB,EAAC,MAAM,qBAAqB,CAAC;AAGnF,OAAO,EAAC,iBAAiB,EAAC,MAAM,2BAA2B,CAAC;AAG5D,UAAU,2BAA2B;IACnC,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,EAAE,sBAAsB,CAAC;IACjC,aAAa,EAAE,iBAAiB,CAAC;IACjC,sBAAsB,EAAE,CAAC,KAAK,EAAE;QAAC,IAAI,EAAE,iBAAiB,CAAC;QAAC,YAAY,EAAE,OAAO,CAAA;KAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACjG,gBAAgB,EAAE,OAAO,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE;QACb,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;QACnB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;KACpB,CAAC;CACH;AAED,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAgClE,CAAC"}
|