mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Traces: Add traces panel suggestion (#83089)
* Add traces panel suggestion * Render suggestion * Update styling * Update styling
This commit is contained in:
parent
9bbb7f67e0
commit
2258e6bd16
@ -3339,10 +3339,6 @@ exports[`better eslint`] = {
|
||||
"public/app/features/explore/TraceView/components/TracePageHeader/Actions/ActionButton.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"]
|
||||
],
|
||||
"public/app/features/explore/TraceView/components/TracePageHeader/Actions/TracePageActions.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "1"]
|
||||
],
|
||||
"public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/NextPrevResult.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "1"],
|
||||
@ -3402,11 +3398,7 @@ exports[`better eslint`] = {
|
||||
[0, 0, 0, "Styles should be written using objects.", "5"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "6"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "7"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "8"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "9"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "10"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "11"],
|
||||
[0, 0, 0, "Styles should be written using objects.", "12"]
|
||||
[0, 0, 0, "Styles should be written using objects.", "8"]
|
||||
],
|
||||
"public/app/features/explore/TraceView/components/TraceTimelineViewer/SpanBarRow.tsx:5381": [
|
||||
[0, 0, 0, "Styles should be written using objects.", "0"],
|
||||
|
@ -3838,12 +3838,6 @@
|
||||
"count": 1
|
||||
}
|
||||
],
|
||||
"/public/app/features/explore/TraceView/components/TracePageHeader/Actions/TracePageActions.tsx": [
|
||||
{
|
||||
"message": "Styles should be written using objects.",
|
||||
"count": 2
|
||||
}
|
||||
],
|
||||
"/public/app/features/explore/TraceView/components/TracePageHeader/SearchBar/NextPrevResult.tsx": [
|
||||
{
|
||||
"message": "Styles should be written using objects.",
|
||||
@ -3895,7 +3889,7 @@
|
||||
"/public/app/features/explore/TraceView/components/TracePageHeader/TracePageHeader.tsx": [
|
||||
{
|
||||
"message": "Styles should be written using objects.",
|
||||
"count": 13
|
||||
"count": 9
|
||||
}
|
||||
],
|
||||
"/public/app/features/explore/TraceView/components/TraceTimelineViewer/SpanBarRow.tsx": [
|
||||
|
@ -12,21 +12,22 @@ import ActionButton from './ActionButton';
|
||||
|
||||
export const getStyles = (theme: GrafanaTheme2) => {
|
||||
return {
|
||||
TracePageActions: css`
|
||||
label: TracePageActions;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
`,
|
||||
feedback: css`
|
||||
margin: 6px;
|
||||
color: ${theme.colors.text.secondary};
|
||||
font-size: ${theme.typography.bodySmall.fontSize};
|
||||
&:hover {
|
||||
color: ${theme.colors.text.link};
|
||||
}
|
||||
`,
|
||||
TracePageActions: css({
|
||||
label: 'TracePageActions',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
gap: '4px',
|
||||
marginBottom: '10px',
|
||||
}),
|
||||
feedback: css({
|
||||
margin: '6px 6px 6px 0',
|
||||
color: theme.colors.text.secondary,
|
||||
fontSize: theme.typography.bodySmall.fontSize,
|
||||
'&:hover': {
|
||||
color: theme.colors.text.link,
|
||||
},
|
||||
}),
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -202,30 +202,34 @@ const getNewStyles = (theme: GrafanaTheme2) => {
|
||||
color: unset;
|
||||
}
|
||||
`,
|
||||
header: css`
|
||||
label: TracePageHeader;
|
||||
background-color: ${theme.colors.background.primary};
|
||||
padding: 0.5em 0 0 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 5;
|
||||
`,
|
||||
titleRow: css`
|
||||
align-items: flex-start;
|
||||
display: flex;
|
||||
padding: 0 8px;
|
||||
`,
|
||||
title: css`
|
||||
color: inherit;
|
||||
flex: 1;
|
||||
font-size: 1.7em;
|
||||
line-height: 1em;
|
||||
`,
|
||||
subtitle: css`
|
||||
flex: 1;
|
||||
line-height: 1em;
|
||||
margin: -0.5em 0.5em 0.75em 0.5em;
|
||||
`,
|
||||
header: css({
|
||||
label: 'TracePageHeader',
|
||||
backgroundColor: theme.colors.background.primary,
|
||||
padding: '0.5em 0 0 0',
|
||||
position: 'sticky',
|
||||
top: 0,
|
||||
zIndex: 5,
|
||||
textAlign: 'left',
|
||||
}),
|
||||
titleRow: css({
|
||||
alignItems: 'flex-start',
|
||||
display: 'flex',
|
||||
padding: '0 8px',
|
||||
flexWrap: 'wrap',
|
||||
}),
|
||||
title: css({
|
||||
color: 'inherit',
|
||||
flex: 1,
|
||||
fontSize: '1.7em',
|
||||
lineHeight: '1em',
|
||||
marginBottom: 0,
|
||||
minWidth: '200px',
|
||||
}),
|
||||
subtitle: css({
|
||||
flex: 1,
|
||||
lineHeight: '1em',
|
||||
margin: '-0.5em 0.5em 0.75em 0.5em',
|
||||
}),
|
||||
tag: css`
|
||||
margin: 0 0.5em 0 0;
|
||||
`,
|
||||
|
@ -21,6 +21,7 @@ export const panelsToCheckFirst = [
|
||||
'logs',
|
||||
'candlestick',
|
||||
'flamegraph',
|
||||
'traces',
|
||||
];
|
||||
|
||||
export async function getAllSuggestions(data?: PanelData, panel?: PanelModel): Promise<VisualizationSuggestion[]> {
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { PanelPlugin } from '@grafana/data';
|
||||
|
||||
import { TracesPanel } from './TracesPanel';
|
||||
import { TracesSuggestionsSupplier } from './suggestions';
|
||||
|
||||
export const plugin = new PanelPlugin(TracesPanel);
|
||||
export const plugin = new PanelPlugin(TracesPanel).setSuggestionsSupplier(new TracesSuggestionsSupplier());
|
||||
|
29
public/app/plugins/panel/traces/suggestions.ts
Normal file
29
public/app/plugins/panel/traces/suggestions.ts
Normal file
@ -0,0 +1,29 @@
|
||||
import { VisualizationSuggestionsBuilder, VisualizationSuggestionScore } from '@grafana/data';
|
||||
import { SuggestionName } from 'app/types/suggestions';
|
||||
|
||||
export class TracesSuggestionsSupplier {
|
||||
getListWithDefaults(builder: VisualizationSuggestionsBuilder) {
|
||||
return builder.getListAppender<{}, {}>({
|
||||
name: SuggestionName.Trace,
|
||||
pluginId: 'traces',
|
||||
});
|
||||
}
|
||||
|
||||
getSuggestionsForData(builder: VisualizationSuggestionsBuilder) {
|
||||
if (!builder.data) {
|
||||
return;
|
||||
}
|
||||
|
||||
const dataFrame = builder.data.series[0];
|
||||
if (!dataFrame) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (builder.data.series[0].meta?.preferredVisualisationType === 'trace') {
|
||||
this.getListWithDefaults(builder).append({
|
||||
name: SuggestionName.Trace,
|
||||
score: VisualizationSuggestionScore.Best,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
@ -28,4 +28,5 @@ export enum SuggestionName {
|
||||
DashboardList = 'Dashboard list',
|
||||
Logs = 'Logs',
|
||||
FlameGraph = 'Flame graph',
|
||||
Trace = 'Trace',
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user