@parca/profile 0.16.456 → 0.16.457

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 (54) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/MetricsGraphStrips/index.d.ts +1 -0
  3. package/dist/MetricsGraphStrips/index.d.ts.map +1 -1
  4. package/dist/MetricsGraphStrips/index.js +3 -3
  5. package/dist/ProfileIcicleGraph/IcicleGraph/index.js +1 -1
  6. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleChartRootNode.d.ts +9 -0
  7. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleChartRootNode.d.ts.map +1 -0
  8. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleChartRootNode.js +51 -0
  9. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts +10 -1
  10. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.d.ts.map +1 -1
  11. package/dist/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.js +2 -2
  12. package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.d.ts +5 -0
  13. package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.d.ts.map +1 -1
  14. package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.js +9 -1
  15. package/dist/ProfileIcicleGraph/IcicleGraphArrow/utils.d.ts +3 -0
  16. package/dist/ProfileIcicleGraph/IcicleGraphArrow/utils.d.ts.map +1 -1
  17. package/dist/ProfileIcicleGraph/IcicleGraphArrow/utils.js +18 -0
  18. package/dist/ProfileIcicleGraph/index.d.ts +4 -1
  19. package/dist/ProfileIcicleGraph/index.d.ts.map +1 -1
  20. package/dist/ProfileIcicleGraph/index.js +6 -4
  21. package/dist/ProfileView/components/DashboardItems/index.d.ts +2 -1
  22. package/dist/ProfileView/components/DashboardItems/index.d.ts.map +1 -1
  23. package/dist/ProfileView/components/DashboardItems/index.js +7 -1
  24. package/dist/ProfileView/components/ViewSelector/index.d.ts.map +1 -1
  25. package/dist/ProfileView/components/ViewSelector/index.js +4 -1
  26. package/dist/ProfileView/index.d.ts +1 -1
  27. package/dist/ProfileView/index.d.ts.map +1 -1
  28. package/dist/ProfileView/index.js +3 -2
  29. package/dist/ProfileView/types/visualization.d.ts +2 -4
  30. package/dist/ProfileView/types/visualization.d.ts.map +1 -1
  31. package/dist/ProfileViewWithData.d.ts +1 -4
  32. package/dist/ProfileViewWithData.d.ts.map +1 -1
  33. package/dist/ProfileViewWithData.js +30 -7
  34. package/dist/TimelineGuide/index.d.ts +4 -3
  35. package/dist/TimelineGuide/index.d.ts.map +1 -1
  36. package/dist/TimelineGuide/index.js +9 -7
  37. package/dist/styles.css +1 -1
  38. package/dist/utils.d.ts +1 -0
  39. package/dist/utils.d.ts.map +1 -1
  40. package/package.json +7 -7
  41. package/src/MetricsGraphStrips/index.tsx +3 -3
  42. package/src/ProfileIcicleGraph/IcicleGraph/index.tsx +1 -1
  43. package/src/ProfileIcicleGraph/IcicleGraphArrow/IcicleChartRootNode.tsx +157 -0
  44. package/src/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.tsx +3 -3
  45. package/src/ProfileIcicleGraph/IcicleGraphArrow/index.tsx +58 -0
  46. package/src/ProfileIcicleGraph/IcicleGraphArrow/utils.ts +29 -1
  47. package/src/ProfileIcicleGraph/index.tsx +16 -6
  48. package/src/ProfileView/components/DashboardItems/index.tsx +27 -0
  49. package/src/ProfileView/components/ViewSelector/index.tsx +5 -1
  50. package/src/ProfileView/index.tsx +3 -3
  51. package/src/ProfileView/types/visualization.ts +2 -4
  52. package/src/ProfileViewWithData.tsx +36 -11
  53. package/src/TimelineGuide/index.tsx +41 -31
  54. package/src/utils.ts +1 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 0.16.457 (2025-01-06)
7
+
8
+ **Note:** Version bump only for package @parca/profile
9
+
6
10
  ## [0.16.456](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.455...@parca/profile@0.16.456) (2024-12-16)
7
11
 
8
12
  **Note:** Version bump only for package @parca/profile
@@ -11,6 +11,7 @@ interface Props {
11
11
  onSelectedTimeframe: (labels: LabelSet, bounds: NumberDuo | undefined) => void;
12
12
  width?: number;
13
13
  }
14
+ export declare const labelSetToString: (labelSet?: LabelSet) => string;
14
15
  export declare const MetricsGraphStrips: ({ cpus, data, selectedTimeframe, onSelectedTimeframe, width, }: Props) => JSX.Element;
15
16
  export {};
16
17
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MetricsGraphStrips/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAGvC,OAAO,EAAC,SAAS,EAAC,MAAM,UAAU,CAAC;AACnC,OAAO,EAAY,SAAS,EAAC,MAAM,aAAa,CAAC;AAEjD,UAAU,KAAK;IACb,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC;IACpB,iBAAiB,CAAC,EAAE;QAClB,MAAM,EAAE,QAAQ,CAAC;QACjB,MAAM,EAAE,SAAS,CAAC;KACnB,CAAC;IACF,mBAAmB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA2BD,eAAO,MAAM,kBAAkB,mEAM5B,KAAK,KAAG,GAAG,CAAC,OAmEd,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MetricsGraphStrips/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAC;AAGvC,OAAO,EAAC,SAAS,EAAC,MAAM,UAAU,CAAC;AACnC,OAAO,EAAY,SAAS,EAAC,MAAM,aAAa,CAAC;AAEjD,UAAU,KAAK;IACb,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC;IACpB,iBAAiB,CAAC,EAAE;QAClB,MAAM,EAAE,QAAQ,CAAC;QACjB,MAAM,EAAE,SAAS,CAAC;KACnB,CAAC;IACF,mBAAmB,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,gBAAgB,cAAe,QAAQ,KAAG,MAmBtD,CAAC;AAMF,eAAO,MAAM,kBAAkB,mEAM5B,KAAK,KAAG,GAAG,CAAC,OAmEd,CAAC"}
@@ -16,7 +16,7 @@ import { Icon } from '@iconify/react';
16
16
  import * as d3 from 'd3';
17
17
  import { TimelineGuide } from '../TimelineGuide';
18
18
  import { AreaGraph } from './AreaGraph';
19
- const labelSetToString = (labelSet) => {
19
+ export const labelSetToString = (labelSet) => {
20
20
  if (labelSet === undefined) {
21
21
  return '{}';
22
22
  }
@@ -40,7 +40,7 @@ export const MetricsGraphStrips = ({ cpus, data, selectedTimeframe, onSelectedTi
40
40
  // @ts-expect-error
41
41
  const color = d3.scaleOrdinal(d3.schemeObservable10);
42
42
  const bounds = useMemo(() => {
43
- const bounds = [Infinity, -Infinity];
43
+ const bounds = data.length > 0 ? [Infinity, -Infinity] : [0, 1];
44
44
  data.forEach(cpuData => {
45
45
  cpuData.forEach(dataPoint => {
46
46
  bounds[0] = Math.min(bounds[0], dataPoint.timestamp);
@@ -49,7 +49,7 @@ export const MetricsGraphStrips = ({ cpus, data, selectedTimeframe, onSelectedTi
49
49
  });
50
50
  return [0, bounds[1] - bounds[0]];
51
51
  }, [data]);
52
- return (_jsxs("div", { className: "flex flex-col gap-1 relative my-0 ml-[70px]", style: { width: width ?? '100%' }, children: [_jsx(TimelineGuide, { bounds: bounds, width: width ?? 1468, height: getTimelineGuideHeight(cpus, collapsedIndices), margin: 1 }), cpus.map((cpu, i) => {
52
+ return (_jsxs("div", { className: "flex flex-col gap-1 relative my-0 ml-[70px]", style: { width: width ?? '100%' }, children: [_jsx(TimelineGuide, { bounds: [BigInt(bounds[0]), BigInt(bounds[1])], width: width ?? 1468, height: getTimelineGuideHeight(cpus, collapsedIndices), margin: 1 }), cpus.map((cpu, i) => {
53
53
  const isCollapsed = collapsedIndices.includes(i);
54
54
  const labelStr = labelSetToString(cpu);
55
55
  return (_jsxs("div", { className: "relative min-h-5", style: { width: width ?? 1468 }, children: [_jsxs("div", { className: "text-xs absolute top-0 left-0 flex gap-[2px] items-center bg-white/50 px-1 rounded-sm cursor-pointer", style: {
@@ -36,7 +36,7 @@ export const IcicleGraph = memo(function IcicleGraph({ graph, total, filtered, w
36
36
  }, [width, coloredGraph]);
37
37
  const xScale = useMemo(() => {
38
38
  if (width === undefined) {
39
- return () => 0;
39
+ return scaleLinear([0n, total], [0, 1]);
40
40
  }
41
41
  return scaleLinear([0n, total], [0, width]);
42
42
  }, [total, width]);
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import { ProfileSource } from '../../ProfileSource';
3
+ import { IcicleNodeProps } from './IcicleGraphNodes';
4
+ interface IcicleChartRootNodeSpecificProps {
5
+ profileSource?: ProfileSource;
6
+ }
7
+ export declare const IcicleChartRootNode: React.NamedExoticComponent<IcicleNodeProps & IcicleChartRootNodeSpecificProps>;
8
+ export {};
9
+ //# sourceMappingURL=IcicleChartRootNode.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IcicleChartRootNode.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/IcicleChartRootNode.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAa,eAAe,EAAY,MAAM,oBAAoB,CAAC;AAG1E,UAAU,gCAAgC;IACxC,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,eAAO,MAAM,mBAAmB,gFA8H9B,CAAC"}
@@ -0,0 +1,51 @@
1
+ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ // Copyright 2022 The Parca Authors
3
+ // Licensed under the Apache License, Version 2.0 (the "License");
4
+ // you may not use this file except in compliance with the License.
5
+ // You may obtain a copy of the License at
6
+ //
7
+ // http://www.apache.org/licenses/LICENSE-2.0
8
+ //
9
+ // Unless required by applicable law or agreed to in writing, software
10
+ // distributed under the License is distributed on an "AS IS" BASIS,
11
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
+ // See the License for the specific language governing permissions and
13
+ // limitations under the License.
14
+ import React from 'react';
15
+ import cx from 'classnames';
16
+ import twColors from 'tailwindcss/colors';
17
+ import { scaleLinear } from '@parca/utilities';
18
+ import { FIELD_CHILDREN, FIELD_CUMULATIVE, FIELD_GROUPBY_METADATA } from '.';
19
+ import { IcicleNode, RowHeight } from './IcicleGraphNodes';
20
+ import { arrowToString, boundsFromProfileSource } from './utils';
21
+ export const IcicleChartRootNode = React.memo(function IcicleChartRootNodeNonMemo({ table, row, colors, colorBy, y, height, setCurPath, curPath, level, path, total, totalWidth, xScale, searchString, setHoveringRow, setHoveringLevel, sortBy, darkMode, compareMode, profileType, isContextMenuOpen, hoveringName, setHoveringName, hoveringRow, colorForSimilarNodes, highlightSimilarStacksPreference, profileSource, }) {
22
+ // get the columns to read from
23
+ const cumulativeColumn = table.getChild(FIELD_CUMULATIVE);
24
+ const groupByMetadata = table.getChild(FIELD_GROUPBY_METADATA);
25
+ const cumulative = cumulativeColumn?.get(row) !== null ? BigInt(cumulativeColumn?.get(row)) : 0n;
26
+ const childRows = Array.from(table.getChild(FIELD_CHILDREN)?.get(row) ?? []).sort((a, b) => a - b);
27
+ const tsBounds = boundsFromProfileSource(profileSource);
28
+ const nextLevel = level + 1;
29
+ const nextCurPath = curPath.length === 0 ? [] : curPath.slice(1);
30
+ const tsXScale = scaleLinear([tsBounds[0], tsBounds[1]], [0, totalWidth]);
31
+ const width = nextCurPath.length > 0 || (nextCurPath.length === 0 && curPath.length === 1)
32
+ ? totalWidth
33
+ : xScale(BigInt(cumulative));
34
+ if (width <= 1) {
35
+ return _jsx(_Fragment, { children: null });
36
+ }
37
+ return (_jsx(_Fragment, { children: childRows.map(row => {
38
+ const groupByFields = (groupByMetadata?.get(row)).toJSON();
39
+ const tsStr = arrowToString(groupByFields.timestamp);
40
+ const tsNanos = BigInt(parseInt(tsStr, 10)) * 1000000n;
41
+ const durationStr = arrowToString(groupByFields.duration);
42
+ const duration = parseInt(durationStr, 10);
43
+ const x = tsXScale(tsNanos);
44
+ const width = tsXScale(tsNanos + BigInt(Math.round(duration))) - x;
45
+ const cumulative = cumulativeColumn?.get(row) !== null ? BigInt(cumulativeColumn?.get(row)) : 0n;
46
+ const newXScale = scaleLinear([0n, BigInt(cumulative)], [0, width]);
47
+ return (_jsxs(_Fragment, { children: [_jsxs("g", { transform: `translate(${x + 1}, ${y + 1})`, children: [_jsx("rect", { x: 0, y: 0, width: width, height: RowHeight, style: {
48
+ fill: darkMode ? twColors.gray[500] : twColors.gray[200],
49
+ }, className: cx(`stroke-white dark:stroke-gray-700 fill-gray-600 dark:fill-gray-100`) }), _jsx("svg", { width: width - 5, height: height, children: _jsx("text", { x: 5, y: 15, style: { fontSize: '12px' }, children: "root" }) })] }), _jsx(IcicleNode, { table: table, row: row, colors: colors, colorBy: colorBy, x: x, y: RowHeight, totalWidth: width ?? 1, height: RowHeight, setCurPath: setCurPath, curPath: curPath, total: total, xScale: newXScale, path: path, level: nextLevel, searchString: searchString ?? '', setHoveringRow: setHoveringRow, setHoveringLevel: setHoveringLevel, sortBy: sortBy, darkMode: darkMode, compareMode: compareMode, profileType: profileType, isContextMenuOpen: isContextMenuOpen, hoveringName: hoveringName, setHoveringName: setHoveringName, hoveringRow: hoveringRow, colorForSimilarNodes: colorForSimilarNodes, highlightSimilarStacksPreference: highlightSimilarStacksPreference }, row)] }));
50
+ }) }));
51
+ });
@@ -36,7 +36,7 @@ export declare const IcicleGraphNodes: React.NamedExoticComponent<IcicleGraphNod
36
36
  export interface colorByColors {
37
37
  [key: string]: string;
38
38
  }
39
- interface IcicleNodeProps {
39
+ export interface IcicleNodeProps {
40
40
  x: number;
41
41
  y: number;
42
42
  height: number;
@@ -66,6 +66,15 @@ interface IcicleNodeProps {
66
66
  colorForSimilarNodes: string;
67
67
  highlightSimilarStacksPreference: boolean;
68
68
  }
69
+ export declare const icicleRectStyles: {
70
+ cursor: string;
71
+ transition: string;
72
+ };
73
+ export declare const fadedIcicleRectStyles: {
74
+ cursor: string;
75
+ transition: string;
76
+ opacity: string;
77
+ };
69
78
  export declare const IcicleNode: React.NamedExoticComponent<IcicleNodeProps>;
70
79
  export {};
71
80
  //# sourceMappingURL=IcicleGraphNodes.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"IcicleGraphNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"IcicleGraphNodes.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/IcicleGraphNodes.tsx"],"names":[],"mappings":"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"}
@@ -40,11 +40,11 @@ export const IcicleGraphNodes = React.memo(function IcicleGraphNodesNoMemo({ tab
40
40
  });
41
41
  return _jsx("g", { transform: `translate(${x}, ${y})`, children: childrenElements });
42
42
  });
43
- const icicleRectStyles = {
43
+ export const icicleRectStyles = {
44
44
  cursor: 'pointer',
45
45
  transition: 'opacity .15s linear',
46
46
  };
47
- const fadedIcicleRectStyles = {
47
+ export const fadedIcicleRectStyles = {
48
48
  cursor: 'pointer',
49
49
  transition: 'opacity .15s linear',
50
50
  opacity: '0.5',
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import { FlamegraphArrow } from '@parca/client';
3
3
  import { ProfileType } from '@parca/parser';
4
4
  import { type ColorConfig } from '@parca/utilities';
5
+ import { ProfileSource } from '../../ProfileSource';
5
6
  import { colorByColors } from './IcicleGraphNodes';
6
7
  export declare const FIELD_LABELS_ONLY = "labels_only";
7
8
  export declare const FIELD_MAPPING_FILE = "mapping_file";
@@ -10,6 +11,8 @@ export declare const FIELD_LOCATION_ADDRESS = "location_address";
10
11
  export declare const FIELD_LOCATION_LINE = "location_line";
11
12
  export declare const FIELD_INLINED = "inlined";
12
13
  export declare const FIELD_TIMESTAMP = "timestamp";
14
+ export declare const FIELD_DURATION = "duration";
15
+ export declare const FIELD_GROUPBY_METADATA = "groupby_metadata";
13
16
  export declare const FIELD_FUNCTION_NAME = "function_name";
14
17
  export declare const FIELD_FUNCTION_SYSTEM_NAME = "function_system_name";
15
18
  export declare const FIELD_FUNCTION_FILE_NAME = "function_file_name";
@@ -24,6 +27,7 @@ interface IcicleGraphArrowProps {
24
27
  total: bigint;
25
28
  filtered: bigint;
26
29
  profileType?: ProfileType;
30
+ profileSource?: ProfileSource;
27
31
  width?: number;
28
32
  curPath: string[];
29
33
  setCurPath: (path: string[]) => void;
@@ -32,6 +36,7 @@ interface IcicleGraphArrowProps {
32
36
  isHalfScreen: boolean;
33
37
  mappingsListFromMetadata: string[];
34
38
  compareAbsolute: boolean;
39
+ isIcicleChart?: boolean;
35
40
  }
36
41
  export declare const getMappingColors: (mappingsList: string[], isDarkMode: boolean, currentColorProfile: ColorConfig) => colorByColors;
37
42
  export declare const getFilenameColors: (filenamesList: string[], isDarkMode: boolean, currentColorProfile: ColorConfig) => colorByColors;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgE,MAAM,OAAO,CAAC;AAKrF,OAAO,EAAC,eAAe,EAAC,MAAM,eAAe,CAAC;AAG9C,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAQ1C,OAAO,EAA2B,KAAK,WAAW,EAAC,MAAM,kBAAkB,CAAC;AAO5E,OAAO,EAAwB,aAAa,EAAC,MAAM,oBAAoB,CAAC;AAIxE,eAAO,MAAM,iBAAiB,gBAAgB,CAAC;AAC/C,eAAO,MAAM,kBAAkB,iBAAiB,CAAC;AACjD,eAAO,MAAM,sBAAsB,qBAAqB,CAAC;AACzD,eAAO,MAAM,sBAAsB,qBAAqB,CAAC;AACzD,eAAO,MAAM,mBAAmB,kBAAkB,CAAC;AACnD,eAAO,MAAM,aAAa,YAAY,CAAC;AACvC,eAAO,MAAM,eAAe,cAAc,CAAC;AAC3C,eAAO,MAAM,mBAAmB,kBAAkB,CAAC;AACnD,eAAO,MAAM,0BAA0B,yBAAyB,CAAC;AACjE,eAAO,MAAM,wBAAwB,uBAAuB,CAAC;AAC7D,eAAO,MAAM,yBAAyB,uBAAuB,CAAC;AAC9D,eAAO,MAAM,cAAc,aAAa,CAAC;AACzC,eAAO,MAAM,YAAY,WAAW,CAAC;AACrC,eAAO,MAAM,gBAAgB,eAAe,CAAC;AAC7C,eAAO,MAAM,UAAU,SAAS,CAAC;AACjC,eAAO,MAAM,UAAU,SAAS,CAAC;AAEjC,UAAU,qBAAqB;IAC7B,KAAK,EAAE,eAAe,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;IACtB,wBAAwB,EAAE,MAAM,EAAE,CAAC;IACnC,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,gBAAgB,iBACb,MAAM,EAAE,cACV,OAAO,uBACE,WAAW,KAC/B,aAQF,CAAC;AAEF,eAAO,MAAM,iBAAiB,kBACb,MAAM,EAAE,cACX,OAAO,uBACE,WAAW,KAC/B,aAQF,CAAC;AAIF,eAAO,MAAM,gBAAgB,mDAiR3B,CAAC;AAEH,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgE,MAAM,OAAO,CAAC;AAKrF,OAAO,EAAC,eAAe,EAAC,MAAM,eAAe,CAAC;AAG9C,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAQ1C,OAAO,EAA2B,KAAK,WAAW,EAAC,MAAM,kBAAkB,CAAC;AAK5E,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAIlD,OAAO,EAAwB,aAAa,EAAC,MAAM,oBAAoB,CAAC;AAIxE,eAAO,MAAM,iBAAiB,gBAAgB,CAAC;AAC/C,eAAO,MAAM,kBAAkB,iBAAiB,CAAC;AACjD,eAAO,MAAM,sBAAsB,qBAAqB,CAAC;AACzD,eAAO,MAAM,sBAAsB,qBAAqB,CAAC;AACzD,eAAO,MAAM,mBAAmB,kBAAkB,CAAC;AACnD,eAAO,MAAM,aAAa,YAAY,CAAC;AACvC,eAAO,MAAM,eAAe,cAAc,CAAC;AAC3C,eAAO,MAAM,cAAc,aAAa,CAAC;AACzC,eAAO,MAAM,sBAAsB,qBAAqB,CAAC;AACzD,eAAO,MAAM,mBAAmB,kBAAkB,CAAC;AACnD,eAAO,MAAM,0BAA0B,yBAAyB,CAAC;AACjE,eAAO,MAAM,wBAAwB,uBAAuB,CAAC;AAC7D,eAAO,MAAM,yBAAyB,uBAAuB,CAAC;AAC9D,eAAO,MAAM,cAAc,aAAa,CAAC;AACzC,eAAO,MAAM,YAAY,WAAW,CAAC;AACrC,eAAO,MAAM,gBAAgB,eAAe,CAAC;AAC7C,eAAO,MAAM,UAAU,SAAS,CAAC;AACjC,eAAO,MAAM,UAAU,SAAS,CAAC;AAEjC,UAAU,qBAAqB;IAC7B,KAAK,EAAE,eAAe,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;IACtB,wBAAwB,EAAE,MAAM,EAAE,CAAC;IACnC,eAAe,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,gBAAgB,iBACb,MAAM,EAAE,cACV,OAAO,uBACE,WAAW,KAC/B,aAQF,CAAC;AAEF,eAAO,MAAM,iBAAiB,kBACb,MAAM,EAAE,cACX,OAAO,uBACE,WAAW,KAC/B,aAQF,CAAC;AAIF,eAAO,MAAM,gBAAgB,mDAqU3B,CAAC;AAEH,eAAe,gBAAgB,CAAC"}
@@ -23,6 +23,7 @@ import GraphTooltipArrowContent from '../../GraphTooltipArrow/Content';
23
23
  import { DockedGraphTooltip } from '../../GraphTooltipArrow/DockedGraphTooltip';
24
24
  import { useProfileViewContext } from '../../ProfileView/context/ProfileViewContext';
25
25
  import ContextMenu from './ContextMenu';
26
+ import { IcicleChartRootNode } from './IcicleChartRootNode';
26
27
  import { IcicleNode, RowHeight } from './IcicleGraphNodes';
27
28
  import { useFilenamesList } from './useMappingList';
28
29
  import { arrowToString, extractFeature, extractFilenameFeature } from './utils';
@@ -33,6 +34,8 @@ export const FIELD_LOCATION_ADDRESS = 'location_address';
33
34
  export const FIELD_LOCATION_LINE = 'location_line';
34
35
  export const FIELD_INLINED = 'inlined';
35
36
  export const FIELD_TIMESTAMP = 'timestamp';
37
+ export const FIELD_DURATION = 'duration';
38
+ export const FIELD_GROUPBY_METADATA = 'groupby_metadata';
36
39
  export const FIELD_FUNCTION_NAME = 'function_name';
37
40
  export const FIELD_FUNCTION_SYSTEM_NAME = 'function_system_name';
38
41
  export const FIELD_FUNCTION_FILE_NAME = 'function_file_name';
@@ -59,7 +62,7 @@ export const getFilenameColors = (filenamesList, isDarkMode, currentColorProfile
59
62
  return colors;
60
63
  };
61
64
  const noop = () => { };
62
- export const IcicleGraphArrow = memo(function IcicleGraphArrow({ arrow, total, filtered, width, setCurPath, curPath, profileType, sortBy, flamegraphLoading, mappingsListFromMetadata, compareAbsolute, }) {
65
+ export const IcicleGraphArrow = memo(function IcicleGraphArrow({ arrow, total, filtered, width, setCurPath, curPath, profileType, profileSource, sortBy, flamegraphLoading, mappingsListFromMetadata, compareAbsolute, isIcicleChart = false, }) {
63
66
  const [isContextMenuOpen, setIsContextMenuOpen] = useState(false);
64
67
  const dispatch = useAppDispatch();
65
68
  const [highlightSimilarStacksPreference] = useUserPreference(USER_PREFERENCES.HIGHLIGHT_SIMILAR_STACKS.key);
@@ -168,6 +171,9 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({ arrow, total, f
168
171
  }, []);
169
172
  // useMemo for the root graph as it otherwise renders the whole graph if the hoveringRow changes.
170
173
  const root = useMemo(() => {
174
+ if (isIcicleChart) {
175
+ return (_jsx("svg", { className: "font-robotoMono", width: width, height: height, preserveAspectRatio: "xMinYMid", ref: svg, onContextMenu: displayMenu, children: _jsx("g", { ref: ref, children: _jsx("g", { transform: 'translate(0, 0)', children: _jsx(IcicleChartRootNode, { table: table, row: 0, colors: colorByColors, colorBy: colorByValue, x: 0, y: 0, totalWidth: width ?? 1, height: RowHeight, setCurPath: setCurPath, curPath: curPath, total: total, xScale: xScale, path: path, level: 0, isRoot: true, searchString: currentSearchString ?? '', setHoveringRow: setHoveringRow, setHoveringLevel: setHoveringLevel, sortBy: sortBy, darkMode: isDarkMode, compareMode: compareMode, profileType: profileType, isContextMenuOpen: isContextMenuOpen, hoveringName: highlightSimilarStacksName, setHoveringName: highlightSimilarStacksSetName, hoveringRow: highlightSimilarStacksRow, colorForSimilarNodes: colorForSimilarNodes, highlightSimilarStacksPreference: highlightSimilarStacksPreference, profileSource: profileSource }) }) }) }));
176
+ }
171
177
  return (_jsx("svg", { className: "font-robotoMono", width: width, height: height, preserveAspectRatio: "xMinYMid", ref: svg, onContextMenu: displayMenu, children: _jsx("g", { ref: ref, children: _jsx("g", { transform: 'translate(0, 0)', children: _jsx(IcicleNode, { table: table, row: 0, colors: colorByColors, colorBy: colorByValue, x: 0, y: 0, totalWidth: width ?? 1, height: RowHeight, setCurPath: setCurPath, curPath: curPath, total: total, xScale: xScale, path: path, level: 0, isRoot: true, searchString: currentSearchString ?? '', setHoveringRow: setHoveringRow, setHoveringLevel: setHoveringLevel, sortBy: sortBy, darkMode: isDarkMode, compareMode: compareMode, profileType: profileType, isContextMenuOpen: isContextMenuOpen, hoveringName: highlightSimilarStacksName, setHoveringName: highlightSimilarStacksSetName, hoveringRow: highlightSimilarStacksRow, colorForSimilarNodes: colorForSimilarNodes, highlightSimilarStacksPreference: highlightSimilarStacksPreference }) }) }) }));
172
178
  }, [
173
179
  width,
@@ -192,6 +198,8 @@ export const IcicleGraphArrow = memo(function IcicleGraphArrow({ arrow, total, f
192
198
  highlightSimilarStacksPreference,
193
199
  path,
194
200
  highlightSimilarStacksSetName,
201
+ isIcicleChart,
202
+ profileSource,
195
203
  ]);
196
204
  return (_jsx(_Fragment, { children: _jsxs("div", { className: "relative z-[9]", onMouseLeave: () => dispatch(setHoveringNode(undefined)), children: [_jsx(ContextMenu, { menuId: MENU_ID, table: table, row: hoveringRow ?? 0, level: hoveringLevel ?? 0, total: total, totalUnfiltered: total + filtered, profileType: profileType, compareAbsolute: compareAbsolute, trackVisibility: trackVisibility, curPath: curPath, setCurPath: setCurPath, hideMenu: hideAll, hideBinary: hideBinary, unit: arrow.unit }), dockedMetainfo ? (_jsx(DockedGraphTooltip, { table: table, row: hoveringRow, level: hoveringLevel ?? 0, total: total, totalUnfiltered: total + filtered, profileType: profileType, unit: arrow.unit, compareAbsolute: compareAbsolute })) : (!isContextMenuOpen && (_jsx(GraphTooltipArrow, { contextElement: svg.current, isContextMenuOpen: isContextMenuOpen, children: _jsx(GraphTooltipArrowContent, { table: table, row: hoveringRow, level: hoveringLevel ?? 0, isFixed: false, total: total, totalUnfiltered: total + filtered, profileType: profileType, unit: arrow.unit, compareAbsolute: compareAbsolute }) }))), root] }) }));
197
205
  });
@@ -1,9 +1,12 @@
1
1
  import { Table } from 'apache-arrow';
2
2
  import { type BinaryFeature, type FilenameFeature } from '@parca/store';
3
+ import { ProfileSource } from '../../ProfileSource';
4
+ import { BigIntDuo } from '../../utils';
3
5
  export declare function nodeLabel(table: Table<any>, row: number, level: number, showBinaryName: boolean): string;
4
6
  export declare const extractFeature: (mapping: string) => BinaryFeature;
5
7
  export declare const extractFilenameFeature: (filename: string) => FilenameFeature;
6
8
  export declare const getTextForCumulative: (hoveringNodeCumulative: bigint, totalUnfiltered: bigint, total: bigint, unit: string) => string;
7
9
  export declare const getTextForCumulativePerSecond: (hoveringNodeCumulative: number, unit: string) => string;
8
10
  export declare const arrowToString: (buffer: any) => string | null;
11
+ export declare const boundsFromProfileSource: (profileSource?: ProfileSource) => BigIntDuo;
9
12
  //# sourceMappingURL=utils.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/utils.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAEnC,OAAO,EAIL,KAAK,aAAa,EAClB,KAAK,eAAe,EACrB,MAAM,cAAc,CAAC;AAWtB,wBAAgB,SAAS,CACvB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,EACjB,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,MAAM,EACb,cAAc,EAAE,OAAO,GACtB,MAAM,CAkCR;AAED,eAAO,MAAM,cAAc,YAAa,MAAM,KAAG,aAMhD,CAAC;AAEF,eAAO,MAAM,sBAAsB,aAAc,MAAM,KAAG,eAMzD,CAAC;AAEF,eAAO,MAAM,oBAAoB,2BACP,MAAM,mBACb,MAAM,SAChB,MAAM,QACP,MAAM,KACX,MAOF,CAAC;AAEF,eAAO,MAAM,6BAA6B,2BAChB,MAAM,QACxB,MAAM,KACX,MAMF,CAAC;AAEF,eAAO,MAAM,aAAa,WAAY,GAAG,KAAG,MAAM,GAAG,IAQpD,CAAC"}
1
+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/ProfileIcicleGraph/IcicleGraphArrow/utils.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,KAAK,EAAC,MAAM,cAAc,CAAC;AAEnC,OAAO,EAIL,KAAK,aAAa,EAClB,KAAK,eAAe,EACrB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAsB,aAAa,EAAC,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAC,SAAS,EAAgB,MAAM,aAAa,CAAC;AAQrD,wBAAgB,SAAS,CACvB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,EACjB,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,MAAM,EACb,cAAc,EAAE,OAAO,GACtB,MAAM,CAkCR;AAED,eAAO,MAAM,cAAc,YAAa,MAAM,KAAG,aAMhD,CAAC;AAEF,eAAO,MAAM,sBAAsB,aAAc,MAAM,KAAG,eAMzD,CAAC;AAEF,eAAO,MAAM,oBAAoB,2BACP,MAAM,mBACb,MAAM,SAChB,MAAM,QACP,MAAM,KACX,MAOF,CAAC;AAEF,eAAO,MAAM,6BAA6B,2BAChB,MAAM,QACxB,MAAM,KACX,MAMF,CAAC;AAEF,eAAO,MAAM,aAAa,WAAY,GAAG,KAAG,MAAM,GAAG,IAQpD,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBAAoB,aAAa,KAAG,SAyBvE,CAAC"}
@@ -12,6 +12,7 @@
12
12
  // limitations under the License.
13
13
  import { BINARY_FEATURE_TYPES, EVERYTHING_ELSE, FILENAMES_FEATURE_TYPES, } from '@parca/store';
14
14
  import { divide, getLastItem, valueFormatter } from '@parca/utilities';
15
+ import { MergedProfileSource } from '../../ProfileSource';
15
16
  import { hexifyAddress } from '../../utils';
16
17
  import { FIELD_FUNCTION_NAME, FIELD_LABELS_ONLY, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from './index';
17
18
  export function nodeLabel(table, row, level, showBinaryName) {
@@ -75,3 +76,20 @@ export const arrowToString = (buffer) => {
75
76
  }
76
77
  return '';
77
78
  };
79
+ export const boundsFromProfileSource = (profileSource) => {
80
+ if (profileSource === undefined) {
81
+ return [0n, 1n];
82
+ }
83
+ if (!(profileSource instanceof MergedProfileSource)) {
84
+ return [0n, 1n];
85
+ }
86
+ const request = profileSource.QueryRequest();
87
+ if (request.options.oneofKind !== 'merge' ||
88
+ request.options.merge.start === undefined ||
89
+ request.options.merge.end === undefined) {
90
+ return [0n, 1n];
91
+ }
92
+ const start = request.options.merge.start.seconds * 1000000000n + BigInt(request.options.merge.start.nanos);
93
+ const end = request.options.merge.end.seconds * 1000000000n + BigInt(request.options.merge.end.nanos);
94
+ return [start, end];
95
+ };
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { Flamegraph, FlamegraphArrow } from '@parca/client';
3
3
  import { ProfileType } from '@parca/parser';
4
+ import { ProfileSource } from '../ProfileSource';
4
5
  export type ResizeHandler = (width: number, height: number) => void;
5
6
  interface ProfileIcicleGraphProps {
6
7
  width: number;
@@ -9,6 +10,7 @@ interface ProfileIcicleGraphProps {
9
10
  total: bigint;
10
11
  filtered: bigint;
11
12
  profileType?: ProfileType;
13
+ profileSource?: ProfileSource;
12
14
  curPath: string[] | [];
13
15
  setNewCurPath: (path: string[]) => void;
14
16
  loading: boolean;
@@ -17,7 +19,8 @@ interface ProfileIcicleGraphProps {
17
19
  isHalfScreen: boolean;
18
20
  metadataMappingFiles?: string[];
19
21
  metadataLoading?: boolean;
22
+ isIcicleChart?: boolean;
20
23
  }
21
- declare const ProfileIcicleGraph: ({ graph, arrow, total, filtered, curPath, setNewCurPath, profileType, loading, error, width, isHalfScreen, metadataMappingFiles, }: ProfileIcicleGraphProps) => JSX.Element;
24
+ declare const ProfileIcicleGraph: ({ graph, arrow, total, filtered, curPath, setNewCurPath, profileType, loading, error, width, isHalfScreen, metadataMappingFiles, isIcicleChart, profileSource, }: ProfileIcicleGraphProps) => JSX.Element;
22
25
  export default ProfileIcicleGraph;
23
26
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileIcicleGraph/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAC,UAAU,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAE1D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAY1C,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;AAEpE,UAAU,uBAAuB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;IACvB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAMD,QAAA,MAAM,kBAAkB,uIAarB,uBAAuB,KAAG,GAAG,CAAC,OA2LhC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileIcicleGraph/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAC,UAAU,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAE1D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,aAAa,EAAC,MAAM,kBAAkB,CAAC;AAW/C,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;AAEpE,UAAU,uBAAuB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;IACvB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,OAAO,CAAC;IACjB,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,KAAK,IAAI,CAAC;IACxD,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,YAAY,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAMD,QAAA,MAAM,kBAAkB,qKAerB,uBAAuB,KAAG,GAAG,CAAC,OA+LhC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
@@ -21,13 +21,14 @@ import { TimelineGuide } from '../TimelineGuide';
21
21
  import { IcicleGraph } from './IcicleGraph';
22
22
  import { FIELD_FUNCTION_NAME, IcicleGraphArrow } from './IcicleGraphArrow';
23
23
  import useMappingList from './IcicleGraphArrow/useMappingList';
24
+ import { boundsFromProfileSource } from './IcicleGraphArrow/utils';
24
25
  const numberFormatter = new Intl.NumberFormat('en-US');
25
26
  const ErrorContent = ({ errorMessage }) => {
26
27
  return _jsx("div", { className: "flex justify-center p-10", children: errorMessage });
27
28
  };
28
- const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ graph, arrow, total, filtered, curPath, setNewCurPath, profileType, loading, error, width, isHalfScreen, metadataMappingFiles, }) {
29
+ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ graph, arrow, total, filtered, curPath, setNewCurPath, profileType, loading, error, width, isHalfScreen, metadataMappingFiles, isIcicleChart = false, profileSource, }) {
29
30
  const { onError, authenticationErrorMessage, isDarkMode } = useParcaContext();
30
- const { compareMode, timelineGuide } = useProfileViewContext();
31
+ const { compareMode } = useProfileViewContext();
31
32
  const [isLoading, setIsLoading] = useState(true);
32
33
  const mappingsList = useMappingList(metadataMappingFiles);
33
34
  const [storeSortBy = FIELD_FUNCTION_NAME] = useURLState('sort_by');
@@ -83,7 +84,7 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ graph, arrow, to
83
84
  if (graph !== undefined)
84
85
  return (_jsx(IcicleGraph, { width: width, graph: graph, total: total, filtered: filtered, curPath: curPath, setCurPath: setNewCurPath, profileType: profileType }));
85
86
  if (arrow !== undefined)
86
- return (_jsxs("div", { className: "relative", children: [timelineGuide?.show === true && (_jsx(TimelineGuide, { bounds: timelineGuide.props.bounds, width: width, height: 1000, margin: 0, ticks: 60000 / 10000 })), _jsx(IcicleGraphArrow, { width: width, arrow: arrow, total: total, filtered: filtered, curPath: curPath, setCurPath: setNewCurPath, profileType: profileType, sortBy: storeSortBy, flamegraphLoading: isLoading, isHalfScreen: isHalfScreen, mappingsListFromMetadata: mappingsList, compareAbsolute: isCompareAbsolute })] }));
87
+ return (_jsxs("div", { className: "relative", children: [isIcicleChart ? (_jsx(TimelineGuide, { bounds: boundsFromProfileSource(profileSource), width: width, height: 1000, margin: 0, ticks: 12, timeUnit: "nanoseconds" })) : null, _jsx(IcicleGraphArrow, { width: width, arrow: arrow, total: total, filtered: filtered, curPath: curPath, setCurPath: setNewCurPath, profileType: profileType, sortBy: storeSortBy, flamegraphLoading: isLoading, isHalfScreen: isHalfScreen, mappingsListFromMetadata: mappingsList, compareAbsolute: isCompareAbsolute, isIcicleChart: isIcicleChart, profileSource: profileSource })] }));
87
88
  }, [
88
89
  isLoading,
89
90
  graph,
@@ -100,7 +101,8 @@ const ProfileIcicleGraph = function ProfileIcicleGraphNonMemo({ graph, arrow, to
100
101
  isDarkMode,
101
102
  mappingsList,
102
103
  isCompareAbsolute,
103
- timelineGuide,
104
+ isIcicleChart,
105
+ profileSource,
104
106
  ]);
105
107
  if (error != null) {
106
108
  onError?.(error);
@@ -6,6 +6,7 @@ interface GetDashboardItemProps {
6
6
  isHalfScreen: boolean;
7
7
  dimensions: DOMRect | undefined;
8
8
  flamegraphData: FlamegraphData;
9
+ flamechartData: FlamegraphData;
9
10
  topTableData?: TopTableData;
10
11
  callgraphData?: CallgraphData;
11
12
  sourceData?: SourceData;
@@ -21,6 +22,6 @@ interface GetDashboardItemProps {
21
22
  onRender?: ProfilerOnRenderCallback;
22
23
  };
23
24
  }
24
- export declare const getDashboardItem: ({ type, isHalfScreen, dimensions, flamegraphData, topTableData, callgraphData, sourceData, profileSource, total, filtered, curPath, setNewCurPath, currentSearchString, setSearchString, callgraphSVG, perf, }: GetDashboardItemProps) => JSX.Element;
25
+ export declare const getDashboardItem: ({ type, isHalfScreen, dimensions, flamegraphData, flamechartData, topTableData, callgraphData, sourceData, profileSource, total, filtered, curPath, setNewCurPath, currentSearchString, setSearchString, callgraphSVG, perf, }: GetDashboardItemProps) => JSX.Element;
25
26
  export {};
26
27
  //# sourceMappingURL=index.d.ts.map
@@ -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;AAMzD,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,OAAO,KAAK,EACV,aAAa,EACb,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,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,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,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;CACH;AAED,eAAO,MAAM,gBAAgB,mNAiB1B,qBAAqB,KAAG,GAAG,CAAC,OA+E9B,CAAC"}
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;AAMzD,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAGrD,OAAO,KAAK,EACV,aAAa,EACb,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,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,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,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;CACH;AAED,eAAO,MAAM,gBAAgB,mOAkB1B,qBAAqB,KAAG,GAAG,CAAC,OAwG9B,CAAC"}
@@ -17,7 +17,7 @@ import Callgraph from '../../../Callgraph';
17
17
  import ProfileIcicleGraph from '../../../ProfileIcicleGraph';
18
18
  import { SourceView } from '../../../SourceView';
19
19
  import { Table } from '../../../Table';
20
- export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphData, topTableData, callgraphData, sourceData, profileSource, total, filtered, curPath, setNewCurPath, currentSearchString, setSearchString, callgraphSVG, perf, }) => {
20
+ export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphData, flamechartData, topTableData, callgraphData, sourceData, profileSource, total, filtered, curPath, setNewCurPath, currentSearchString, setSearchString, callgraphSVG, perf, }) => {
21
21
  switch (type) {
22
22
  case 'icicle':
23
23
  return (_jsx(ConditionalWrapper, { condition: perf?.onRender != null, WrapperComponent: Profiler, wrapperProps: {
@@ -28,6 +28,12 @@ export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphDat
28
28
  ? (dimensions.width - 54) / 2
29
29
  : dimensions.width - 16
30
30
  : 0, metadataMappingFiles: flamegraphData.metadataMappingFiles, metadataLoading: flamegraphData.metadataLoading }) }));
31
+ case 'iciclechart':
32
+ return (_jsx(ProfileIcicleGraph, { curPath: curPath, setNewCurPath: setNewCurPath, arrow: flamechartData?.arrow, total: total, filtered: filtered, profileType: profileSource?.ProfileType(), loading: flamechartData.loading, error: flamechartData.error, isHalfScreen: isHalfScreen, width: dimensions?.width !== undefined
33
+ ? isHalfScreen
34
+ ? (dimensions.width - 54) / 2
35
+ : dimensions.width - 16
36
+ : 0, metadataMappingFiles: flamechartData.metadataMappingFiles, metadataLoading: flamechartData.metadataLoading, profileSource: profileSource, isIcicleChart: true }));
31
37
  case 'callgraph':
32
38
  return callgraphData?.data !== undefined &&
33
39
  callgraphSVG !== undefined &&
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,YAAY,QAAO,GAAG,CAAC,OAwF5B,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/ViewSelector/index.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,YAAY,QAAO,GAAG,CAAC,OA4F5B,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -17,11 +17,14 @@ const ViewSelector = () => {
17
17
  const [dashboardItems = ['icicle'], setDashboardItems] = useURLState('dashboard_items', {
18
18
  alwaysReturnArray: true,
19
19
  });
20
- const { enableSourcesView } = useParcaContext();
20
+ const { enableSourcesView, enableIciclechartView } = useParcaContext();
21
21
  const allItems = [
22
22
  { key: 'table', canBeSelected: !dashboardItems.includes('table') },
23
23
  { key: 'icicle', canBeSelected: !dashboardItems.includes('icicle') },
24
24
  ];
25
+ if (enableIciclechartView === true) {
26
+ allItems.push({ key: 'iciclechart', canBeSelected: !dashboardItems.includes('iciclechart') });
27
+ }
25
28
  if (enableSourcesView === true) {
26
29
  allItems.push({ key: 'source', canBeSelected: false });
27
30
  }
@@ -1,3 +1,3 @@
1
1
  import type { ProfileViewProps } from './types/visualization';
2
- export declare const ProfileView: ({ total, filtered, flamegraphData, topTableData, callgraphData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, timelineGuide, }: ProfileViewProps) => JSX.Element;
2
+ export declare const ProfileView: ({ total, filtered, flamegraphData, flamechartData, topTableData, callgraphData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, }: ProfileViewProps) => JSX.Element;
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAG/E,eAAO,MAAM,WAAW,oMAcrB,gBAAgB,KAAG,GAAG,CAAC,OAwIzB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AA4BA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAG/E,eAAO,MAAM,WAAW,qMAcrB,gBAAgB,KAAG,GAAG,CAAC,OAwIzB,CAAC"}
@@ -26,7 +26,7 @@ import { useGraphviz } from './hooks/useGraphviz';
26
26
  import { useProfileMetadata } from './hooks/useProfileMetadata';
27
27
  import { useVisualizationState } from './hooks/useVisualizationState';
28
28
  import { getColorRange } from './utils/colorUtils';
29
- export const ProfileView = ({ total, filtered, flamegraphData, topTableData, callgraphData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, timelineGuide, }) => {
29
+ export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, topTableData, callgraphData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, }) => {
30
30
  const { timezone, perf, profileViewExternalMainActions, preferencesModal, profileViewExternalSubActions, } = useParcaContext();
31
31
  const { ref, dimensions } = useContainerDimensions();
32
32
  const isDarkMode = useAppSelector(selectDarkMode);
@@ -52,6 +52,7 @@ export const ProfileView = ({ total, filtered, flamegraphData, topTableData, cal
52
52
  isHalfScreen,
53
53
  dimensions,
54
54
  flamegraphData,
55
+ flamechartData,
55
56
  topTableData,
56
57
  callgraphData,
57
58
  sourceData,
@@ -71,5 +72,5 @@ export const ProfileView = ({ total, filtered, flamegraphData, topTableData, cal
71
72
  table: (_jsx(TableToolbar, { profileType: profileSource?.ProfileType(), total: total, filtered: filtered, clearSelection: clearSelection, currentSearchString: currentSearchString })),
72
73
  };
73
74
  const hasProfileSource = profileSource !== undefined && profileSource.toString(timezone) !== '';
74
- return (_jsx(KeyDownProvider, { children: _jsx(ProfileViewContextProvider, { value: { profileSource, compareMode, timelineGuide }, children: _jsxs(DashboardProvider, { children: [_jsx(ProfileHeader, { profileSourceString: profileSource?.toString(timezone), hasProfileSource: hasProfileSource, externalMainActions: profileViewExternalMainActions }), _jsx(VisualisationToolbar, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, hasProfileSource: hasProfileSource, pprofdownloading: pprofDownloading, profileSource: profileSource, queryClient: queryClient, onDownloadPProf: onDownloadPProf, curPath: curPath, setNewCurPath: setCurPath, profileType: profileSource?.ProfileType(), total: total, filtered: filtered, currentSearchString: currentSearchString, setSearchString: setSearchString, groupByLabels: flamegraphData.metadataLabels ?? [], preferencesModal: preferencesModal, profileViewExternalSubActions: profileViewExternalSubActions, clearSelection: clearSelection, setGroupByLabels: setGroupByLabels, showVisualizationSelector: showVisualizationSelector }), isColorStackLegendEnabled && (_jsx(ColorStackLegend, { compareMode: compareMode, mappings: colorMappings, loading: flamegraphData.metadataLoading })), _jsx("div", { className: "w-full", ref: ref, children: _jsx(DashboardLayout, { getDashboardItemByType: getDashboardItemByType, actionButtons: actionButtons }) })] }) }) }));
75
+ return (_jsx(KeyDownProvider, { children: _jsx(ProfileViewContextProvider, { value: { profileSource, compareMode }, children: _jsxs(DashboardProvider, { children: [_jsx(ProfileHeader, { profileSourceString: profileSource?.toString(timezone), hasProfileSource: hasProfileSource, externalMainActions: profileViewExternalMainActions }), _jsx(VisualisationToolbar, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, hasProfileSource: hasProfileSource, pprofdownloading: pprofDownloading, profileSource: profileSource, queryClient: queryClient, onDownloadPProf: onDownloadPProf, curPath: curPath, setNewCurPath: setCurPath, profileType: profileSource?.ProfileType(), total: total, filtered: filtered, currentSearchString: currentSearchString, setSearchString: setSearchString, groupByLabels: flamegraphData.metadataLabels ?? [], preferencesModal: preferencesModal, profileViewExternalSubActions: profileViewExternalSubActions, clearSelection: clearSelection, setGroupByLabels: setGroupByLabels, showVisualizationSelector: showVisualizationSelector }), isColorStackLegendEnabled && (_jsx(ColorStackLegend, { compareMode: compareMode, mappings: colorMappings, loading: flamegraphData.metadataLoading })), _jsx("div", { className: "w-full", ref: ref, children: _jsx(DashboardLayout, { getDashboardItemByType: getDashboardItemByType, actionButtons: actionButtons }) })] }) }) }));
75
76
  };
@@ -1,6 +1,5 @@
1
1
  import { Callgraph as CallgraphType, Flamegraph, FlamegraphArrow, QueryServiceClient, Source, TableArrow } from '@parca/client';
2
2
  import { ProfileSource } from '../../ProfileSource';
3
- import { TimelineGuideData } from '../context/ProfileViewContext';
4
3
  export interface FlamegraphData {
5
4
  loading: boolean;
6
5
  data?: Flamegraph;
@@ -32,11 +31,12 @@ export interface SourceData {
32
31
  data?: Source;
33
32
  error?: any;
34
33
  }
35
- export type VisualizationType = 'icicle' | 'callgraph' | 'table' | 'source';
34
+ export type VisualizationType = 'icicle' | 'callgraph' | 'table' | 'source' | 'iciclechart';
36
35
  export interface ProfileViewProps {
37
36
  total: bigint;
38
37
  filtered: bigint;
39
38
  flamegraphData: FlamegraphData;
39
+ flamechartData: FlamegraphData;
40
40
  topTableData?: TopTableData;
41
41
  callgraphData?: CallgraphData;
42
42
  sourceData?: SourceData;
@@ -46,7 +46,5 @@ export interface ProfileViewProps {
46
46
  onDownloadPProf: () => void;
47
47
  pprofDownloading?: boolean;
48
48
  showVisualizationSelector?: boolean;
49
- showTimelineGuide?: boolean;
50
- timelineGuide?: TimelineGuideData;
51
49
  }
52
50
  //# sourceMappingURL=visualization.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"visualization.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/types/visualization.ts"],"names":[],"mappings":"AAaA,OAAO,EACL,SAAS,IAAI,aAAa,EAC1B,UAAU,EACV,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,UAAU,EACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAC,iBAAiB,EAAC,MAAM,+BAA+B,CAAC;AAEhE,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE5E,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,iBAAiB,CAAC;CACnC"}
1
+ {"version":3,"file":"visualization.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/types/visualization.ts"],"names":[],"mappings":"AAaA,OAAO,EACL,SAAS,IAAI,aAAa,EAC1B,UAAU,EACV,eAAe,EACf,kBAAkB,EAClB,MAAM,EACN,UAAU,EACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAElD,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,GAAG,CAAC;CACb;AAED,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,aAAa,CAAC;AAE5F,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,cAAc,CAAC;IAC/B,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC"}
@@ -1,14 +1,11 @@
1
1
  import { QueryServiceClient } from '@parca/client';
2
2
  import { ProfileSource } from './ProfileSource';
3
- import { TimelineGuideData } from './ProfileView/context/ProfileViewContext';
4
3
  interface ProfileViewWithDataProps {
5
4
  queryClient: QueryServiceClient;
6
5
  profileSource: ProfileSource;
7
6
  compare?: boolean;
8
7
  showVisualizationSelector?: boolean;
9
- isGroupByTimestamp?: boolean;
10
- timelineGuide?: TimelineGuideData;
11
8
  }
12
- export declare const ProfileViewWithData: ({ queryClient, profileSource, showVisualizationSelector, isGroupByTimestamp, timelineGuide, }: ProfileViewWithDataProps) => JSX.Element;
9
+ export declare const ProfileViewWithData: ({ queryClient, profileSource, showVisualizationSelector, }: ProfileViewWithDataProps) => JSX.Element;
13
10
  export default ProfileViewWithData;
14
11
  //# sourceMappingURL=ProfileViewWithData.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAK1E,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,OAAO,EAAC,iBAAiB,EAAC,MAAM,0CAA0C,CAAC;AAI3E,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,aAAa,CAAC,EAAE,iBAAiB,CAAC;CACnC;AAED,eAAO,MAAM,mBAAmB,kGAM7B,wBAAwB,KAAG,GAAG,CAAC,OAsNjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAK1E,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAK9C,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,aAAa,EAAE,aAAa,CAAC;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAED,eAAO,MAAM,mBAAmB,+DAI7B,wBAAwB,KAAG,GAAG,CAAC,OAoPjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}