@parca/profile 0.19.121 → 0.19.122
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/dist/GraphTooltipArrow/Content.js +1 -1
- package/dist/MetricsGraph/useMetricsGraphDimensions.d.ts.map +1 -1
- package/dist/MetricsGraph/useMetricsGraphDimensions.js +5 -3
- package/dist/ProfileMetricsGraph/index.d.ts.map +1 -1
- package/dist/ProfileMetricsGraph/index.js +2 -1
- package/dist/ProfileSelector/MetricsGraphSection.d.ts +1 -2
- package/dist/ProfileSelector/MetricsGraphSection.d.ts.map +1 -1
- package/dist/ProfileSelector/MetricsGraphSection.js +4 -1
- package/dist/ProfileSelector/index.d.ts.map +1 -1
- package/dist/ProfileSelector/index.js +8 -3
- package/package.json +3 -3
- package/src/GraphTooltipArrow/Content.tsx +1 -1
- package/src/MetricsGraph/useMetricsGraphDimensions.ts +7 -5
- package/src/ProfileMetricsGraph/index.tsx +5 -1
- package/src/ProfileSelector/MetricsGraphSection.tsx +3 -2
- package/src/ProfileSelector/index.tsx +7 -3
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.19.122](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.121...@parca/profile@0.19.122) (2026-02-13)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @parca/profile
|
|
9
|
+
|
|
6
10
|
## [0.19.121](https://github.com/parca-dev/parca/compare/@parca/profile@0.19.120...@parca/profile@0.19.121) (2026-02-12)
|
|
7
11
|
|
|
8
12
|
**Note:** Version bump only for package @parca/profile
|
|
@@ -35,6 +35,6 @@ const TooltipMetaInfo = ({ table, row }) => {
|
|
|
35
35
|
const labels = labelPairs.map((l) => (_jsx("span", { className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400", children: `${l[0]}="${l[1]}"` }, l[0])));
|
|
36
36
|
const isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
|
|
37
37
|
const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
|
|
38
|
-
return (_jsxs(_Fragment, { children: [timestamp != null && timestamp !== 0n && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4 pt-2", children: "Timestamp" }), _jsx("td", { className: "w-3/4 pt-2 break-all", children: formatDateTimeDownToMS(new Date(Number(timestamp / 1000000n)), timezone) })] })), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "File" }), _jsx("td", { className: "w-3/4 break-all", children: functionFilename === '' ? (_jsx(NoData, {})) : (_jsx("div", { className: "flex gap-4", children: _jsx("div", { className: "whitespace-nowrap text-left", children: _jsx(ExpandOnHover, { value: file, displayValue: truncateStringReverse(file,
|
|
38
|
+
return (_jsxs(_Fragment, { children: [timestamp != null && timestamp !== 0n && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4 pt-2", children: "Timestamp" }), _jsx("td", { className: "w-3/4 pt-2 break-all", children: formatDateTimeDownToMS(new Date(Number(timestamp / 1000000n)), timezone) })] })), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "File" }), _jsx("td", { className: "w-3/4 break-all", children: functionFilename === '' ? (_jsx(NoData, {})) : (_jsx("div", { className: "flex gap-4", children: _jsx("div", { className: "whitespace-nowrap text-left", children: _jsx(ExpandOnHover, { value: file, displayValue: truncateStringReverse(file, 50) }) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Address" }), _jsx("td", { className: "w-3/4 break-all", children: locationAddress === 0n ? _jsx(NoData, {}) : _jsx("div", { children: hexifyAddress(locationAddress) }) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Inlined" }), _jsx("td", { className: "w-3/4 break-all", children: inlinedText })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Binary" }), _jsx("td", { className: "w-3/4 break-all", children: (mappingFile != null ? getLastItem(mappingFile) : null) ?? _jsx(NoData, {}) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Build Id" }), _jsx("td", { className: "w-3/4 break-all", children: isMappingBuildIDAvailable ? _jsx("div", { children: truncateString(mappingBuildID, 28) }) : _jsx(NoData, {}) })] }), labelPairs.length > 0 && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Labels" }), _jsx("td", { className: "w-3/4 break-all", children: labels })] }))] }));
|
|
39
39
|
};
|
|
40
40
|
export default GraphTooltipArrowContent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMetricsGraphDimensions.d.ts","sourceRoot":"","sources":["../../src/MetricsGraph/useMetricsGraphDimensions.ts"],"names":[],"mappings":"AAiBA,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;CAChB;AAMD,eAAO,MAAM,yBAAyB,GACpC,WAAW,OAAO,EAClB,gBAAc,KACb,
|
|
1
|
+
{"version":3,"file":"useMetricsGraphDimensions.d.ts","sourceRoot":"","sources":["../../src/MetricsGraph/useMetricsGraphDimensions.ts"],"names":[],"mappings":"AAiBA,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;CAChB;AAMD,eAAO,MAAM,yBAAyB,GACpC,WAAW,OAAO,EAClB,gBAAc,KACb,sBA8BF,CAAC"}
|
|
@@ -32,9 +32,11 @@ export const useMetricsGraphDimensions = (comparing, isMini = false) => {
|
|
|
32
32
|
width = width / 2 - 32;
|
|
33
33
|
}
|
|
34
34
|
const height = isMini ? MINI_VARIANT_HEIGHT : Math.min(width / 2.5, maxHeight);
|
|
35
|
-
const heightStyle =
|
|
36
|
-
?
|
|
37
|
-
:
|
|
35
|
+
const heightStyle = isMini
|
|
36
|
+
? `${MINI_VARIANT_HEIGHT + margin}px`
|
|
37
|
+
: `min(${maxHeight + margin}px, ${comparing
|
|
38
|
+
? profileExplorer.metricsGraph.maxHeightStyle.compareMode
|
|
39
|
+
: profileExplorer.metricsGraph.maxHeightStyle.default})`;
|
|
38
40
|
return {
|
|
39
41
|
width,
|
|
40
42
|
height,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EACL,KAAK,EAGL,kBAAkB,EACnB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,aAAa,EAOd,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AA6G5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,GAAI,aAAW,6BAA6B,KAAG,GAAG,CAAC,OAMvF,CAAC;AAEF,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CACf,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KACvE,IAAI,CAAC;IACV,YAAY,EAAE,CACZ,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,KAAK,EAAE,EACf,eAAe,EAAE,MAAM,EACvB,QAAQ,EAAE,MAAM,KACb,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,GAAI,qHAW1B,wBAAwB,KAAG,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileMetricsGraph/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,EACL,KAAK,EAGL,kBAAkB,EACnB,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,aAAa,EAOd,MAAM,mBAAmB,CAAC;AAK3B,OAAO,EAAyB,gBAAgB,EAAC,MAAM,IAAI,CAAC;AA6G5D,UAAU,6BAA6B;IACrC,OAAO,EAAE,MAAM,CAAC;CACjB;AAaD,eAAO,MAAM,wBAAwB,GAAI,aAAW,6BAA6B,KAAG,GAAG,CAAC,OAMvF,CAAC;AAEF,UAAU,wBAAwB;IAChC,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC7C,eAAe,EAAE,CACf,MAAM,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,GAAG,KAAK,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC,KACvE,IAAI,CAAC;IACV,YAAY,EAAE,CACZ,SAAS,EAAE,MAAM,EACjB,MAAM,EAAE,KAAK,EAAE,EACf,eAAe,EAAE,MAAM,EACvB,QAAQ,EAAE,MAAM,KACb,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,GAAI,qHAW1B,wBAAwB,KAAG,GAAG,CAAC,OAiXjC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -125,7 +125,8 @@ const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to,
|
|
|
125
125
|
}, [rawStepCount, from, to]);
|
|
126
126
|
const { isLoading: metricsGraphLoading, response, error, } = useQueryRange(queryClient, queryExpression, from, to, sumBy, stepCount, queryExpression === '');
|
|
127
127
|
const { onError, perf, authenticationErrorMessage, isDarkMode, timezone } = useParcaContext();
|
|
128
|
-
const
|
|
128
|
+
const isGpuProfileType = queryExpression.includes(':cuda:');
|
|
129
|
+
const { width, height, margin, heightStyle } = useMetricsGraphDimensions(comparing, isGpuProfileType);
|
|
129
130
|
const [showAllSeriesForResponse, setShowAllSeriesForResponse] = useState(null);
|
|
130
131
|
useEffect(() => {
|
|
131
132
|
if (error !== null) {
|
|
@@ -6,7 +6,6 @@ import { QuerySelection } from './index';
|
|
|
6
6
|
interface MetricsGraphSectionProps {
|
|
7
7
|
showMetricsGraph: boolean;
|
|
8
8
|
setDisplayHideMetricsGraphButton?: (show: boolean) => void;
|
|
9
|
-
heightStyle: string;
|
|
10
9
|
querySelection: QuerySelection;
|
|
11
10
|
profileSelection: ProfileSelection | null;
|
|
12
11
|
comparing: boolean;
|
|
@@ -28,6 +27,6 @@ interface MetricsGraphSectionProps {
|
|
|
28
27
|
profileTypesLoading?: boolean;
|
|
29
28
|
hasNoProfileTypes?: boolean;
|
|
30
29
|
}
|
|
31
|
-
export declare function MetricsGraphSection({ showMetricsGraph, setDisplayHideMetricsGraphButton,
|
|
30
|
+
export declare function MetricsGraphSection({ showMetricsGraph, setDisplayHideMetricsGraphButton, querySelection, profileSelection, comparing, sumBy, defaultSumByLoading, queryClient, queryExpressionString, setTimeRangeSelection, selectQuery, setProfileSelection, query, setNewQueryExpression, commitDraft, profileTypesLoading, hasNoProfileTypes, }: MetricsGraphSectionProps): JSX.Element;
|
|
32
31
|
export {};
|
|
33
32
|
//# sourceMappingURL=MetricsGraphSection.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricsGraphSection.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/MetricsGraphSection.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAQ,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAC,aAAa,EAAmB,MAAM,mBAAmB,CAAC;AAClE,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAC,gBAAgB,EAAC,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"MetricsGraphSection.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/MetricsGraphSection.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAQ,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACxD,OAAO,EAAC,aAAa,EAAmB,MAAM,mBAAmB,CAAC;AAClE,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAC,gBAAgB,EAAC,MAAM,IAAI,CAAC;AAIpC,OAAO,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAEvC,UAAU,wBAAwB;IAChC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,gCAAgC,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D,cAAc,EAAE,cAAc,CAAC;IAC/B,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;IAC5B,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,kBAAkB,CAAC;IAChC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,qBAAqB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACtD,WAAW,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC7C,mBAAmB,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAChF,KAAK,EAAE,KAAK,CAAC;IACb,qBAAqB,EAAE,CAAC,eAAe,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,kBAAkB,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,WAAW,EAAE,CACX,kBAAkB,CAAC,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,aAAa,EAAE,MAAM,CAAA;KAAC,EACtE,UAAU,CAAC,EAAE,MAAM,KAChB,IAAI,CAAC;IACV,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,gBAAgB,EAChB,gCAAgC,EAChC,cAAc,EACd,gBAAgB,EAChB,SAAS,EACT,KAAK,EACL,mBAAmB,EACnB,WAAW,EACX,qBAAqB,EACrB,qBAAqB,EACrB,WAAW,EACX,mBAAmB,EACnB,KAAK,EACL,qBAAqB,EACrB,WAAW,EACX,mBAA2B,EAC3B,iBAAyB,GAC1B,EAAE,wBAAwB,GAAG,GAAG,CAAC,OAAO,CAmIxC"}
|
|
@@ -14,11 +14,14 @@ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-run
|
|
|
14
14
|
import cx from 'classnames';
|
|
15
15
|
import { useURLStateBatch } from '@parca/components';
|
|
16
16
|
import { Query } from '@parca/parser';
|
|
17
|
+
import { useMetricsGraphDimensions } from '../MetricsGraph/useMetricsGraphDimensions';
|
|
17
18
|
import ProfileMetricsGraph, { ProfileMetricsEmptyState } from '../ProfileMetricsGraph';
|
|
18
19
|
import { useResetStateOnSeriesChange } from '../ProfileView/hooks/useResetStateOnSeriesChange';
|
|
19
|
-
export function MetricsGraphSection({ showMetricsGraph, setDisplayHideMetricsGraphButton,
|
|
20
|
+
export function MetricsGraphSection({ showMetricsGraph, setDisplayHideMetricsGraphButton, querySelection, profileSelection, comparing, sumBy, defaultSumByLoading, queryClient, queryExpressionString, setTimeRangeSelection, selectQuery, setProfileSelection, query, setNewQueryExpression, commitDraft, profileTypesLoading = false, hasNoProfileTypes = false, }) {
|
|
20
21
|
const resetStateOnSeriesChange = useResetStateOnSeriesChange();
|
|
21
22
|
const batchUpdates = useURLStateBatch();
|
|
23
|
+
const isGpuProfileType = querySelection.expression.includes(':cuda:');
|
|
24
|
+
const { heightStyle } = useMetricsGraphDimensions(comparing, isGpuProfileType);
|
|
22
25
|
const handleTimeRangeChange = (range) => {
|
|
23
26
|
const from = range.getFromMs();
|
|
24
27
|
const to = range.getToMs();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,QAAQ,EAAE,cAAc,EAAoD,MAAM,OAAO,CAAC;AAElG,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAsB,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAY5F,OAAO,EAAyB,KAAK,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ProfileSelector/index.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAC,QAAQ,EAAE,cAAc,EAAoD,MAAM,OAAO,CAAC;AAElG,OAAO,EAAC,QAAQ,EAAC,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAsB,oBAAoB,EAAE,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAY5F,OAAO,EAAyB,KAAK,gBAAgB,EAAC,MAAM,kBAAkB,CAAC;AAe/E,MAAM,WAAW,cAAc;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,uBAAuB;IAC/B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC;AAED,UAAU,oBAAqB,SAAQ,uBAAuB;IAC5D,WAAW,EAAE,kBAAkB,CAAC;IAChC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,gCAAgC,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACrE,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAmB;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B,KAAK,CAAC,EAAE,QAAQ,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,GAC1B,QAAQ,kBAAkB,EAC1B,QAAQ,MAAM,EACd,MAAM,MAAM,KACX,mBAsBF,CAAC;AAEF,QAAA,MAAM,eAAe,GAAI,kMAYtB,oBAAoB,KAAG,GAAG,CAAC,OA2Q7B,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -17,7 +17,6 @@ import { CloseIcon } from '@parca/icons';
|
|
|
17
17
|
import { Query } from '@parca/parser';
|
|
18
18
|
import { TEST_IDS, testId } from '@parca/test-utils';
|
|
19
19
|
import { millisToProtoTimestamp } from '@parca/utilities';
|
|
20
|
-
import { useMetricsGraphDimensions } from '../MetricsGraph/useMetricsGraphDimensions';
|
|
21
20
|
import { useProfileFilters, } from '../ProfileView/components/ProfileFilters/useProfileFilters';
|
|
22
21
|
import { QueryControls } from '../QueryControls';
|
|
23
22
|
import { LabelsQueryProvider, useLabelsQueryProvider } from '../contexts/LabelsQueryProvider';
|
|
@@ -48,7 +47,6 @@ export const useProfileTypes = (client, start, end) => {
|
|
|
48
47
|
return { loading: isLoading, data, error: error };
|
|
49
48
|
};
|
|
50
49
|
const ProfileSelector = ({ queryClient, closeProfile, enforcedProfileName, comparing, navigateTo, showMetricsGraph = true, showSumBySelector = true, showProfileTypeSelector = true, setDisplayHideMetricsGraphButton, suffix, onSearchHook, }) => {
|
|
51
|
-
const { heightStyle } = useMetricsGraphDimensions(comparing, false);
|
|
52
50
|
const { viewComponent, additionalMetricsGraph } = useParcaContext();
|
|
53
51
|
const [queryBrowserMode, setQueryBrowserMode] = useURLState('query_browser_mode');
|
|
54
52
|
const batchUpdates = useURLStateBatch();
|
|
@@ -168,7 +166,14 @@ const ProfileSelector = ({ queryClient, closeProfile, enforcedProfileName, compa
|
|
|
168
166
|
timeRange: timeRangeSelection,
|
|
169
167
|
onTimeRangeChange: handleTimeRangeChange,
|
|
170
168
|
commitTimeRange: () => setQueryExpression(true),
|
|
171
|
-
|
|
169
|
+
selectTimeRange: (range) => {
|
|
170
|
+
commitDraft({
|
|
171
|
+
from: range.getFromMs(),
|
|
172
|
+
to: range.getToMs(),
|
|
173
|
+
timeSelection: range.getRangeKey(),
|
|
174
|
+
});
|
|
175
|
+
},
|
|
176
|
+
}), _jsx(LabelsQueryProvider, { setMatchersString: setMatchersString, runQuery: setQueryExpression, currentQuery: query, profileType: selectedProfileName ?? profileType.toString(), queryClient: queryClient, start: timeRangeSelection.getFromMs(), end: timeRangeSelection.getToMs(), suffix: suffix, children: _jsx(LabelsSource, { children: _jsx(QueryControls, { showProfileTypeSelector: showProfileTypeSelector, showSumBySelector: showSumBySelector, profileTypesData: profileTypesData, profileTypesLoading: profileTypesLoading, selectedProfileName: selectedProfileName, setProfileName: setProfileName, setMatchersString: setMatchersString, setQueryExpression: setQueryExpression, query: query, queryBrowserRef: queryBrowserRef, timeRangeSelection: timeRangeSelection, setTimeRangeSelection: handleTimeRangeChange, searchDisabled: searchDisabled, setQueryBrowserMode: setQueryBrowserMode, advancedModeForQueryBrowser: advancedModeForQueryBrowser, setAdvancedModeForQueryBrowser: setAdvancedModeForQueryBrowser, queryClient: queryClient, sumByRef: sumByRef, labels: labels, sumBySelection: draftSelection.sumBy ?? [], sumBySelectionLoading: sumByLoading, setUserSumBySelection: setDraftSumBy, profileType: profileType, profileTypesError: error, viewComponent: viewComponent, draftSelection: draftSelection, setDraftMatchers: setDraftMatchers, draftParsedQuery: draftParsedQuery, commitDraft: commitDraft }) }) }), comparing && (_jsx("div", { children: _jsx(IconButton, { onClick: () => closeProfile(), icon: _jsx(CloseIcon, {}), ...testId(TEST_IDS.COMPARE_CLOSE_BUTTON) }) }))] }), _jsx(MetricsGraphSection, { showMetricsGraph: showMetricsGraph, setDisplayHideMetricsGraphButton: setDisplayHideMetricsGraphButton, querySelection: querySelection, profileSelection: profileSelection, comparing: comparing, sumBy: querySelection.sumBy, defaultSumByLoading: sumByLoading, queryClient: queryClient, queryExpressionString: queryExpressionString, setTimeRangeSelection: handleTimeRangeChange, selectQuery: commitDraft, setProfileSelection: setProfileSelection, query: query, setQueryExpression: setQueryExpression, setNewQueryExpression: setDraftExpression, commitDraft: commitDraft, profileTypesLoading: profileTypesLoading, hasNoProfileTypes: !profileTypesLoading &&
|
|
172
177
|
(profileTypesData?.types == null || profileTypesData.types.length === 0) })] }));
|
|
173
178
|
};
|
|
174
179
|
export default ProfileSelector;
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@parca/profile",
|
|
3
|
-
"version": "0.19.
|
|
3
|
+
"version": "0.19.122",
|
|
4
4
|
"description": "Profile viewing libraries",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@floating-ui/react": "^0.27.12",
|
|
7
7
|
"@headlessui/react": "^1.7.19",
|
|
8
8
|
"@iconify/react": "^4.0.0",
|
|
9
9
|
"@parca/client": "0.17.17",
|
|
10
|
-
"@parca/components": "0.16.
|
|
10
|
+
"@parca/components": "0.16.401",
|
|
11
11
|
"@parca/dynamicsize": "0.16.72",
|
|
12
12
|
"@parca/hooks": "0.0.118",
|
|
13
13
|
"@parca/icons": "0.16.79",
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"access": "public",
|
|
88
88
|
"registry": "https://registry.npmjs.org/"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "377a6f0c59e37aa19f6003e359f70bbc084982b7"
|
|
91
91
|
}
|
|
@@ -175,7 +175,7 @@ const TooltipMetaInfo = ({table, row}: {table: Table; row: number}): React.JSX.E
|
|
|
175
175
|
) : (
|
|
176
176
|
<div className="flex gap-4">
|
|
177
177
|
<div className="whitespace-nowrap text-left">
|
|
178
|
-
<ExpandOnHover value={file} displayValue={truncateStringReverse(file,
|
|
178
|
+
<ExpandOnHover value={file} displayValue={truncateStringReverse(file, 50)} />
|
|
179
179
|
</div>
|
|
180
180
|
</div>
|
|
181
181
|
)}
|
|
@@ -46,11 +46,13 @@ export const useMetricsGraphDimensions = (
|
|
|
46
46
|
width = width / 2 - 32;
|
|
47
47
|
}
|
|
48
48
|
const height = isMini ? MINI_VARIANT_HEIGHT : Math.min(width / 2.5, maxHeight);
|
|
49
|
-
const heightStyle =
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
49
|
+
const heightStyle = isMini
|
|
50
|
+
? `${MINI_VARIANT_HEIGHT + margin}px`
|
|
51
|
+
: `min(${maxHeight + margin}px, ${
|
|
52
|
+
comparing
|
|
53
|
+
? profileExplorer.metricsGraph.maxHeightStyle.compareMode
|
|
54
|
+
: profileExplorer.metricsGraph.maxHeightStyle.default
|
|
55
|
+
})`;
|
|
54
56
|
return {
|
|
55
57
|
width,
|
|
56
58
|
height,
|
|
@@ -225,7 +225,11 @@ const ProfileMetricsGraph = ({
|
|
|
225
225
|
queryExpression === ''
|
|
226
226
|
);
|
|
227
227
|
const {onError, perf, authenticationErrorMessage, isDarkMode, timezone} = useParcaContext();
|
|
228
|
-
const
|
|
228
|
+
const isGpuProfileType = queryExpression.includes(':cuda:');
|
|
229
|
+
const {width, height, margin, heightStyle} = useMetricsGraphDimensions(
|
|
230
|
+
comparing,
|
|
231
|
+
isGpuProfileType
|
|
232
|
+
);
|
|
229
233
|
const [showAllSeriesForResponse, setShowAllSeriesForResponse] = useState<typeof response | null>(
|
|
230
234
|
null
|
|
231
235
|
);
|
|
@@ -18,6 +18,7 @@ import {DateTimeRange, useURLStateBatch} from '@parca/components';
|
|
|
18
18
|
import {Query} from '@parca/parser';
|
|
19
19
|
|
|
20
20
|
import {ProfileSelection} from '..';
|
|
21
|
+
import {useMetricsGraphDimensions} from '../MetricsGraph/useMetricsGraphDimensions';
|
|
21
22
|
import ProfileMetricsGraph, {ProfileMetricsEmptyState} from '../ProfileMetricsGraph';
|
|
22
23
|
import {useResetStateOnSeriesChange} from '../ProfileView/hooks/useResetStateOnSeriesChange';
|
|
23
24
|
import {QuerySelection} from './index';
|
|
@@ -25,7 +26,6 @@ import {QuerySelection} from './index';
|
|
|
25
26
|
interface MetricsGraphSectionProps {
|
|
26
27
|
showMetricsGraph: boolean;
|
|
27
28
|
setDisplayHideMetricsGraphButton?: (show: boolean) => void;
|
|
28
|
-
heightStyle: string;
|
|
29
29
|
querySelection: QuerySelection;
|
|
30
30
|
profileSelection: ProfileSelection | null;
|
|
31
31
|
comparing: boolean;
|
|
@@ -50,7 +50,6 @@ interface MetricsGraphSectionProps {
|
|
|
50
50
|
export function MetricsGraphSection({
|
|
51
51
|
showMetricsGraph,
|
|
52
52
|
setDisplayHideMetricsGraphButton,
|
|
53
|
-
heightStyle,
|
|
54
53
|
querySelection,
|
|
55
54
|
profileSelection,
|
|
56
55
|
comparing,
|
|
@@ -69,6 +68,8 @@ export function MetricsGraphSection({
|
|
|
69
68
|
}: MetricsGraphSectionProps): JSX.Element {
|
|
70
69
|
const resetStateOnSeriesChange = useResetStateOnSeriesChange();
|
|
71
70
|
const batchUpdates = useURLStateBatch();
|
|
71
|
+
const isGpuProfileType = querySelection.expression.includes(':cuda:');
|
|
72
|
+
const {heightStyle} = useMetricsGraphDimensions(comparing, isGpuProfileType);
|
|
72
73
|
const handleTimeRangeChange = (range: DateTimeRange): void => {
|
|
73
74
|
const from = range.getFromMs();
|
|
74
75
|
const to = range.getToMs();
|
|
@@ -29,7 +29,6 @@ import {Query} from '@parca/parser';
|
|
|
29
29
|
import {TEST_IDS, testId} from '@parca/test-utils';
|
|
30
30
|
import {millisToProtoTimestamp, type NavigateFunction} from '@parca/utilities';
|
|
31
31
|
|
|
32
|
-
import {useMetricsGraphDimensions} from '../MetricsGraph/useMetricsGraphDimensions';
|
|
33
32
|
import {
|
|
34
33
|
ProfileFilter,
|
|
35
34
|
useProfileFilters,
|
|
@@ -118,7 +117,6 @@ const ProfileSelector = ({
|
|
|
118
117
|
suffix,
|
|
119
118
|
onSearchHook,
|
|
120
119
|
}: ProfileSelectorProps): JSX.Element => {
|
|
121
|
-
const {heightStyle} = useMetricsGraphDimensions(comparing, false);
|
|
122
120
|
const {viewComponent, additionalMetricsGraph} = useParcaContext();
|
|
123
121
|
const [queryBrowserMode, setQueryBrowserMode] = useURLState('query_browser_mode');
|
|
124
122
|
const batchUpdates = useURLStateBatch();
|
|
@@ -298,6 +296,13 @@ const ProfileSelector = ({
|
|
|
298
296
|
timeRange: timeRangeSelection,
|
|
299
297
|
onTimeRangeChange: handleTimeRangeChange,
|
|
300
298
|
commitTimeRange: () => setQueryExpression(true),
|
|
299
|
+
selectTimeRange: (range: DateTimeRange) => {
|
|
300
|
+
commitDraft({
|
|
301
|
+
from: range.getFromMs(),
|
|
302
|
+
to: range.getToMs(),
|
|
303
|
+
timeSelection: range.getRangeKey(),
|
|
304
|
+
});
|
|
305
|
+
},
|
|
301
306
|
})}
|
|
302
307
|
<LabelsQueryProvider
|
|
303
308
|
setMatchersString={setMatchersString}
|
|
@@ -356,7 +361,6 @@ const ProfileSelector = ({
|
|
|
356
361
|
<MetricsGraphSection
|
|
357
362
|
showMetricsGraph={showMetricsGraph}
|
|
358
363
|
setDisplayHideMetricsGraphButton={setDisplayHideMetricsGraphButton}
|
|
359
|
-
heightStyle={heightStyle}
|
|
360
364
|
querySelection={querySelection}
|
|
361
365
|
profileSelection={profileSelection}
|
|
362
366
|
comparing={comparing}
|