IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Flamegraph: Move to package (#73113)

Browse Source
This commit is contained in:
Andrej Ocenas
2023-09-12 12:28:48 +02:00
committed by GitHub
parent 02f617a20d
commit e4f26a5e4b
50 changed files with 46192 additions and 344 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
public/app/features/explore/FlameGraph/FlameGraphExploreContainer.tsx
View File

@@ -2,19 +2,36 @@ import { css } from '@emotion/css';
import React from 'react';
import { DataFrame, GrafanaTheme2, CoreApp } from '@grafana/data';
import { FlameGraph } from '@grafana/flamegraph';
import { reportInteraction, config } from '@grafana/runtime';
import { useStyles2 } from '@grafana/ui';
import FlameGraphContainer from 'app/plugins/panel/flamegraph/components/FlameGraphContainer';
interface Props {
dataFrames: DataFrame[];
}
function interaction(name: string, context: Record<string, string | number> = {}) {
reportInteraction(`grafana_flamegraph_${name}`, {
app: CoreApp.Unknown,
grafana_version: config.buildInfo.version,
...context,
});
}
export const FlameGraphExploreContainer = (props: Props) => {
const styles = useStyles2((theme) => getStyles(theme));
return (
<div className={styles.container}>
<FlameGraphContainer data={props.dataFrames[0]} app={CoreApp.Explore} />
<FlameGraph
data={props.dataFrames[0]}
stickyHeader={true}
getTheme={() => config.theme2}
onTableSymbolClick={() => interaction('table_item_selected')}
onViewSelected={(view: string) => interaction('view_selected', { view })}
onTextAlignSelected={(align: string) => interaction('text_align_selected', { align })}
onTableSort={(sort: string) => interaction('table_sort_selected', { sort })}
/>
</div>
);
};

26
public/app/plugins/panel/flamegraph/FlameGraphPanel.tsx
View File

@@ -1,10 +1,19 @@
import React from 'react';
import { CoreApp, PanelProps } from '@grafana/data';
import { PanelDataErrorView } from '@grafana/runtime';
import { FlameGraph } from '@grafana/flamegraph';
import { PanelDataErrorView, reportInteraction, config } from '@grafana/runtime';
import { checkFields, getMessageCheckFieldsResult } from './components/FlameGraph/dataTransform';
import FlameGraphContainer from './components/FlameGraphContainer';
// import FlameGraphContainer from './components/FlameGraphContainer';
function interaction(name: string, context: Record<string, string | number> = {}) {
reportInteraction(`grafana_flamegraph_${name}`, {
app: CoreApp.Unknown,
grafana_version: config.buildInfo.version,
...context,
});
}
export const FlameGraphPanel = (props: PanelProps) => {
const wrongFields = checkFields(props.data.series[0]);
@@ -13,5 +22,16 @@ export const FlameGraphPanel = (props: PanelProps) => {
<PanelDataErrorView panelId={props.id} data={props.data} message={getMessageCheckFieldsResult(wrongFields)} />
);
}
return <FlameGraphContainer data={props.data.series[0]} app={CoreApp.Unknown} />;
return (
<FlameGraph
data={props.data.series[0]}
stickyHeader={false}
getTheme={() => config.theme2}
onTableSymbolClick={() => interaction('table_item_selected')}
onViewSelected={(view: string) => interaction('view_selected', { view })}
onTextAlignSelected={(align: string) => interaction('text_align_selected', { align })}
onTableSort={(sort: string) => interaction('table_sort_selected', { sort })}
/>
);
};

2
public/app/plugins/panel/flamegraph/components/TopTable/FlameGraphTopTableContainer.tsx
View File

@@ -244,7 +244,7 @@ type ActionCellProps = {
function ActionCell(props: ActionCellProps) {
const styles = useStyles2(getStyles);
const symbol = props.frame.fields.find((f: Field) => f.name === 'Symbol')?.values.get(props.rowIndex);
const symbol = props.frame.fields.find((f: Field) => f.name === 'Symbol')?.values[props.rowIndex];
const isSearched = props.search === symbol;
const isSandwiched = props.sandwichItem === symbol;