75 lines
2.2 KiB
TypeScript
75 lines
2.2 KiB
TypeScript
import { SceneComponentProps, SceneObjectBase, SceneObjectState, SceneQueryRunner, VizPanel } from '@grafana/scenes';
|
|
|
|
import { PanelMenu } from '../../Menu/PanelMenu';
|
|
import { getMetricDescription } from '../../helpers/MetricDatasourceHelper';
|
|
import { MDP_METRIC_OVERVIEW, trailDS } from '../../shared';
|
|
import { getMetricSceneFor, getTrailFor } from '../../utils';
|
|
import { AutoQueryDef } from '../types';
|
|
|
|
import { AutoVizPanelQuerySelector } from './AutoVizPanelQuerySelector';
|
|
|
|
export interface AutoVizPanelState extends SceneObjectState {
|
|
panel?: VizPanel;
|
|
metric?: string;
|
|
}
|
|
|
|
export class AutoVizPanel extends SceneObjectBase<AutoVizPanelState> {
|
|
constructor(state: AutoVizPanelState) {
|
|
super(state);
|
|
|
|
this.addActivationHandler(this.onActivate.bind(this));
|
|
}
|
|
|
|
public onActivate() {
|
|
if (!this.state.panel) {
|
|
const { autoQuery, metric } = getMetricSceneFor(this).state;
|
|
|
|
this.getVizPanelFor(autoQuery.main, metric).then((panel) =>
|
|
this.setState({
|
|
panel,
|
|
metric,
|
|
})
|
|
);
|
|
}
|
|
}
|
|
|
|
public onChangeQuery = (variant: string) => {
|
|
const metricScene = getMetricSceneFor(this);
|
|
|
|
const def = metricScene.state.autoQuery.variants.find((q) => q.variant === variant)!;
|
|
|
|
this.getVizPanelFor(def).then((panel) => this.setState({ panel }));
|
|
metricScene.setState({ queryDef: def });
|
|
};
|
|
|
|
private async getVizPanelFor(def: AutoQueryDef, metric?: string) {
|
|
const trail = getTrailFor(this);
|
|
const metadata = await trail.getMetricMetadata(metric);
|
|
const description = getMetricDescription(metadata);
|
|
|
|
return def
|
|
.vizBuilder()
|
|
.setData(
|
|
new SceneQueryRunner({
|
|
datasource: trailDS,
|
|
maxDataPoints: MDP_METRIC_OVERVIEW,
|
|
queries: def.queries,
|
|
})
|
|
)
|
|
.setDescription(description)
|
|
.setHeaderActions([new AutoVizPanelQuerySelector({ queryDef: def, onChangeQuery: this.onChangeQuery })])
|
|
.setShowMenuAlways(true)
|
|
.setMenu(new PanelMenu({ labelName: metric ?? this.state.metric }))
|
|
.build();
|
|
}
|
|
|
|
public static Component = ({ model }: SceneComponentProps<AutoVizPanel>) => {
|
|
const { panel } = model.useState();
|
|
|
|
if (!panel) {
|
|
return;
|
|
}
|
|
return <panel.Component model={panel} />;
|
|
};
|
|
}
|