@parca/profile 0.19.112 → 0.19.114

package/dist/ProfileView/components/DashboardItems/index.d.ts

@@ -2,13 +2,13 @@ import { ProfilerOnRenderCallback } from 'react';
 import { QueryServiceClient } from '@parca/client';
 import { CurrentPathFrame } from '../../../ProfileFlameGraph/FlameGraphArrow/utils';
 import { ProfileSource } from '../../../ProfileSource';
-import type { FlamegraphData, SandwichData, SourceData, TopTableData, VisualizationType } from '../../types/visualization';
+import type { FlamegraphData, SamplesData, SandwichData, SourceData, TopTableData, VisualizationType } from '../../types/visualization';
 interface GetDashboardItemProps {
     type: VisualizationType;
     isHalfScreen: boolean;
     dimensions: DOMRect | undefined;
     flamegraphData: FlamegraphData;
-    flamechartData: FlamegraphData;
+    samplesData?: SamplesData;
     topTableData?: TopTableData;
     sandwichData: SandwichData;
     sourceData?: SourceData;
@@ -20,8 +20,9 @@ interface GetDashboardItemProps {
     perf?: {
         onRender?: ProfilerOnRenderCallback;
     };
-    queryClient?: QueryServiceClient;
+    queryClient: QueryServiceClient;
+    onSwitchToOneMinute?: () => void;
 }
-export declare const getDashboardItem: ({ type, isHalfScreen, dimensions, flamegraphData, flamechartData, topTableData, sourceData, sandwichData, profileSource, total, filtered, curPathArrow, setNewCurPathArrow, perf, }: GetDashboardItemProps) => JSX.Element;
+export declare const getDashboardItem: ({ type, isHalfScreen, dimensions, flamegraphData, samplesData, topTableData, sourceData, sandwichData, profileSource, total, filtered, curPathArrow, setNewCurPathArrow, perf, queryClient, onSwitchToOneMinute, }: GetDashboardItemProps) => JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/ProfileView/components/DashboardItems/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAIrD,OAAO,KAAK,EACV,cAAc,EACd,YAAY,EACZ,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,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,kBAAkB,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACvD,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC;AAED,eAAO,MAAM,gBAAgB,GAAI,qLAe9B,qBAAqB,KAAG,GAAG,CAAC,OAgG9B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/DashboardItems/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAW,wBAAwB,EAAC,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAKjD,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAIrD,OAAO,KAAK,EACV,cAAc,EACd,WAAW,EACX,YAAY,EACZ,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,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,kBAAkB,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACvD,IAAI,CAAC,EAAE;QACL,QAAQ,CAAC,EAAE,wBAAwB,CAAC;KACrC,CAAC;IACF,WAAW,EAAE,kBAAkB,CAAC;IAChC,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED,eAAO,MAAM,gBAAgB,GAAI,oNAiB9B,qBAAqB,KAAG,GAAG,CAAC,OA6F9B,CAAC"}

package/dist/ProfileView/components/DashboardItems/index.js

@@ -13,11 +13,12 @@ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 // limitations under the License.
 import { Profiler } from 'react';
 import { ConditionalWrapper } from '@parca/components';
+import ProfileFlameChart from '../../../ProfileFlameChart';
 import ProfileFlameGraph from '../../../ProfileFlameGraph';
 import Sandwich from '../../../Sandwich';
 import { SourceView } from '../../../SourceView';
 import { Table } from '../../../Table';
-export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphData, flamechartData, topTableData, sourceData, sandwichData, profileSource, total, filtered, curPathArrow, setNewCurPathArrow, perf, }) => {
+export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphData, samplesData, topTableData, sourceData, sandwichData, profileSource, total, filtered, curPathArrow, setNewCurPathArrow, perf, queryClient, onSwitchToOneMinute, }) => {
     switch (type) {
         case 'flamegraph':
             return (_jsx(ConditionalWrapper, { condition: perf?.onRender != null, WrapperComponent: Profiler, wrapperProps: {
@@ -29,11 +30,11 @@ export const getDashboardItem = ({ type, isHalfScreen, dimensions, flamegraphDat
                             : dimensions.width - 16
                         : 0, metadataMappingFiles: flamegraphData.metadataMappingFiles, metadataLoading: flamegraphData.metadataLoading, profileSource: profileSource }) }));
         case 'flamechart':
-            return (_jsx(ProfileFlameGraph, { curPathArrow: [], setNewCurPathArrow: () => { }, arrow: flamechartData?.arrow, total: total, filtered: filtered, profileType: profileSource?.ProfileType(), loading: flamechartData.loading, error: flamechartData.error, isHalfScreen: isHalfScreen, width: dimensions?.width !== undefined
+            return (_jsx(ProfileFlameChart, { samplesData: samplesData, queryClient: queryClient, profileSource: profileSource, width: dimensions?.width !== undefined
                     ? isHalfScreen
                         ? (dimensions.width - 54) / 2
                         : dimensions.width - 16
-                    : 0, metadataMappingFiles: flamechartData.metadataMappingFiles, metadataLoading: flamechartData.metadataLoading, profileSource: profileSource, isFlameChart: true }));
+                    : 0, total: total, filtered: filtered, profileType: profileSource?.ProfileType(), isHalfScreen: isHalfScreen, metadataMappingFiles: flamegraphData.metadataMappingFiles, metadataLoading: flamegraphData.metadataLoading, onSwitchToOneMinute: onSwitchToOneMinute }));
         case 'table':
             return topTableData != null ? (_jsx(Table, { error: topTableData.error, total: total, filtered: filtered, loading: topTableData.loading, data: topTableData.arrow?.record, unit: topTableData.unit, profileType: profileSource?.ProfileType(), isHalfScreen: isHalfScreen, metadataMappingFiles: flamegraphData.metadataMappingFiles })) : (_jsx(_Fragment, {}));
         case 'sandwich':

package/dist/ProfileView/components/GroupByLabelsDropdown/index.d.ts

@@ -4,7 +4,8 @@ interface Props {
     setGroupByLabels: (labels: string[]) => void;
     metadataRefetch?: () => Promise<void>;
     metadataLoading: boolean;
+    label?: string;
 }
-declare const GroupByLabelsDropdown: ({ labels, groupBy, setGroupByLabels, metadataRefetch, metadataLoading, }: Props) => JSX.Element;
+declare const GroupByLabelsDropdown: ({ labels, groupBy, setGroupByLabels, metadataRefetch, metadataLoading, label, }: Props) => JSX.Element;
 export default GroupByLabelsDropdown;
 //# sourceMappingURL=index.d.ts.map

package/dist/ProfileView/components/GroupByLabelsDropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/GroupByLabelsDropdown/index.tsx"],"names":[],"mappings":"AAuBA,UAAU,KAAK;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,qBAAqB,GAAI,0EAM5B,KAAK,KAAG,GAAG,CAAC,OAiFd,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/GroupByLabelsDropdown/index.tsx"],"names":[],"mappings":"AAuBA,UAAU,KAAK;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,eAAe,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,eAAe,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,qBAAqB,GAAI,iFAO5B,KAAK,KAAG,GAAG,CAAC,OAiFd,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/ProfileView/components/GroupByLabelsDropdown/index.js

@@ -14,8 +14,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { TEST_IDS, testId } from '@parca/test-utils';
 import { FIELD_LABELS } from '../../../ProfileFlameGraph/FlameGraphArrow';
 import { SelectWithRefresh } from '../../../SelectWithRefresh';
-const GroupByLabelsDropdown = ({ labels, groupBy, setGroupByLabels, metadataRefetch, metadataLoading, }) => {
-    return (_jsxs("div", { className: "flex flex-col relative", ...testId(TEST_IDS.GROUP_BY_CONTAINER), children: [_jsx("div", { className: "flex items-center justify-between", children: _jsx("label", { className: "text-sm", ...testId(TEST_IDS.GROUP_BY_LABEL), children: "Group by" }) }), _jsx(SelectWithRefresh, { isMulti: true, defaultMenuIsOpen: false, defaultValue: undefined, name: "labels", options: labels.map(label => ({ label, value: `${FIELD_LABELS}.${label}` })), className: "parca-select-container text-sm rounded-md bg-white", classNamePrefix: "parca-select", onRefresh: metadataRefetch, refreshTitle: "Refresh label names", refreshTestId: "group-by-refresh-button", menuTestId: TEST_IDS.GROUP_BY_SELECT_FLYOUT, value: groupBy
+const GroupByLabelsDropdown = ({ labels, groupBy, setGroupByLabels, metadataRefetch, metadataLoading, label = 'Group by', }) => {
+    return (_jsxs("div", { className: "flex flex-col relative", ...testId(TEST_IDS.GROUP_BY_CONTAINER), children: [_jsx("div", { className: "flex items-center justify-between", children: _jsx("label", { className: "text-sm", ...testId(TEST_IDS.GROUP_BY_LABEL), children: label }) }), _jsx(SelectWithRefresh, { isMulti: true, defaultMenuIsOpen: false, defaultValue: undefined, name: "labels", options: labels.map(label => ({ label, value: `${FIELD_LABELS}.${label}` })), className: "parca-select-container text-sm rounded-md bg-white", classNamePrefix: "parca-select", onRefresh: metadataRefetch, refreshTitle: "Refresh label names", refreshTestId: "group-by-refresh-button", menuTestId: TEST_IDS.GROUP_BY_SELECT_FLYOUT, value: (groupBy ?? [])
                     .filter(l => l.startsWith(FIELD_LABELS))
                     .map(l => ({ value: l, label: l.slice(FIELD_LABELS.length + 1) })), onChange: newValue => {
                     setGroupByLabels(newValue.map(option => option.value));

package/dist/ProfileView/components/Toolbars/MultiLevelDropdown.js

@@ -215,7 +215,7 @@ const MultiLevelDropdown = ({ onSelect, profileType, groupBy, toggleGroupBy, isT
             icon: 'ph:eye-closed',
         },
     ];
-    return (_jsx("div", { className: "relative inline-block text-left", id: "h-visualisation-toolbar-actions", ref: dropdownRef, children: _jsx(Menu, { children: ({ open, close }) => (_jsxs(_Fragment, { children: [_jsxs(Menu.Button, { className: "flex dark:bg-gray-900 dark:border-gray-600 justify-center w-full px-4 py-2 text-sm font-normal text-gray-600 dark:text-gray-200 bg-white rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 border border-gray-200 pr-[1.7rem]", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Icon, { icon: "pajamas:preferences", className: "w-4 h-4" }), _jsx("span", { children: "Preferences" })] }), _jsx("span", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2 text-gray-400", children: _jsx(Icon, { icon: "heroicons:chevron-down-20-solid", "aria-hidden": "true" }) })] }), open && (_jsx(Menu.Items, { className: cx(isTableVizOnly ? 'w-64' : 'w-80', 'absolute z-30 mt-2 py-2 bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none border dark:bg-gray-900 dark:border-gray-600', shouldOpenLeft ? 'right-0 origin-top-right' : 'left-0 origin-top-left'), children: menuItems
+    return (_jsx("div", { className: "relative inline-block text-left", id: "h-visualisation-toolbar-actions", ref: dropdownRef, children: _jsx(Menu, { children: ({ open, close }) => (_jsxs(_Fragment, { children: [_jsxs(Menu.Button, { className: "flex dark:bg-gray-900 dark:border-gray-600 justify-center w-full px-4 py-2 text-sm font-normal text-gray-600 dark:text-gray-200 bg-white rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75 border border-gray-200 pr-[1.7rem]", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Icon, { icon: "pajamas:preferences", className: "w-4 h-4" }), _jsx("span", { children: "Preferences" })] }), _jsx("span", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2 text-gray-400", children: _jsx(Icon, { icon: "heroicons:chevron-down-20-solid", "aria-hidden": "true" }) })] }), open && (_jsx(Menu.Items, { className: cx(isTableVizOnly ? 'w-64' : 'w-80', 'absolute z-50 mt-2 py-2 bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none border dark:bg-gray-900 dark:border-gray-600', shouldOpenLeft ? 'right-0 origin-top-right' : 'left-0 origin-top-left'), children: menuItems
                             .filter(item => item.hide !== undefined && !item.hide)
                             .map((item, index) => (_jsx(MenuItem, { ...item, onSelect: onSelect, closeDropdown: close, activeValueForSortBy: storeSortBy, activeValueForColorBy: colorBy === undefined || colorBy === '' ? 'binary' : colorBy, activeValuesForLevel: groupBy, renderAsDiv: item.renderAsDiv }, index))) }))] })) }) }));
 };

package/dist/ProfileView/components/Toolbars/index.d.ts

@@ -19,6 +19,8 @@ export interface VisualisationToolbarProps {
     preferencesModal?: boolean;
     profileViewExternalSubActions?: React.ReactNode;
     setGroupByLabels: (labels: string[]) => void;
+    flamechartDimension: string[];
+    setFlamechartDimension: (labels: string[]) => void;
     showVisualizationSelector?: boolean;
     sandwichFunctionName?: string;
     alignFunctionName: string;

package/dist/ProfileView/components/Toolbars/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAIzB,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAUrD,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6BAA6B,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChD,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,EAAE,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;QAC9B,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;CACnD;AAED,MAAM,WAAW,8BAA8B;IAC7C,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAQ9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkBxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAmBxE,CAAC;AAMF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAmG9D,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/ProfileView/components/Toolbars/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,EAAE,EAAC,MAAM,OAAO,CAAC;AAIzB,OAAO,EAAC,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEjD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,kDAAkD,CAAC;AAClF,OAAO,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAUrD,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,6BAA6B,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChD,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE;QACR,MAAM,EAAE,MAAM,EAAE,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;QAC9B,OAAO,EAAE,OAAO,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,aAAa,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;CACnD;AAED,MAAM,WAAW,8BAA8B;IAC7C,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAQ9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkBxD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,EAAE,CAAC,8BAA8B,CAmBxE,CAAC;AAMF,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAkH9D,CAAC"}

package/dist/ProfileView/components/Toolbars/index.js

@@ -20,17 +20,19 @@ export const SandwichFlameGraphToolbar = ({ resetSandwichFunctionName, sandwichF
     return (_jsx(_Fragment, { children: _jsx("div", { className: "flex w-full gap-2 items-end justify-between", children: _jsx(Button, { color: "neutral", onClick: () => resetSandwichFunctionName(), className: "w-auto", variant: "neutral", disabled: sandwichFunctionName === undefined || sandwichFunctionName.length === 0, children: "Reset view" }) }) }));
 };
 const Divider = () => (_jsx("div", { className: "border-t mt-4 border-gray-200 dark:border-gray-700 h-[1px] w-full pb-4" }));
-export const VisualisationToolbar = ({ groupBy, toggleGroupBy, setGroupByLabels, profileType, profileSource, queryClient, onDownloadPProf, pprofdownloading, profileViewExternalSubActions, curPath, setNewCurPath, total, filtered, showVisualizationSelector = true, alignFunctionName, setAlignFunctionName, colorBy, setColorBy, metadata: { labels: groupByLabels, refetch: metadataRefetch, loading: metadataLoading }, }) => {
+export const VisualisationToolbar = ({ groupBy, toggleGroupBy, setGroupByLabels, flamechartDimension, setFlamechartDimension, profileType, profileSource, queryClient, onDownloadPProf, pprofdownloading, profileViewExternalSubActions, curPath, setNewCurPath, total, filtered, showVisualizationSelector = true, alignFunctionName, setAlignFunctionName, colorBy, setColorBy, metadata: { labels: groupByLabels, refetch: metadataRefetch, loading: metadataLoading }, }) => {
     const { dashboardItems } = useDashboard();
     const isTableViz = dashboardItems?.includes('table');
     const isTableVizOnly = dashboardItems?.length === 1 && isTableViz;
     const isGraphViz = dashboardItems?.includes('flamegraph');
     const isGraphVizOnly = dashboardItems?.length === 1 && isGraphViz;
+    const isFlamechartViz = dashboardItems?.includes('flamechart');
+    const isFlamechartVizOnly = dashboardItems?.length === 1 && isFlamechartViz;
     const req = profileSource?.QueryRequest();
     if (req !== null && req !== undefined) {
         req.groupBy = {
             fields: groupBy ?? [],
         };
     }
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex w-full justify-between items-start gap-2", children: [_jsxs("div", { className: "flex gap-2 items-start", children: [isGraphViz && (_jsxs(_Fragment, { children: [_jsx(GroupByDropdown, { groupBy: groupBy, labels: groupByLabels, setGroupByLabels: setGroupByLabels, metadataRefetch: metadataRefetch, metadataLoading: metadataLoading }), _jsx(InvertCallStack, {})] })), _jsxs("div", { className: "flex mt-5", children: [_jsx(ProfileFilters, {}), profileViewExternalSubActions != null ? profileViewExternalSubActions : null] })] }), _jsxs("div", { className: "flex gap-2 mt-5", children: [_jsx(MultiLevelDropdown, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, profileType: profileType, onSelect: () => { }, isTableVizOnly: isTableVizOnly, alignFunctionName: alignFunctionName, setAlignFunctionName: setAlignFunctionName, colorBy: colorBy, setColorBy: setColorBy }), _jsx(ShareButton, { profileSource: profileSource, queryClient: queryClient, queryRequest: req, onDownloadPProf: onDownloadPProf, pprofdownloading: pprofdownloading ?? false, profileViewExternalSubActions: profileViewExternalSubActions }), showVisualizationSelector ? _jsx(ViewSelector, { profileSource: profileSource }) : null] })] }), isGraphVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(FlameGraphToolbar, { curPath: curPath, setNewCurPath: setNewCurPath })] })), isTableVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(TableToolbar, { profileType: profileType, total: total, filtered: filtered })] }))] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex w-full justify-between items-start gap-2", children: [_jsxs("div", { className: "flex gap-2 items-start", children: [isGraphViz && (_jsxs(_Fragment, { children: [_jsx(GroupByDropdown, { groupBy: groupBy, labels: groupByLabels, setGroupByLabels: setGroupByLabels, metadataRefetch: metadataRefetch, metadataLoading: metadataLoading }), _jsx(InvertCallStack, {})] })), isFlamechartViz && (_jsx(GroupByDropdown, { groupBy: flamechartDimension, labels: groupByLabels, setGroupByLabels: setFlamechartDimension, metadataRefetch: metadataRefetch, metadataLoading: metadataLoading, label: "Samples group by" })), _jsxs("div", { className: "flex mt-5", children: [!isFlamechartVizOnly && _jsx(ProfileFilters, {}), profileViewExternalSubActions != null ? profileViewExternalSubActions : null] })] }), _jsxs("div", { className: "flex gap-2 mt-5", children: [_jsx(MultiLevelDropdown, { groupBy: groupBy, toggleGroupBy: toggleGroupBy, profileType: profileType, onSelect: () => { }, isTableVizOnly: isTableVizOnly, alignFunctionName: alignFunctionName, setAlignFunctionName: setAlignFunctionName, colorBy: colorBy, setColorBy: setColorBy }), _jsx(ShareButton, { profileSource: profileSource, queryClient: queryClient, queryRequest: req, onDownloadPProf: onDownloadPProf, pprofdownloading: pprofdownloading ?? false, profileViewExternalSubActions: profileViewExternalSubActions }), showVisualizationSelector ? _jsx(ViewSelector, { profileSource: profileSource }) : null] })] }), isGraphVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(FlameGraphToolbar, { curPath: curPath, setNewCurPath: setNewCurPath })] })), isTableVizOnly && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(TableToolbar, { profileType: profileType, total: total, filtered: filtered })] }))] }));
 };

package/dist/ProfileView/hooks/useAutoSelectDimension.d.ts

@@ -0,0 +1,16 @@
+import { ProfileType } from '@parca/parser';
+/**
+ * Auto-selects the best flamechart "group by" dimension on first load.
+ *
+ * For On-GPU profiles:
+ *   - Selects all available from: ['node', 'gpu', 'stream']
+ *
+ * For On-CPU profiles:
+ *   - Priority: cpu > cpuid > thread > thread_id
+ *   - Adds 'node' alongside the primary dimension if available
+ *
+ * For all other profile types:
+ *   - No auto-selection
+ */
+export declare const useAutoSelectDimension: (metadataLabels: string[] | undefined, flamechartDimension: string[] | undefined, setFlamechartDimension: (v: string[]) => void, profileType?: ProfileType) => void;
+//# sourceMappingURL=useAutoSelectDimension.d.ts.map

package/dist/ProfileView/hooks/useAutoSelectDimension.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutoSelectDimension.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useAutoSelectDimension.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAwB1C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,sBAAsB,GACjC,gBAAgB,MAAM,EAAE,GAAG,SAAS,EACpC,qBAAqB,MAAM,EAAE,GAAG,SAAS,EACzC,wBAAwB,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,IAAI,EAC7C,cAAc,WAAW,KACxB,IAgCF,CAAC"}

package/dist/ProfileView/hooks/useAutoSelectDimension.js

@@ -0,0 +1,75 @@
+// Copyright 2022 The Parca Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { useEffect, useRef } from 'react';
+import { wellKnownProfiles } from '../../ProfileTypeSelector';
+const CPU_PREFERRED_DIMENSIONS = ['cpu', 'cpuid', 'thread', 'thread_id'];
+const GPU_DIMENSIONS = ['node', 'gpu', 'stream'];
+const getWellKnownProfileName = (profileType) => {
+    if (profileType == null)
+        return undefined;
+    const key = profileType.toString();
+    return wellKnownProfiles[key]?.name;
+};
+const isOnGpuProfile = (profileType) => {
+    const wellKnownName = getWellKnownProfileName(profileType);
+    return wellKnownName === 'On-GPU';
+};
+const isOnCpuProfile = (profileType) => {
+    const wellKnownName = getWellKnownProfileName(profileType);
+    return wellKnownName === 'On-CPU';
+};
+/**
+ * Auto-selects the best flamechart "group by" dimension on first load.
+ *
+ * For On-GPU profiles:
+ *   - Selects all available from: ['node', 'gpu', 'stream']
+ *
+ * For On-CPU profiles:
+ *   - Priority: cpu > cpuid > thread > thread_id
+ *   - Adds 'node' alongside the primary dimension if available
+ *
+ * For all other profile types:
+ *   - No auto-selection
+ */
+export const useAutoSelectDimension = (metadataLabels, flamechartDimension, setFlamechartDimension, profileType) => {
+    const hasAutoSelected = useRef(false);
+    useEffect(() => {
+        if (hasAutoSelected.current)
+            return;
+        if (metadataLabels == null || metadataLabels.length === 0)
+            return;
+        if ((flamechartDimension ?? []).length > 0) {
+            hasAutoSelected.current = true;
+            return;
+        }
+        if (isOnGpuProfile(profileType)) {
+            const availableGpuDims = GPU_DIMENSIONS.filter(d => metadataLabels.includes(d));
+            if (availableGpuDims.length > 0) {
+                setFlamechartDimension(availableGpuDims.map(d => `labels.${d}`));
+                hasAutoSelected.current = true;
+                return;
+            }
+        }
+        if (isOnCpuProfile(profileType)) {
+            const hasNode = metadataLabels.includes('node');
+            for (const name of CPU_PREFERRED_DIMENSIONS) {
+                if (metadataLabels.includes(name)) {
+                    const dims = hasNode ? ['node', name] : [name];
+                    setFlamechartDimension(dims.map(d => `labels.${d}`));
+                    hasAutoSelected.current = true;
+                    return;
+                }
+            }
+        }
+    }, [metadataLabels, flamechartDimension, setFlamechartDimension, profileType]);
+};

package/dist/ProfileView/hooks/useProfileMetadata.d.ts

@@ -1,4 +1,4 @@
-import { Table as ArrowTable } from 'apache-arrow';
+import { Table } from '@uwdata/flechette';
 import { FlamegraphArrow } from '@parca/client';
 interface UseProfileMetadataProps {
     flamegraphArrow?: FlamegraphArrow;
@@ -7,7 +7,7 @@ interface UseProfileMetadataProps {
     colorBy: string;
 }
 export declare const useProfileMetadata: ({ flamegraphArrow, metadataMappingFiles, metadataLoading, colorBy, }: UseProfileMetadataProps) => {
-    table: ArrowTable<any> | null;
+    table: Table | null;
     mappingsList: string[];
     filenamesList: string[];
     colorMappings: string[];

package/dist/ProfileView/hooks/useProfileMetadata.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useProfileMetadata.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useProfileMetadata.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,IAAI,UAAU,EAAe,MAAM,cAAc,CAAC;AAE/D,OAAO,EAAC,eAAe,EAAC,MAAM,eAAe,CAAC;AAM9C,UAAU,uBAAuB;IAC/B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,kBAAkB,GAAI,sEAKhC,uBAAuB,KAAG;IAC3B,KAAK,EAAE,UAAU,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC9B,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;CAkB1B,CAAC"}
+{"version":3,"file":"useProfileMetadata.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useProfileMetadata.ts"],"names":[],"mappings":"AAeA,OAAO,EAAC,KAAK,EAAe,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EAAC,eAAe,EAAC,MAAM,eAAe,CAAC;AAO9C,UAAU,uBAAuB;IAC/B,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,kBAAkB,GAAI,sEAKhC,uBAAuB,KAAG;IAC3B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,eAAe,EAAE,OAAO,CAAC;CAqB1B,CAAC"}

package/dist/ProfileView/hooks/useProfileMetadata.js

@@ -11,11 +11,15 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { useMemo } from 'react';
-import { tableFromIPC } from 'apache-arrow';
+import { tableFromIPC } from '@uwdata/flechette';
 import useMappingList, { useFilenamesList, } from '../../ProfileFlameGraph/FlameGraphArrow/useMappingList';
+import { alignedUint8Array } from '../../utils';
 export const useProfileMetadata = ({ flamegraphArrow, metadataMappingFiles, metadataLoading, colorBy, }) => {
     const table = useMemo(() => {
-        return flamegraphArrow !== undefined ? tableFromIPC(flamegraphArrow.record) : null;
+        if (flamegraphArrow === undefined) {
+            return null;
+        }
+        return tableFromIPC(alignedUint8Array(flamegraphArrow.record), { useBigInt: true });
     }, [flamegraphArrow]);
     const mappingsList = useMappingList(metadataMappingFiles);
     const filenamesList = useFilenamesList(table);

package/dist/ProfileView/hooks/useVisualizationState.d.ts

@@ -9,6 +9,8 @@ export declare const useVisualizationState: () => {
     setGroupBy: (keys: string[]) => void;
     toggleGroupBy: (key: string) => void;
     setGroupByLabels: (labels: string[]) => void;
+    flamechartDimension: string[];
+    setFlamechartDimension: (labels: string[]) => void;
     sandwichFunctionName: string | undefined;
     setSandwichFunctionName: (sandwichFunctionName: string | undefined) => void;
     resetSandwichFunctionName: () => void;

package/dist/ProfileView/hooks/useVisualizationState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useVisualizationState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useVisualizationState.ts"],"names":[],"mappings":"AA+BA,OAAO,EAAC,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AAG/E,eAAO,MAAM,qBAAqB,QAAO;IACvC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5E,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAiH/C,CAAC"}
+{"version":3,"file":"useVisualizationState.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/hooks/useVisualizationState.ts"],"names":[],"mappings":"AA+BA,OAAO,EAAC,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AAG/E,eAAO,MAAM,qBAAqB,QAAO;IACvC,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,sBAAsB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,oBAAoB,EAAE,MAAM,GAAG,SAAS,CAAC;IACzC,uBAAuB,EAAE,CAAC,oBAAoB,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5E,yBAAyB,EAAE,MAAM,IAAI,CAAC;IACtC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAgI/C,CAAC"}

package/dist/ProfileView/hooks/useVisualizationState.js

@@ -35,6 +35,9 @@ export const useVisualizationState = () => {
         alwaysReturnArray: true,
     });
     const [sandwichFunctionName, setSandwichFunctionName] = useURLState('sandwich_function_name');
+    const [flamechartDimension, setStoreFlamechartDimension] = useURLState('flamechart_dimension', {
+        alwaysReturnArray: true,
+    });
     const resetFlameGraphState = useResetFlameGraphState();
     const batchUpdates = useURLStateBatch();
     const levelsOfProfiling = useMemo(() => [
@@ -66,6 +69,9 @@ export const useVisualizationState = () => {
             resetFlameGraphState();
         });
     }, [groupBy, setGroupBy, resetFlameGraphState, batchUpdates]);
+    const setFlamechartDimension = useCallback((labels) => {
+        setStoreFlamechartDimension(labels.filter(l => l.startsWith(`${FIELD_LABELS}.`)));
+    }, [setStoreFlamechartDimension]);
     const resetSandwichFunctionName = useCallback(() => {
         setSandwichFunctionName(undefined);
     }, [setSandwichFunctionName]);
@@ -87,6 +93,8 @@ export const useVisualizationState = () => {
         setGroupBy,
         toggleGroupBy,
         setGroupByLabels,
+        flamechartDimension,
+        setFlamechartDimension,
         sandwichFunctionName,
         setSandwichFunctionName,
         resetSandwichFunctionName,

package/dist/ProfileView/index.d.ts

@@ -1,3 +1,3 @@
 import type { ProfileViewProps } from './types/visualization';
-export declare const ProfileView: ({ total, filtered, flamegraphData, flamechartData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, }: ProfileViewProps) => JSX.Element;
+export declare const ProfileView: ({ total, filtered, flamegraphData, samplesData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, onSwitchToOneMinute, }: ProfileViewProps) => JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/ProfileView/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAE/E,eAAO,MAAM,WAAW,GAAI,iMAczB,gBAAgB,KAAG,GAAG,CAAC,OAsIzB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileView/index.tsx"],"names":[],"mappings":"AAgCA,OAAO,KAAK,EAAC,gBAAgB,EAAoB,MAAM,uBAAuB,CAAC;AAE/E,eAAO,MAAM,WAAW,GAAI,mNAezB,gBAAgB,KAAG,GAAG,CAAC,OAkJzB,CAAC"}

package/dist/ProfileView/index.js

@@ -21,12 +21,14 @@ import { ProfileHeader } from './components/ProfileHeader';
 import { FlameGraphToolbar, SandwichFlameGraphToolbar, TableToolbar, VisualisationToolbar, } from './components/Toolbars';
 import { DashboardProvider } from './context/DashboardContext';
 import { ProfileViewContextProvider } from './context/ProfileViewContext';
+import { useAutoSelectDimension } from './hooks/useAutoSelectDimension';
 import { useProfileMetadata } from './hooks/useProfileMetadata';
 import { useVisualizationState } from './hooks/useVisualizationState';
-export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, }) => {
+export const ProfileView = ({ total, filtered, flamegraphData, samplesData, topTableData, sourceData, profileSource, queryClient, onDownloadPProf, pprofDownloading, compare, showVisualizationSelector, sandwichData, onSwitchToOneMinute, }) => {
     const { timezone, perf, profileViewExternalMainActions, preferencesModal, profileViewExternalSubActions, } = useParcaContext();
     const { ref, dimensions } = useContainerDimensions();
-    const { curPathArrow, setCurPathArrow, colorStackLegend, colorBy, setColorBy, groupBy, toggleGroupBy, setGroupByLabels, sandwichFunctionName, resetSandwichFunctionName, alignFunctionName, setAlignFunctionName, } = useVisualizationState();
+    const { curPathArrow, setCurPathArrow, colorStackLegend, colorBy, setColorBy, groupBy, toggleGroupBy, setGroupByLabels, flamechartDimension, setFlamechartDimension, sandwichFunctionName, resetSandwichFunctionName, alignFunctionName, setAlignFunctionName, } = useVisualizationState();
+    useAutoSelectDimension(flamegraphData.metadataLabels, flamechartDimension, setFlamechartDimension, profileSource?.ProfileType());
     const { colorMappings } = useProfileMetadata({
         flamegraphArrow: flamegraphData.arrow,
         metadataMappingFiles: flamegraphData.metadataMappingFiles,
@@ -43,7 +45,7 @@ export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, t
             isHalfScreen,
             dimensions,
             flamegraphData,
-            flamechartData,
+            samplesData,
             topTableData,
             sourceData,
             profileSource,
@@ -53,6 +55,7 @@ export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, t
             setNewCurPathArrow: setCurPathArrow,
             perf,
             queryClient,
+            onSwitchToOneMinute,
         });
     };
     const actionButtons = {
@@ -65,5 +68,5 @@ export const ProfileView = ({ total, filtered, flamegraphData, flamechartData, t
                             labels: flamegraphData.metadataLabels ?? [],
                             refetch: flamegraphData.metadataRefetch,
                             loading: flamegraphData.metadataLoading,
-                        }, preferencesModal: preferencesModal, profileViewExternalSubActions: profileViewExternalSubActions, setGroupByLabels: setGroupByLabels, showVisualizationSelector: showVisualizationSelector, sandwichFunctionName: sandwichFunctionName, alignFunctionName: alignFunctionName, setAlignFunctionName: setAlignFunctionName, colorBy: colorBy, setColorBy: setColorBy }), isColorStackLegendEnabled && (_jsx(ColorStackLegend, { compareMode: compareMode, mappings: colorMappings, loading: flamegraphData.metadataLoading })), _jsx("div", { className: "w-full", ref: ref, children: _jsx(DashboardLayout, { getDashboardItemByType: getDashboardItemByType, actionButtons: actionButtons }) })] }) }) }));
+                        }, preferencesModal: preferencesModal, profileViewExternalSubActions: profileViewExternalSubActions, setGroupByLabels: setGroupByLabels, flamechartDimension: flamechartDimension, setFlamechartDimension: setFlamechartDimension, showVisualizationSelector: showVisualizationSelector, sandwichFunctionName: sandwichFunctionName, alignFunctionName: alignFunctionName, setAlignFunctionName: setAlignFunctionName, colorBy: colorBy, setColorBy: setColorBy }), isColorStackLegendEnabled && (_jsx(ColorStackLegend, { compareMode: compareMode, mappings: colorMappings, loading: flamegraphData.metadataLoading })), _jsx("div", { className: "w-full", ref: ref, children: _jsx(DashboardLayout, { getDashboardItemByType: getDashboardItemByType, actionButtons: actionButtons }) })] }) }) }));
 };

package/dist/ProfileView/types/visualization.d.ts

@@ -1,5 +1,6 @@
 import { RpcError } from '@protobuf-ts/runtime-rpc';
-import { FlamegraphArrow, QueryServiceClient, Source, TableArrow } from '@parca/client';
+import { FlamegraphArrow, LabelSet, QueryServiceClient, Source, TableArrow } from '@parca/client';
+import { DataPoint } from '../../ProfileFlameChart/SamplesStrips/SamplesGraph';
 import { ProfileSource } from '../../ProfileSource';
 export interface FlamegraphData {
     loading: boolean;
@@ -29,20 +30,31 @@ export interface SandwichData {
     callees: FlamegraphData;
     callers: FlamegraphData;
 }
+export interface SamplesSeries {
+    labelset: LabelSet;
+    data: DataPoint[];
+}
+export interface SamplesData {
+    loading: boolean;
+    series?: SamplesSeries[];
+    error: RpcError | null;
+    stepMs?: number;
+}
 export type VisualizationType = 'flamegraph' | 'callgraph' | 'table' | 'source' | 'flamechart' | 'sandwich';
 export interface ProfileViewProps {
     total: bigint;
     filtered: bigint;
     flamegraphData: FlamegraphData;
-    flamechartData: FlamegraphData;
+    samplesData?: SamplesData;
     sandwichData: SandwichData;
     topTableData?: TopTableData;
     sourceData?: SourceData;
     profileSource: ProfileSource;
-    queryClient?: QueryServiceClient;
+    queryClient: QueryServiceClient;
     compare?: boolean;
     onDownloadPProf: () => void;
     pprofDownloading?: boolean;
     showVisualizationSelector?: boolean;
+    onSwitchToOneMinute?: () => void;
 }
 //# sourceMappingURL=visualization.d.ts.map

package/dist/ProfileView/types/visualization.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/types/visualization.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAC,eAAe,EAAE,kBAAkB,EAAE,MAAM,EAAE,UAAU,EAAC,MAAM,eAAe,CAAC;AAEtF,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAElD,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC;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,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,cAAc,CAAC;IACxB,OAAO,EAAE,cAAc,CAAC;CACzB;AAED,MAAM,MAAM,iBAAiB,GACzB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,UAAU,CAAC;AAEf,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,EAAE,YAAY,CAAC;IAC3B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,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"}
+{"version":3,"file":"visualization.d.ts","sourceRoot":"","sources":["../../../src/ProfileView/types/visualization.ts"],"names":[],"mappings":"AAaA,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAC,eAAe,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,EAAE,UAAU,EAAC,MAAM,eAAe,CAAC;AAEhG,OAAO,EAAC,SAAS,EAAC,MAAM,oDAAoD,CAAC;AAC7E,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAC;AAElD,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,oBAAoB,CAAC,EAAE,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC;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,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,cAAc,CAAC;IACxB,OAAO,EAAE,cAAc,CAAC;CACzB;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,QAAQ,CAAC;IACnB,IAAI,EAAE,SAAS,EAAE,CAAC;CACnB;AAED,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;IACzB,KAAK,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,iBAAiB,GACzB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,UAAU,CAAC;AAEf,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,cAAc,CAAC;IAC/B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,YAAY,EAAE,YAAY,CAAC;IAC3B,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;IAC7B,WAAW,EAAE,kBAAkB,CAAC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC"}

package/dist/ProfileViewWithData.d.ts

@@ -5,7 +5,8 @@ interface ProfileViewWithDataProps {
     profileSource: ProfileSource;
     compare?: boolean;
     showVisualizationSelector?: boolean;
+    onSwitchToOneMinute?: () => void;
 }
-export declare const ProfileViewWithData: ({ queryClient, profileSource, showVisualizationSelector, }: ProfileViewWithDataProps) => JSX.Element;
+export declare const ProfileViewWithData: ({ queryClient, profileSource, showVisualizationSelector, onSwitchToOneMinute, }: ProfileViewWithDataProps) => JSX.Element;
 export default ProfileViewWithData;
 //# sourceMappingURL=ProfileViewWithData.d.ts.map

package/dist/ProfileViewWithData.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAM1E,OAAO,EAAsB,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAMnE,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,GAAI,4DAIjC,wBAAwB,KAAG,GAAG,CAAC,OAgTjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"ProfileViewWithData.d.ts","sourceRoot":"","sources":["../src/ProfileViewWithData.tsx"],"names":[],"mappings":"AAeA,OAAO,EAA0B,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAkB1E,OAAO,EAAsB,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAOnE,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,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC;AAED,eAAO,MAAM,mBAAmB,GAAI,iFAKjC,wBAAwB,KAAG,GAAG,CAAC,OA4UjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/ProfileViewWithData.js

@@ -13,15 +13,17 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // limitations under the License.
 import { useEffect, useMemo, useState } from 'react';
 import { QueryRequest_ReportType } from '@parca/client';
-import { useGrpcMetadata, useParcaContext, useURLState } from '@parca/components';
+import { NumberParser, NumberSerializer, useGrpcMetadata, useParcaContext, useURLState, useURLStateCustom, } from '@parca/components';
 import { saveAsBlob } from '@parca/utilities';
 import { validateFlameChartQuery } from './ProfileFlameGraph';
 import { FIELD_FUNCTION_NAME } from './ProfileFlameGraph/FlameGraphArrow';
+import { boundsFromProfileSource } from './ProfileFlameGraph/FlameGraphArrow/utils';
+import { getStepCountFromScreenWidth, useQueryRange, } from './ProfileMetricsGraph/hooks/useQueryRange';
 import { ProfileView } from './ProfileView';
 import { useProfileFilters } from './ProfileView/components/ProfileFilters/useProfileFilters';
 import { useQuery } from './useQuery';
 import { downloadPprof } from './utils';
-export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizationSelector, }) => {
+export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizationSelector, onSwitchToOneMinute, }) => {
     const metadata = useGrpcMetadata();
     const [dashboardItems, setDashboardItems] = useURLState('dashboard_items', {
         alwaysReturnArray: true,
@@ -33,6 +35,9 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
         alwaysReturnArray: true,
     });
     const [sandwichFunctionName] = useURLState('sandwich_function_name');
+    const [flamechartDimension] = useURLState('flamechart_dimension', {
+        alwaysReturnArray: true,
+    });
     const [invertStack] = useURLState('invert_call_stack');
     const invertCallStack = invertStack === 'true';
     const [pprofDownloading, setPprofDownloading] = useState(false);
@@ -71,14 +76,40 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
         invertCallStack,
         protoFilters,
     });
-    const { isLoading: flamechartLoading, response: flamechartResponse, error: flamechartError, } = useQuery(queryClient, profileSource, QueryRequest_ReportType.FLAMECHART, {
-        skip: !(dashboardItems.includes('flamechart') &&
-            validateFlameChartQuery(profileSource).isValid),
-        nodeTrimThreshold,
-        groupBy,
-        invertCallStack,
-        protoFilters,
+    const samplesEnabled = !!(dashboardItems.includes('flamechart') &&
+        validateFlameChartQuery(profileSource).isValid &&
+        (flamechartDimension ?? []).length > 0);
+    const [samplesFromMs, samplesToMs] = useMemo(() => {
+        const bounds = boundsFromProfileSource(profileSource);
+        return [Number(bounds[0] / 1000000n), Number(bounds[1] / 1000000n)];
+    }, [profileSource]);
+    const samplesSumBy = useMemo(() => (flamechartDimension ?? []).map(f => f.startsWith('labels.') ? f.slice('labels.'.length) : f), [flamechartDimension]);
+    // Samples step count: 2px per data point for finer granularity in strips
+    const [samplesStepCount] = useURLStateCustom('samples_step_count', {
+        defaultValue: String(getStepCountFromScreenWidth(2)),
+        parse: NumberParser,
+        stringify: NumberSerializer,
     });
+    const { isLoading: samplesLoading, response: samplesRangeResponse, error: samplesError, stepDurationMs: samplesStepMs, } = useQueryRange(queryClient, samplesEnabled ? profileSource.query.toString() : '', samplesFromMs, samplesToMs, samplesSumBy, samplesStepCount, !samplesEnabled);
+    // Map QueryRange response to SamplesData
+    // TODO (manoj): Check if we can skip this mapping and adapt the CPUSampleStrips to work directly with the QueryRange response format.
+    const samplesData = useMemo(() => {
+        if (samplesLoading)
+            return { loading: true, error: null };
+        if (samplesError != null)
+            return { loading: false, error: samplesError };
+        if (samplesRangeResponse?.series?.length == null)
+            return { loading: false, error: null };
+        const series = samplesRangeResponse.series.map(ms => ({
+            labelset: ms.labelset ?? { labels: [] },
+            data: ms.samples.map(s => ({
+                timestamp: Number(s.timestamp.seconds) * 1000 + Math.floor(s.timestamp.nanos / 1000000),
+                value: Number(s.value),
+                sampleCount: Number(s.count),
+            })),
+        }));
+        return { loading: false, series, error: null, stepMs: samplesStepMs };
+    }, [samplesLoading, samplesRangeResponse, samplesError, samplesStepMs]);
     const { isLoading: profileMetadataLoading, response: profileMetadataResponse, error: profileMetadataError, refetch: metadataRefetch, } = useQuery(queryClient, profileSource, QueryRequest_ReportType.PROFILE_METADATA, {
         nodeTrimThreshold,
         groupBy,
@@ -165,10 +196,6 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
         total = BigInt(sourceResponse.total);
         filtered = BigInt(sourceResponse.filtered);
     }
-    else if (flamechartResponse !== null) {
-        total = BigInt(flamechartResponse.total);
-        filtered = BigInt(flamechartResponse.filtered);
-    }
     else if (callersFlamegraphResponse !== null) {
         total = BigInt(callersFlamegraphResponse.total);
         filtered = BigInt(callersFlamegraphResponse.filtered);
@@ -193,21 +220,6 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
                 : undefined,
             metadataLoading: profileMetadataLoading,
             metadataRefetch,
-        }, flamechartData: {
-            loading: flamechartLoading && profileMetadataLoading,
-            arrow: flamechartResponse?.report.oneofKind === 'flamegraphArrow'
-                ? flamechartResponse?.report?.flamegraphArrow
-                : undefined,
-            total: BigInt(flamechartResponse?.total ?? '0'),
-            filtered: BigInt(flamechartResponse?.filtered ?? '0'),
-            error: flamechartError,
-            metadataMappingFiles: profileMetadataResponse?.report.oneofKind === 'profileMetadata'
-                ? profileMetadataResponse?.report?.profileMetadata?.mappingFiles
-                : undefined,
-            metadataLabels: profileMetadataResponse?.report.oneofKind === 'profileMetadata'
-                ? profileMetadataResponse?.report?.profileMetadata?.labels
-                : undefined,
-            metadataLoading: profileMetadataLoading,
         }, topTableData: {
             loading: tableLoading,
             arrow: tableResponse?.report.oneofKind === 'tableArrow'
@@ -250,6 +262,6 @@ export const ProfileViewWithData = ({ queryClient, profileSource, showVisualizat
                     : undefined,
                 metadataLoading: profileMetadataLoading,
             },
-        }, profileSource: profileSource, queryClient: queryClient, onDownloadPProf: () => void downloadPProfClick(), pprofDownloading: pprofDownloading, showVisualizationSelector: showVisualizationSelector }));
+        }, samplesData: samplesData, profileSource: profileSource, queryClient: queryClient, onDownloadPProf: () => void downloadPProfClick(), pprofDownloading: pprofDownloading, showVisualizationSelector: showVisualizationSelector, onSwitchToOneMinute: onSwitchToOneMinute }));
 };
 export default ProfileViewWithData;

package/dist/Sandwich/components/CallersSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CallersSection.d.ts","sourceRoot":"","sources":["../../../src/Sandwich/components/CallersSection.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AASrC,OAAO,EAAC,KAAK,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAC,cAAc,EAAC,MAAM,uCAAuC,CAAC;AAerE,UAAU,mBAAmB;IAC3B,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC5C,qBAAqB,EAAE,cAAc,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;IAC7B,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,cAAc,CAAC,EAC7B,UAAU,EACV,qBAAqB,EACrB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,UAAU,EACV,aAAa,EACb,gBAAgB,GACjB,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAqEnC"}
+{"version":3,"file":"CallersSection.d.ts","sourceRoot":"","sources":["../../../src/Sandwich/components/CallersSection.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAgB,MAAM,OAAO,CAAC;AASrC,OAAO,EAAC,KAAK,gBAAgB,EAAC,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAC,KAAK,aAAa,EAAC,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAC,cAAc,EAAC,MAAM,uCAAuC,CAAC;AAgBrE,UAAU,mBAAmB;IAC3B,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC5C,qBAAqB,EAAE,cAAc,CAAC;IACtC,aAAa,EAAE,aAAa,CAAC;IAC7B,YAAY,EAAE,gBAAgB,EAAE,CAAC;IACjC,eAAe,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IACpD,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,wBAAgB,cAAc,CAAC,EAC7B,UAAU,EACV,qBAAqB,EACrB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,UAAU,EACV,aAAa,EACb,gBAAgB,GACjB,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAuEnC"}