@parca/profile 0.19.17 → 0.19.19

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.
Files changed (146) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/GraphTooltipArrow/useGraphTooltip/index.js +2 -2
  3. package/dist/GraphTooltipArrow/useGraphTooltipMetaInfo/index.js +2 -2
  4. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenu.d.ts.map +1 -0
  5. package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.d.ts +1 -1
  6. package/dist/ProfileFlameGraph/FlameGraphArrow/ContextMenuWrapper.d.ts.map +1 -0
  7. package/dist/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.d.ts} +8 -8
  8. package/dist/ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.d.ts.map +1 -0
  9. package/dist/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.js → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.js} +14 -14
  10. package/dist/ProfileFlameGraph/FlameGraphArrow/MemoizedTooltip.d.ts.map +1 -0
  11. package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.js +1 -1
  12. package/dist/ProfileFlameGraph/FlameGraphArrow/TextWithEllipsis.d.ts.map +1 -0
  13. package/dist/ProfileFlameGraph/FlameGraphArrow/TooltipContext.d.ts.map +1 -0
  14. package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.d.ts +7 -7
  15. package/dist/ProfileFlameGraph/FlameGraphArrow/index.d.ts.map +1 -0
  16. package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.js +18 -15
  17. package/dist/ProfileFlameGraph/FlameGraphArrow/useMappingList.d.ts.map +1 -0
  18. package/dist/ProfileFlameGraph/FlameGraphArrow/useNodeColor.d.ts.map +1 -0
  19. package/dist/ProfileFlameGraph/FlameGraphArrow/utils.d.ts.map +1 -0
  20. package/dist/{ProfileIcicleGraph → ProfileFlameGraph}/index.d.ts +8 -8
  21. package/dist/ProfileFlameGraph/index.d.ts.map +1 -0
  22. package/dist/{ProfileIcicleGraph → ProfileFlameGraph}/index.js +33 -33
  23. package/dist/ProfileSelector/useAutoQuerySelector.js +1 -1
  24. package/dist/ProfileView/components/ActionButtons/GroupByDropdown.d.ts.map +1 -1
  25. package/dist/ProfileView/components/ActionButtons/GroupByDropdown.js +1 -1
  26. package/dist/ProfileView/components/ActionButtons/SortByDropdown.js +1 -1
  27. package/dist/ProfileView/components/ColorStackLegend.js +2 -2
  28. package/dist/ProfileView/components/DashboardItems/index.d.ts +1 -1
  29. package/dist/ProfileView/components/DashboardItems/index.d.ts.map +1 -1
  30. package/dist/ProfileView/components/DashboardItems/index.js +7 -7
  31. package/dist/ProfileView/components/DashboardLayout/index.d.ts +1 -1
  32. package/dist/ProfileView/components/DashboardLayout/index.d.ts.map +1 -1
  33. package/dist/ProfileView/components/DiffLegend.js +1 -1
  34. package/dist/ProfileView/components/GroupByLabelsDropdown/index.js +1 -1
  35. package/dist/ProfileView/components/InvertCallStack/index.d.ts.map +1 -1
  36. package/dist/ProfileView/components/InvertCallStack/index.js +1 -1
  37. package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js +1 -1
  38. package/dist/ProfileView/components/Toolbars/index.d.ts +5 -5
  39. package/dist/ProfileView/components/Toolbars/index.d.ts.map +1 -1
  40. package/dist/ProfileView/components/Toolbars/index.js +4 -4
  41. package/dist/ProfileView/components/ViewSelector/Dropdown.d.ts +2 -1
  42. package/dist/ProfileView/components/ViewSelector/Dropdown.d.ts.map +1 -1
  43. package/dist/ProfileView/components/ViewSelector/Dropdown.js +2 -2
  44. package/dist/ProfileView/components/ViewSelector/index.d.ts.map +1 -1
  45. package/dist/ProfileView/components/ViewSelector/index.js +12 -8
  46. package/dist/ProfileView/components/VisualizationContainer/index.d.ts +1 -1
  47. package/dist/ProfileView/components/VisualizationContainer/index.d.ts.map +1 -1
  48. package/dist/ProfileView/components/VisualizationPanel.d.ts +1 -1
  49. package/dist/ProfileView/components/VisualizationPanel.d.ts.map +1 -1
  50. package/dist/ProfileView/components/VisualizationPanel.js +1 -1
  51. package/dist/ProfileView/hooks/useProfileMetadata.js +1 -1
  52. package/dist/ProfileView/hooks/useVisualizationState.d.ts +1 -1
  53. package/dist/ProfileView/hooks/useVisualizationState.d.ts.map +1 -1
  54. package/dist/ProfileView/hooks/useVisualizationState.js +1 -1
  55. package/dist/ProfileView/index.js +3 -3
  56. package/dist/ProfileView/types/visualization.d.ts +1 -1
  57. package/dist/ProfileView/types/visualization.d.ts.map +1 -1
  58. package/dist/ProfileViewWithData.js +10 -10
  59. package/dist/Sandwich/components/CalleesSection.d.ts +1 -1
  60. package/dist/Sandwich/components/CalleesSection.d.ts.map +1 -1
  61. package/dist/Sandwich/components/CalleesSection.js +3 -3
  62. package/dist/Sandwich/components/CallersSection.d.ts +1 -1
  63. package/dist/Sandwich/components/CallersSection.d.ts.map +1 -1
  64. package/dist/Sandwich/components/CallersSection.js +3 -3
  65. package/dist/Sandwich/index.d.ts.map +1 -1
  66. package/dist/Sandwich/index.js +3 -5
  67. package/dist/Sandwich/utils/processRowData.d.ts +1 -1
  68. package/dist/Sandwich/utils/processRowData.d.ts.map +1 -1
  69. package/dist/Table/hooks/useColorManagement.js +1 -1
  70. package/dist/Table/index.js +2 -2
  71. package/dist/Table/utils/functions.d.ts +1 -1
  72. package/dist/Table/utils/functions.d.ts.map +1 -1
  73. package/dist/index.d.ts +1 -1
  74. package/dist/index.d.ts.map +1 -1
  75. package/dist/index.js +2 -2
  76. package/package.json +7 -7
  77. package/src/GraphTooltipArrow/useGraphTooltip/index.ts +2 -2
  78. package/src/GraphTooltipArrow/useGraphTooltipMetaInfo/index.ts +2 -2
  79. package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.tsx +1 -1
  80. package/src/{ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.tsx → ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes.tsx} +27 -30
  81. package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.tsx +1 -1
  82. package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/index.tsx +30 -26
  83. package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-10M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-10M.benchmark.tsx} +2 -2
  84. package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-1M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-1M.benchmark.tsx} +2 -2
  85. package/src/{ProfileIcicleGraph/benchmarks/ProfileIcicleGraph-20M.benchmark.tsx → ProfileFlameGraph/benchmarks/ProfileFlameGraph-20M.benchmark.tsx} +2 -2
  86. package/src/{ProfileIcicleGraph → ProfileFlameGraph}/index.tsx +57 -57
  87. package/src/ProfileSelector/useAutoQuerySelector.ts +1 -1
  88. package/src/ProfileView/components/ActionButtons/GroupByDropdown.tsx +6 -8
  89. package/src/ProfileView/components/ActionButtons/SortByDropdown.tsx +1 -1
  90. package/src/ProfileView/components/ColorStackLegend.tsx +2 -2
  91. package/src/ProfileView/components/DashboardItems/index.tsx +8 -8
  92. package/src/ProfileView/components/DashboardLayout/index.tsx +1 -1
  93. package/src/ProfileView/components/DiffLegend.tsx +3 -3
  94. package/src/ProfileView/components/GroupByLabelsDropdown/index.tsx +1 -1
  95. package/src/ProfileView/components/InvertCallStack/index.tsx +1 -0
  96. package/src/ProfileView/components/Toolbars/MultiLevelDropdown.tsx +1 -1
  97. package/src/ProfileView/components/Toolbars/index.tsx +8 -8
  98. package/src/ProfileView/components/ViewSelector/Dropdown.tsx +8 -1
  99. package/src/ProfileView/components/ViewSelector/index.tsx +12 -7
  100. package/src/ProfileView/components/VisualizationContainer/index.tsx +1 -1
  101. package/src/ProfileView/components/VisualizationPanel.tsx +4 -4
  102. package/src/ProfileView/hooks/useProfileMetadata.ts +1 -1
  103. package/src/ProfileView/hooks/useVisualizationState.ts +2 -2
  104. package/src/ProfileView/index.tsx +4 -4
  105. package/src/ProfileView/types/visualization.ts +2 -2
  106. package/src/ProfileViewWithData.tsx +10 -10
  107. package/src/Sandwich/components/CalleesSection.tsx +4 -4
  108. package/src/Sandwich/components/CallersSection.tsx +5 -5
  109. package/src/Sandwich/index.tsx +10 -4
  110. package/src/Sandwich/utils/processRowData.ts +1 -1
  111. package/src/Table/hooks/useColorManagement.ts +1 -1
  112. package/src/Table/index.tsx +2 -2
  113. package/src/Table/utils/functions.ts +1 -1
  114. package/src/index.tsx +2 -2
  115. package/dist/ProfileIcicleGraph/IcicleGraphArrow/ContextMenu.d.ts.map +0 -1
  116. package/dist/ProfileIcicleGraph/IcicleGraphArrow/ContextMenuWrapper.d.ts.map +0 -1
  117. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts.map +0 -1
  118. package/dist/ProfileIcicleGraph/IcicleGraphArrow/MemoizedTooltip.d.ts.map +0 -1
  119. package/dist/ProfileIcicleGraph/IcicleGraphArrow/TextWithEllipsis.d.ts.map +0 -1
  120. package/dist/ProfileIcicleGraph/IcicleGraphArrow/TooltipContext.d.ts.map +0 -1
  121. package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.d.ts.map +0 -1
  122. package/dist/ProfileIcicleGraph/IcicleGraphArrow/useMappingList.d.ts.map +0 -1
  123. package/dist/ProfileIcicleGraph/IcicleGraphArrow/useNodeColor.d.ts.map +0 -1
  124. package/dist/ProfileIcicleGraph/IcicleGraphArrow/utils.d.ts.map +0 -1
  125. package/dist/ProfileIcicleGraph/index.d.ts.map +0 -1
  126. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.d.ts +0 -0
  127. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.js +0 -0
  128. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenuWrapper.js +0 -0
  129. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/MemoizedTooltip.d.ts +0 -0
  130. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.d.ts +0 -0
  131. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.js +0 -0
  132. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.d.ts +0 -0
  133. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.js +0 -0
  134. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.d.ts +0 -0
  135. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.js +0 -0
  136. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.d.ts +0 -0
  137. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.js +0 -0
  138. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.d.ts +0 -0
  139. /package/dist/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.js +0 -0
  140. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/ContextMenu.tsx +0 -0
  141. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TextWithEllipsis.tsx +0 -0
  142. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/TooltipContext.tsx +0 -0
  143. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useMappingList.ts +0 -0
  144. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/useNodeColor.ts +0 -0
  145. /package/src/{ProfileIcicleGraph/IcicleGraphArrow → ProfileFlameGraph/FlameGraphArrow}/utils.ts +0 -0
  146. /package/src/{ProfileIcicleGraph → ProfileFlameGraph}/benchmarks/benchdata/populateData.js +0 -0
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  // Copyright 2022 The Parca Authors
3
3
  // Licensed under the Apache License, Version 2.0 (the "License");
4
4
  // you may not use this file except in compliance with the License.
@@ -17,7 +17,7 @@ import { AnimatePresence, motion } from 'framer-motion';
17
17
  import { QueryRequest_ReportType } from '@parca/client';
18
18
  import { useParcaContext, useURLState } from '@parca/components';
19
19
  import { useCurrentColorProfile } from '@parca/hooks';
20
- import useMappingList, { useFilenamesList, } from '../ProfileIcicleGraph/IcicleGraphArrow/useMappingList';
20
+ import useMappingList, { useFilenamesList, } from '../ProfileFlameGraph/FlameGraphArrow/useMappingList';
21
21
  import { useDashboard } from '../ProfileView/context/DashboardContext';
22
22
  import { useVisualizationState } from '../ProfileView/hooks/useVisualizationState';
23
23
  import { FIELD_FUNCTION_NAME } from '../Table';
@@ -123,8 +123,6 @@ const Sandwich = React.memo(function Sandwich({ data, filtered, profileType, loa
123
123
  },
124
124
  total: calleesFlamegraphResponse.total?.toString() ?? '0',
125
125
  }
126
- : undefined, calleesFlamegraphLoading: calleesFlamegraphLoading, calleesFlamegraphError: calleesFlamegraphError, filtered: filtered, profileSource: profileSource, curPathArrow: curPathArrow, setCurPathArrow: setCurPathArrow, metadataMappingFiles: metadataMappingFiles })] })) : (_jsx("div", { className: "items-center justify-center flex h-full w-full", children: _jsx("p", { className: "text-sm", children: dashboardItems.includes('table')
127
- ? 'Please select a function to view its callers and callees.'
128
- : 'Use the right-click menu on the flame graph to choose a function to view its callers and callees.' }) })) }) }, "sandwich-loaded") }) }));
126
+ : undefined, calleesFlamegraphLoading: calleesFlamegraphLoading, calleesFlamegraphError: calleesFlamegraphError, filtered: filtered, profileSource: profileSource, curPathArrow: curPathArrow, setCurPathArrow: setCurPathArrow, metadataMappingFiles: metadataMappingFiles })] })) : (_jsx("div", { className: "items-center justify-center flex h-full w-full", children: _jsx("p", { className: "text-sm", children: dashboardItems.includes('table') ? ('Please select a function to view its callers and callees.') : (_jsxs(_Fragment, { children: ["Use the right-click menu on the Flame", ' ', dashboardItems.includes('flamegraph') ? 'Graph' : 'Chart', " to choose a function to view its callers and callees."] })) }) })) }) }, "sandwich-loaded") }) }));
129
127
  });
130
128
  export default Sandwich;
@@ -1,5 +1,5 @@
1
1
  import { type Table } from 'apache-arrow';
2
- import { type colorByColors } from '../../ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes';
2
+ import { type colorByColors } from '../../ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes';
3
3
  import { type DataRow } from '../../Table/utils/functions';
4
4
  interface ProcessRowDataProps {
5
5
  table: Table | null;
@@ -1 +1 @@
1
- {"version":3,"file":"processRowData.d.ts","sourceRoot":"","sources":["../../../src/Sandwich/utils/processRowData.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,KAAK,KAAK,EAAC,MAAM,cAAc,CAAC;AAExC,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,4DAA4D,CAAC;AAY9F,OAAO,EAAuB,KAAK,OAAO,EAAC,MAAM,6BAA6B,CAAC;AAE/E,UAAU,mBAAmB;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,cAAc,CAAC,EAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAC,EAAE,mBAAmB,GAAG,OAAO,EAAE,CA0C9F"}
1
+ {"version":3,"file":"processRowData.d.ts","sourceRoot":"","sources":["../../../src/Sandwich/utils/processRowData.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,KAAK,KAAK,EAAC,MAAM,cAAc,CAAC;AAExC,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,yDAAyD,CAAC;AAY3F,OAAO,EAAuB,KAAK,OAAO,EAAC,MAAM,6BAA6B,CAAC;AAE/E,UAAU,mBAAmB;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,cAAc,CAAC,EAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAC,EAAE,mBAAmB,GAAG,OAAO,EAAE,CA0C9F"}
@@ -11,7 +11,7 @@
11
11
  // See the License for the specific language governing permissions and
12
12
  // limitations under the License.
13
13
  import { useMemo } from 'react';
14
- import { getFilenameColors, getMappingColors } from '../../ProfileIcicleGraph/IcicleGraphArrow';
14
+ import { getFilenameColors, getMappingColors } from '../../ProfileFlameGraph/FlameGraphArrow';
15
15
  export function useColorManagement({ isDarkMode, currentColorProfile, mappingsList, filenamesList, colorBy, }) {
16
16
  const filenameColors = useMemo(() => {
17
17
  return getFilenameColors(filenamesList, isDarkMode, currentColorProfile);
@@ -18,7 +18,7 @@ import { useContextMenu } from 'react-contexify';
18
18
  import { Table as TableComponent, TableSkeleton, useParcaContext, useURLState, } from '@parca/components';
19
19
  import { useCurrentColorProfile } from '@parca/hooks';
20
20
  import { isSearchMatch } from '@parca/utilities';
21
- import useMappingList, { useFilenamesList, } from '../ProfileIcicleGraph/IcicleGraphArrow/useMappingList';
21
+ import useMappingList, { useFilenamesList, } from '../ProfileFlameGraph/FlameGraphArrow/useMappingList';
22
22
  import { useProfileViewContext } from '../ProfileView/context/ProfileViewContext';
23
23
  import TableContextMenuWrapper from './TableContextMenuWrapper';
24
24
  import { useColorManagement } from './hooks/useColorManagement';
@@ -82,7 +82,7 @@ export const Table = React.memo(function Table({ data, total, filtered, profileT
82
82
  });
83
83
  const { columns, initialSorting, columnVisibility } = tableConfig;
84
84
  const selectSpan = useCallback((span) => {
85
- if (dashboardItems.includes('icicle')) {
85
+ if (dashboardItems.includes('flamegraph')) {
86
86
  setSearchString(span.trim());
87
87
  }
88
88
  else {
@@ -1,6 +1,6 @@
1
1
  import { type Row as RowType } from '@tanstack/table-core';
2
2
  import { Vector } from 'apache-arrow';
3
- import { colorByColors } from '../../ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes';
3
+ import { colorByColors } from '../../ProfileFlameGraph/FlameGraphArrow/FlameGraphNodes';
4
4
  export interface DataRow {
5
5
  id: number;
6
6
  moreActions?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"functions.d.ts","sourceRoot":"","sources":["../../../src/Table/utils/functions.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"functions.d.ts","sourceRoot":"","sources":["../../../src/Table/utils/functions.ts"],"names":[],"mappings":"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"}
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ import { useLabelNames } from './MatchersInput';
2
2
  import ProfileExplorer, { getExpressionAsAString } from './ProfileExplorer';
3
3
  import ProfileTypeSelector from './ProfileTypeSelector';
4
4
  import CustomSelect from './SimpleMatchers/Select';
5
- export * from './ProfileIcicleGraph';
5
+ export * from './ProfileFlameGraph';
6
6
  export * from './ProfileSource';
7
7
  export * from './ProfileView';
8
8
  export * from './ProfileViewWithData';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,eAAe,EAAE,EAAC,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AAC1E,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAEnD,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,uBAAuB,CAAC;AACtC,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AAEtC,eAAO,MAAM,qCAAqC;;CAEjD,CAAC;AAEF,OAAO,EAAC,eAAe,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,YAAY,EAAE,aAAa,EAAC,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,eAAe,EAAE,EAAC,sBAAsB,EAAC,MAAM,mBAAmB,CAAC;AAC1E,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,YAAY,MAAM,yBAAyB,CAAC;AAEnD,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,uBAAuB,CAAC;AACtC,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AAEtC,eAAO,MAAM,qCAAqC;;CAEjD,CAAC;AAEF,OAAO,EAAC,eAAe,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,YAAY,EAAE,aAAa,EAAC,CAAC"}
package/dist/index.js CHANGED
@@ -14,7 +14,7 @@ import { useLabelNames } from './MatchersInput';
14
14
  import ProfileExplorer, { getExpressionAsAString } from './ProfileExplorer';
15
15
  import ProfileTypeSelector from './ProfileTypeSelector';
16
16
  import CustomSelect from './SimpleMatchers/Select';
17
- export * from './ProfileIcicleGraph';
17
+ export * from './ProfileFlameGraph';
18
18
  export * from './ProfileSource';
19
19
  export * from './ProfileView';
20
20
  export * from './ProfileViewWithData';
@@ -23,6 +23,6 @@ export * from './ProfileTypeSelector';
23
23
  export * from './SourceView';
24
24
  export * from './ProfileMetricsGraph';
25
25
  export const DEFAULT_PROFILE_EXPLORER_PARAM_VALUES = {
26
- dashboard_items: 'icicle',
26
+ dashboard_items: 'flamegraph',
27
27
  };
28
28
  export { ProfileExplorer, ProfileTypeSelector, getExpressionAsAString, CustomSelect, useLabelNames };
package/package.json CHANGED
@@ -1,19 +1,19 @@
1
1
  {
2
2
  "name": "@parca/profile",
3
- "version": "0.19.17",
3
+ "version": "0.19.19",
4
4
  "description": "Profile viewing libraries",
5
5
  "dependencies": {
6
6
  "@floating-ui/react": "^0.27.12",
7
7
  "@headlessui/react": "^1.7.19",
8
8
  "@iconify/react": "^4.0.0",
9
- "@parca/client": "0.17.1",
10
- "@parca/components": "0.16.347",
9
+ "@parca/client": "0.17.2",
10
+ "@parca/components": "0.16.348",
11
11
  "@parca/dynamicsize": "0.16.65",
12
- "@parca/hooks": "0.0.92",
12
+ "@parca/hooks": "0.0.93",
13
13
  "@parca/icons": "0.16.72",
14
14
  "@parca/parser": "0.16.79",
15
- "@parca/store": "0.16.176",
16
- "@parca/utilities": "0.0.101",
15
+ "@parca/store": "0.16.177",
16
+ "@parca/utilities": "0.0.102",
17
17
  "@popperjs/core": "^2.11.8",
18
18
  "@protobuf-ts/runtime-rpc": "^2.5.0",
19
19
  "@storybook/preview-api": "^8.4.3",
@@ -78,5 +78,5 @@
78
78
  "access": "public",
79
79
  "registry": "https://registry.npmjs.org/"
80
80
  },
81
- "gitHead": "422c95c72f680573e84e73914826cd8cdb0984f2"
81
+ "gitHead": "55c867baa7c927d7184bc4811b0543f641d09633"
82
82
  }
@@ -21,8 +21,8 @@ import {
21
21
  FIELD_DIFF,
22
22
  FIELD_FLAT,
23
23
  FIELD_LOCATION_ADDRESS,
24
- } from '../../ProfileIcicleGraph/IcicleGraphArrow';
25
- import {getTextForCumulative, nodeLabel} from '../../ProfileIcicleGraph/IcicleGraphArrow/utils';
24
+ } from '../../ProfileFlameGraph/FlameGraphArrow';
25
+ import {getTextForCumulative, nodeLabel} from '../../ProfileFlameGraph/FlameGraphArrow/utils';
26
26
 
27
27
  interface Props {
28
28
  table: Table<any>;
@@ -26,8 +26,8 @@ import {
26
26
  FIELD_MAPPING_BUILD_ID,
27
27
  FIELD_MAPPING_FILE,
28
28
  FIELD_TIMESTAMP,
29
- } from '../../ProfileIcicleGraph/IcicleGraphArrow';
30
- import {arrowToString} from '../../ProfileIcicleGraph/IcicleGraphArrow/utils';
29
+ } from '../../ProfileFlameGraph/FlameGraphArrow';
30
+ import {arrowToString} from '../../ProfileFlameGraph/FlameGraphArrow/utils';
31
31
  import {ProfileSource} from '../../ProfileSource';
32
32
  import {useProfileViewContext} from '../../ProfileView/context/ProfileViewContext';
33
33
  import {useQuery} from '../../useQuery';
@@ -30,7 +30,7 @@ interface ContextMenuWrapperProps {
30
30
  hideMenu: () => void;
31
31
  hideBinary: (binaryToRemove: string) => void;
32
32
  unit?: string;
33
- isSandwich?: boolean;
33
+ isInSandwichView?: boolean;
34
34
  }
35
35
 
36
36
  export interface ContextMenuWrapperRef {
@@ -21,8 +21,6 @@ import {isSearchMatch} from '@parca/utilities';
21
21
 
22
22
  import 'react-contexify/dist/ReactContexify.css';
23
23
 
24
- import {USER_PREFERENCES} from '@parca/hooks';
25
-
26
24
  import {ProfileSource} from '../../ProfileSource';
27
25
  import TextWithEllipsis from './TextWithEllipsis';
28
26
  import {
@@ -32,7 +30,6 @@ import {
32
30
  FIELD_FUNCTION_FILE_NAME,
33
31
  FIELD_FUNCTION_NAME,
34
32
  FIELD_MAPPING_FILE,
35
- FIELD_PARENT,
36
33
  FIELD_TIMESTAMP,
37
34
  FIELD_VALUE_OFFSET,
38
35
  } from './index';
@@ -45,7 +42,7 @@ export interface colorByColors {
45
42
  [key: string]: string;
46
43
  }
47
44
 
48
- export interface IcicleNodeProps {
45
+ export interface FlameNodeProps {
49
46
  height: number;
50
47
  totalWidth: number;
51
48
  table: Table<any>;
@@ -59,30 +56,30 @@ export interface IcicleNodeProps {
59
56
  colorForSimilarNodes: string;
60
57
  selectedRow: number;
61
58
  onClick: () => void;
62
- isIcicleChart: boolean;
59
+ isFlameChart: boolean;
63
60
  profileSource: ProfileSource;
64
- isFlamegraph?: boolean;
65
- isSandwich?: boolean;
61
+ isRenderedAsFlamegraph?: boolean;
62
+ isInSandwichView?: boolean;
66
63
  maxDepth?: number;
67
64
  effectiveDepth?: number;
68
65
  tooltipId?: string;
69
66
 
70
- // Hovering row must only ever be used for highlighting similar nodes, otherwise it will cause performance issues as it causes the full iciclegraph to get rerendered every time the hovering row changes.
67
+ // Hovering row must only ever be used for highlighting similar nodes, otherwise it will cause performance issues as it causes the full flamegraph to get rerendered every time the hovering row changes.
71
68
  hoveringRow?: number;
72
69
  setHoveringRow: (row: number | undefined) => void;
73
70
  }
74
71
 
75
- export const icicleRectStyles = {
72
+ export const flameRectStyles = {
76
73
  cursor: 'pointer',
77
74
  transition: 'opacity .15s linear',
78
75
  };
79
- export const fadedIcicleRectStyles = {
76
+ export const fadedFlameRectStyles = {
80
77
  cursor: 'pointer',
81
78
  transition: 'opacity .15s linear',
82
79
  opacity: '0.5',
83
80
  };
84
81
 
85
- export const IcicleNode = React.memo(function IcicleNodeNoMemo({
82
+ export const FlameNode = React.memo(function FlameNodeNoMemo({
86
83
  table,
87
84
  row,
88
85
  colors,
@@ -98,14 +95,14 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
98
95
  onContextMenu,
99
96
  hoveringRow,
100
97
  setHoveringRow,
101
- isIcicleChart,
98
+ isFlameChart,
102
99
  profileSource,
103
- isFlamegraph = false,
104
- isSandwich = false,
100
+ isRenderedAsFlamegraph = false,
101
+ isInSandwichView = false,
105
102
  maxDepth = 0,
106
103
  effectiveDepth,
107
104
  tooltipId = 'default',
108
- }: IcicleNodeProps): React.JSX.Element {
105
+ }: FlameNodeProps): React.JSX.Element {
109
106
  // get the columns to read from
110
107
  const mappingColumn = table.getChild(FIELD_MAPPING_FILE);
111
108
  const functionNameColumn = table.getChild(FIELD_FUNCTION_NAME);
@@ -181,8 +178,8 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
181
178
  return <></>;
182
179
  }
183
180
 
184
- if (row === 0 && (isIcicleChart || isSandwich)) {
185
- // The root node is not rendered in the icicle chart or sandwich view, so we return null.
181
+ if (row === 0 && (isFlameChart || isInSandwichView)) {
182
+ // The root node is not rendered in the flame chart or sandwich view, so we return null.
186
183
  return <></>;
187
184
  }
188
185
 
@@ -190,7 +187,7 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
190
187
  const tsBounds = boundsFromProfileSource(profileSource);
191
188
  const total = cumulativeColumn?.get(selectedRow);
192
189
  const totalRatio = cumulative > total ? 1 : Number(cumulative) / Number(total);
193
- const width: number = isIcicleChart
190
+ const width: number = isFlameChart
194
191
  ? (Number(cumulative) / (Number(tsBounds[1]) - Number(tsBounds[0]))) * totalWidth
195
192
  : totalRatio * totalWidth;
196
193
 
@@ -200,12 +197,12 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
200
197
 
201
198
  const selectedDepth = depthColumn?.get(selectedRow);
202
199
  const styles =
203
- selectedDepth !== undefined && selectedDepth > depth ? fadedIcicleRectStyles : icicleRectStyles;
200
+ selectedDepth !== undefined && selectedDepth > depth ? fadedFlameRectStyles : flameRectStyles;
204
201
 
205
202
  const onMouseEnter = (): void => {
206
203
  setHoveringRow(row);
207
204
  window.dispatchEvent(
208
- new CustomEvent(`icicle-tooltip-update-${tooltipId}`, {
205
+ new CustomEvent(`flame-tooltip-update-${tooltipId}`, {
209
206
  detail: {row},
210
207
  })
211
208
  );
@@ -214,7 +211,7 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
214
211
  const onMouseLeave = (): void => {
215
212
  setHoveringRow(undefined);
216
213
  window.dispatchEvent(
217
- new CustomEvent(`icicle-tooltip-update-${tooltipId}`, {
214
+ new CustomEvent(`flame-tooltip-update-${tooltipId}`, {
218
215
  detail: {row: null},
219
216
  })
220
217
  );
@@ -226,25 +223,25 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
226
223
 
227
224
  const ts = tsColumn !== null ? Number(tsColumn.get(row)) : 0;
228
225
  const x =
229
- isIcicleChart && tsColumn !== null
226
+ isFlameChart && tsColumn !== null
230
227
  ? ((ts - Number(tsBounds[0])) / (Number(tsBounds[1]) - Number(tsBounds[0]))) * totalWidth
231
228
  : selectedDepth > depth
232
229
  ? 0
233
230
  : ((Number(valueOffset) - Number(selectionOffset)) / Number(total)) * totalWidth;
234
231
 
235
232
  const calculateY = (
236
- isFlamegraph: boolean,
237
- isSandwich: boolean,
238
- isIcicleChart: boolean,
233
+ isRenderedAsFlamegraph: boolean,
234
+ isInSandwichView: boolean,
235
+ isFlameChart: boolean,
239
236
  maxDepth: number,
240
237
  depth: number,
241
238
  height: number
242
239
  ): number => {
243
- if (isFlamegraph) {
240
+ if (isRenderedAsFlamegraph) {
244
241
  return (maxDepth - depth) * height; // Flamegraph is inverted
245
242
  }
246
243
 
247
- if (isIcicleChart || isSandwich) {
244
+ if (isFlameChart || isInSandwichView) {
248
245
  return (depth - 1) * height;
249
246
  }
250
247
 
@@ -252,9 +249,9 @@ export const IcicleNode = React.memo(function IcicleNodeNoMemo({
252
249
  };
253
250
 
254
251
  const y = calculateY(
255
- isFlamegraph,
256
- isSandwich,
257
- isIcicleChart,
252
+ isRenderedAsFlamegraph,
253
+ isInSandwichView,
254
+ isFlameChart,
258
255
  effectiveDepth ?? maxDepth,
259
256
  depth,
260
257
  height
@@ -38,7 +38,7 @@ export const MemoizedTooltip = memo(function MemoizedTooltip({
38
38
  setTooltipRow(event.detail.row);
39
39
  };
40
40
 
41
- const eventName = `icicle-tooltip-update-${tooltipId}`;
41
+ const eventName = `flame-tooltip-update-${tooltipId}`;
42
42
 
43
43
  // Delay to ensure all DOM updates and React renders are complete
44
44
  // This fixes the race condition in sandwich view
@@ -34,7 +34,7 @@ import {getLastItem, type ColorConfig} from '@parca/utilities';
34
34
  import {ProfileSource} from '../../ProfileSource';
35
35
  import {useProfileViewContext} from '../../ProfileView/context/ProfileViewContext';
36
36
  import ContextMenuWrapper, {ContextMenuWrapperRef} from './ContextMenuWrapper';
37
- import {IcicleNode, RowHeight, colorByColors} from './IcicleGraphNodes';
37
+ import {FlameNode, RowHeight, colorByColors} from './FlameGraphNodes';
38
38
  import {MemoizedTooltip} from './MemoizedTooltip';
39
39
  import {TooltipProvider} from './TooltipContext';
40
40
  import {useFilenamesList} from './useMappingList';
@@ -69,7 +69,7 @@ export const FIELD_PARENT = 'parent';
69
69
  export const FIELD_DEPTH = 'depth';
70
70
  export const FIELD_VALUE_OFFSET = 'value_offset';
71
71
 
72
- interface IcicleGraphArrowProps {
72
+ interface FlameGraphArrowProps {
73
73
  arrow: FlamegraphArrow;
74
74
  total: bigint;
75
75
  filtered: bigint;
@@ -81,9 +81,9 @@ interface IcicleGraphArrowProps {
81
81
  isHalfScreen: boolean;
82
82
  mappingsListFromMetadata: string[];
83
83
  compareAbsolute: boolean;
84
- isIcicleChart?: boolean;
85
- isFlamegraph?: boolean;
86
- isSandwich?: boolean;
84
+ isFlameChart?: boolean;
85
+ isRenderedAsFlamegraph?: boolean;
86
+ isInSandwichView?: boolean;
87
87
  tooltipId?: string;
88
88
  maxFrameCount?: number;
89
89
  isExpanded?: boolean;
@@ -130,7 +130,7 @@ function getMaxDepth(depthColumn: Vector<any> | null): number {
130
130
  return max;
131
131
  }
132
132
 
133
- export const IcicleGraphArrow = memo(function IcicleGraphArrow({
133
+ export const FlameGraphArrow = memo(function FlameGraphArrow({
134
134
  arrow,
135
135
  total,
136
136
  filtered,
@@ -141,13 +141,13 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
141
141
  profileSource,
142
142
  mappingsListFromMetadata,
143
143
  compareAbsolute,
144
- isIcicleChart = false,
145
- isFlamegraph = false,
146
- isSandwich = false,
144
+ isFlameChart = false,
145
+ isRenderedAsFlamegraph = false,
146
+ isInSandwichView = false,
147
147
  tooltipId = 'default',
148
148
  maxFrameCount,
149
149
  isExpanded = false,
150
- }: IcicleGraphArrowProps): React.JSX.Element {
150
+ }: FlameGraphArrowProps): React.JSX.Element {
151
151
  const [highlightSimilarStacksPreference] = useUserPreference<boolean>(
152
152
  USER_PREFERENCES.HIGHLIGHT_SIMILAR_STACKS.key
153
153
  );
@@ -174,16 +174,20 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
174
174
  if (perf?.markInteraction != null) {
175
175
  renderStartTime.current = performance.now();
176
176
  }
177
- }, [perf]);
177
+ }, [table, width, curPath, perf]);
178
178
 
179
179
  useEffect(() => {
180
180
  if (perf?.setMeasurement != null && renderStartTime.current > 0) {
181
- const renderTime = performance.now() - renderStartTime.current;
182
- perf.setMeasurement('flamegraph.render_time', renderTime);
181
+ const measureRenderTime = (): void => {
182
+ const renderTime = performance.now() - renderStartTime.current;
183
+ if (perf?.setMeasurement != null) {
184
+ perf.setMeasurement('flamegraph.render_time', renderTime);
185
+ }
186
+
187
+ renderStartTime.current = 0;
188
+ };
183
189
 
184
- if (renderTime > 500 && perf.captureMessage != null) {
185
- perf.captureMessage(`Slow flamegraph render: ${renderTime.toFixed(0)}ms`, 'warning');
186
- }
190
+ requestAnimationFrame(measureRenderTime);
187
191
  }
188
192
  }, [table, width, curPath, perf]);
189
193
 
@@ -251,7 +255,7 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
251
255
 
252
256
  const colorByColors: colorByColors = colorByList[colorByValue as ColorByKey];
253
257
 
254
- const MENU_ID = 'icicle-graph-context-menu';
258
+ const MENU_ID = 'flame-graph-context-menu';
255
259
  const contextMenuRef = useRef<ContextMenuWrapperRef>(null);
256
260
  const {show, hideAll} = useContextMenu({
257
261
  id: MENU_ID,
@@ -311,7 +315,7 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
311
315
  // Use deferred value to prevent UI blocking when expanding frames
312
316
  const deferredEffectiveDepth = useDeferredValue(effectiveDepth);
313
317
 
314
- const height = isSandwich
318
+ const height = isInSandwichView
315
319
  ? deferredEffectiveDepth * RowHeight
316
320
  : (deferredEffectiveDepth + 1) * RowHeight;
317
321
 
@@ -363,7 +367,7 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
363
367
  hideBinary={hideBinary}
364
368
  unit={arrow.unit}
365
369
  profileType={profileType}
366
- isSandwich={isSandwich}
370
+ isInSandwichView={isInSandwichView}
367
371
  />
368
372
  <MemoizedTooltip contextElement={svgElement} dockedMetainfo={dockedMetainfo} />
369
373
  <svg
@@ -374,7 +378,7 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
374
378
  ref={svg}
375
379
  >
376
380
  {Array.from({length: table.numRows}, (_, row) => (
377
- <IcicleNode
381
+ <FlameNode
378
382
  key={row}
379
383
  table={table}
380
384
  row={row} // root is always row 0 in the arrow record
@@ -388,8 +392,8 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
388
392
  colorForSimilarNodes={colorForSimilarNodes}
389
393
  selectedRow={selectedRow}
390
394
  onClick={() => {
391
- if (isIcicleChart) {
392
- // We don't want to expand in icicle charts.
395
+ if (isFlameChart) {
396
+ // We don't want to expand in flame charts.
393
397
  return;
394
398
  }
395
399
  handleRowClick(row);
@@ -397,10 +401,10 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
397
401
  onContextMenu={displayMenu}
398
402
  hoveringRow={highlightSimilarStacksPreference ? hoveringRow : undefined}
399
403
  setHoveringRow={highlightSimilarStacksPreference ? setHoveringRow : noop}
400
- isIcicleChart={isIcicleChart}
404
+ isFlameChart={isFlameChart}
401
405
  profileSource={profileSource}
402
- isFlamegraph={isFlamegraph}
403
- isSandwich={isSandwich}
406
+ isRenderedAsFlamegraph={isRenderedAsFlamegraph}
407
+ isInSandwichView={isInSandwichView}
404
408
  maxDepth={maxDepth}
405
409
  effectiveDepth={deferredEffectiveDepth}
406
410
  tooltipId={tooltipId}
@@ -412,4 +416,4 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({
412
416
  );
413
417
  });
414
418
 
415
- export default IcicleGraphArrow;
419
+ export default FlameGraphArrow;
@@ -12,7 +12,7 @@
12
12
  // limitations under the License.
13
13
 
14
14
  import React from 'react';
15
- import ProfileIcicleGraph from '..';
15
+ import ProfileFlameGraph from '..';
16
16
  import {Provider} from 'react-redux';
17
17
  import {createStore} from '@parca/store';
18
18
  import parca10mGraphData from './benchdata/parca-10m.json';
@@ -26,7 +26,7 @@ export default function ({callback = () => {}}): React.ReactElement {
26
26
  return (
27
27
  <div ref={callback}>
28
28
  <Provider store={reduxStore}>
29
- <ProfileIcicleGraph
29
+ <ProfileFlameGraph
30
30
  graph={parca10mGraph}
31
31
  sampleUnit={parca10mGraph.unit}
32
32
  curPath={[]}
@@ -12,7 +12,7 @@
12
12
  // limitations under the License.
13
13
 
14
14
  import React from 'react';
15
- import ProfileIcicleGraph from '../';
15
+ import ProfileFlameGraph from '../';
16
16
  import {Provider} from 'react-redux';
17
17
  import {createStore} from '@parca/store';
18
18
  import {Flamegraph} from '@parca/client';
@@ -26,7 +26,7 @@ export default function ({callback = () => {}}): React.ReactElement {
26
26
  return (
27
27
  <div ref={callback}>
28
28
  <Provider store={reduxStore}>
29
- <ProfileIcicleGraph
29
+ <ProfileFlameGraph
30
30
  graph={parca1mGraph}
31
31
  sampleUnit={parca1mGraph.unit}
32
32
  curPath={[]}
@@ -12,7 +12,7 @@
12
12
  // limitations under the License.
13
13
 
14
14
  import React from 'react';
15
- import ProfileIcicleGraph from '..';
15
+ import ProfileFlameGraph from '..';
16
16
  import {Provider} from 'react-redux';
17
17
  import {createStore} from '@parca/store';
18
18
  import parca20mGraphData from './benchdata/parca-20m.json';
@@ -26,7 +26,7 @@ export default function ({callback = () => {}}): React.ReactElement {
26
26
  return (
27
27
  <div ref={callback}>
28
28
  <Provider store={reduxStore}>
29
- <ProfileIcicleGraph
29
+ <ProfileFlameGraph
30
30
  graph={parca20mGraph}
31
31
  sampleUnit={parca20mGraph.unit}
32
32
  curPath={[]}