Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use Grafana flamegraph component #2346

Merged
merged 12 commits into from
Sep 27, 2023
Merged

Use Grafana flamegraph component #2346

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
2108632
Add grafana flamegraph
aocenas Aug 31, 2023
f7dd9de
Comparison view
aocenas Sep 4, 2023
d7009f9
Diff view
aocenas Sep 5, 2023
e7ca203
Merge branch 'main' into aocenas/grafana-flamegraph
aocenas Sep 20, 2023
7a5e78f
Update lockfile
aocenas Sep 20, 2023
ca71b36
Put flamegraph code into single component
aocenas Sep 20, 2023
f306500
Update lockfile
aocenas Sep 20, 2023
e7d8063
Merge branch 'main' into aocenas/grafana-flamegraph
aocenas Sep 20, 2023
06dab24
Fixed unit detection
aocenas Sep 25, 2023
2344079
Update flamegraph lib
aocenas Sep 27, 2023
d6acdca
Merge branch 'main' into aocenas/grafana-flamegraph
aocenas Sep 27, 2023
7198b47
Lint fixes
aocenas Sep 27, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Lint fixes
  • Loading branch information
@aocenas
aocenas committed Sep 27, 2023
commit 7198b47922143fe2a260a1684fa6295afd5bea70
2 changes: 1 addition & 1 deletion public/app/legacy/flamegraph/FlameGraph/FlameGraphRenderer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ export type SharedQuery = {
syncEnabled: string | boolean;
toggleSync: Dispatch<SetStateAction<boolean | string>>;
id: string;
}
};

export interface FlamegraphRendererProps {
profile?: Profile;
Expand Down
2 changes: 1 addition & 1 deletion public/app/pages/ContinuousDiffView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import { formatTitle } from './formatTitle';
import { isLoadingOrReloading } from './loading';
import { Panel } from '@pyroscope/components/Panel';
import { PageContentWrapper } from '@pyroscope/pages/PageContentWrapper';
import {FlameGraphWrapper} from "@pyroscope/components/FlameGraphWrapper";
import { FlameGraphWrapper } from '@pyroscope/components/FlameGraphWrapper';

function ComparisonDiffApp() {
const dispatch = useAppDispatch();
Expand Down
2 changes: 1 addition & 1 deletion public/app/pages/ContinuousSingleView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import AddAnnotationMenuItem from './continuous/contextMenu/AddAnnotation.menuit
import { isLoadingOrReloading } from './loading';
import { Panel } from '@pyroscope/components/Panel';
import { PageContentWrapper } from '@pyroscope/pages/PageContentWrapper';
import {FlameGraphWrapper} from "@pyroscope/components/FlameGraphWrapper";
import { FlameGraphWrapper } from '@pyroscope/components/FlameGraphWrapper';

function ContinuousSingleView() {
const dispatch = useAppDispatch();
Expand Down
10 changes: 1 addition & 9 deletions public/app/pages/TagExplorerView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,9 @@ import TimelineChartWrapper, {
import Dropdown, { MenuItem } from '@pyroscope/ui/Dropdown';
import TagsSelector from '@pyroscope/pages/tagExplorer/components/TagsSelector';
import TableUI, { useTableSort, BodyRow } from '@pyroscope/ui/Table';
import useColorMode from '@pyroscope/hooks/colorMode.hook';
import useTimeZone from '@pyroscope/hooks/timeZone.hook';
import { appendLabelToQuery } from '@pyroscope/util/query';
import { useAppDispatch, useAppSelector } from '@pyroscope/redux/hooks';
import useExportToFlamegraphDotCom from '@pyroscope/components/exportToFlamegraphDotCom.hook';
import {
actions,
setDateRange,
Expand Down Expand Up @@ -48,7 +46,7 @@ import {
// eslint-disable-next-line
import styles from './TagExplorerView.module.scss';
import { formatTitle } from './formatTitle';
import {FlameGraphWrapper} from "@pyroscope/components/FlameGraphWrapper";
import { FlameGraphWrapper } from '@pyroscope/components/FlameGraphWrapper';

const TIMELINE_SERIES_COLORS = [
Color.rgb(242, 204, 12),
Expand Down Expand Up @@ -163,7 +161,6 @@ const getTimelineColor = (index: number, palette: Color[]): Color =>

function TagExplorerView() {
const { offset } = useTimeZone();
const { colorMode } = useColorMode();
const dispatch = useAppDispatch();

const { from, until, tagExplorerView, refreshToken } = useAppSelector(
Expand Down Expand Up @@ -265,11 +262,6 @@ function TagExplorerView() {
dispatch(actions.setTagExplorerViewGroupByTag(value));
};

const exportFlamegraphDotComFn = useExportToFlamegraphDotCom(
activeTagProfile,
groupByTag,
groupByTagValue
);
// when there's no groupByTag value backend returns groups with single "*" group,
// which is "application without any tag" group. when backend returns multiple groups,
// "*" group samples array is filled with zeros (not longer valid application data).
Expand Down
19 changes: 16 additions & 3 deletions public/app/util/flamebearer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,12 @@ function getNodes(level: number[], names: string[], diff: boolean) {
return nodes;
}

export function flamebearerToDataFrameDTO(levels: number[][], names: string[], unit: string, diff: boolean) {
export function flamebearerToDataFrameDTO(
levels: number[][],
names: string[],
unit: string,
diff: boolean
) {
const nodeLevels: any[][] = [];
for (let i = 0; i < levels.length; i++) {
nodeLevels[i] = [];
Expand Down Expand Up @@ -128,8 +133,16 @@ export function flamebearerToDataFrameDTO(levels: number[][], names: string[], u
if (diff) {
fields.push(
...[
{ name: 'selfRight', values: selfRightValues, config: { unit: valueUnit } },
{ name: 'valueRight', values: valueRightValues, config: { unit: valueUnit } },
{
name: 'selfRight',
values: selfRightValues,
config: { unit: valueUnit },
},
{
name: 'valueRight',
values: valueRightValues,
config: { unit: valueUnit },
},
]
);
}
Expand Down