Singlestat: Various fixes to singlestat and DataFrame (#18783)

* Singlestat: Various fixes to singlestat and DataFrame

* removed comment
This commit is contained in:
Torkel Ödegaard 2019-08-29 19:04:33 +02:00 committed by GitHub
parent e6e8611d52
commit d9a3601094
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 54 additions and 33 deletions

View File

@ -26,7 +26,7 @@ $popper-margin-from-ref: 5px;
background: $tooltipBackground;
border-radius: $border-radius-sm;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
padding: 6px 10px;
padding: $space-sm;
color: $tooltipColor;
font-weight: $font-weight-semi-bold;

View File

@ -24,8 +24,6 @@ export interface PanelData {
export interface PanelProps<T = any> {
id: number; // ID within the current dashboard
data: PanelData;
// TODO: annotation?: PanelData;
timeRange: TimeRange;
timeZone: TimeZone;
options: T;

View File

@ -76,11 +76,15 @@ export class QueriesTab extends PureComponent<Props, State> {
// Updates the response with information from the stream
panelDataObserver = {
next: (data: PanelData) => {
const { panel } = this.props;
if (data.state === LoadingState.Error) {
panel.events.emit('data-error', data.error);
} else if (data.state === LoadingState.Done) {
panel.events.emit('data-received', data.legacy);
try {
const { panel } = this.props;
if (data.state === LoadingState.Error) {
panel.events.emit('data-error', data.error);
} else if (data.state === LoadingState.Done) {
panel.events.emit('data-received', data.legacy);
}
} catch (err) {
console.log('Panel.events handler error', err);
}
this.setState({ data });
},

View File

@ -6,7 +6,7 @@ import { PanelCtrl } from 'app/features/panel/panel_ctrl';
import { getExploreUrl } from 'app/core/utils/explore';
import { applyPanelTimeOverrides, getResolution } from 'app/features/dashboard/utils/panel';
import { ContextSrv } from 'app/core/services/context_srv';
import { toLegacyResponseData, isDataFrame, TimeRange, LoadingState, DataFrame } from '@grafana/data';
import { toLegacyResponseData, isDataFrame, TimeRange, LoadingState, DataFrame, toDataFrameDTO } from '@grafana/data';
import { LegacyResponseData, DataSourceApi, PanelData, DataQueryResponse } from '@grafana/ui';
import { Unsubscribable } from 'rxjs';
@ -154,9 +154,7 @@ class MetricsPanelCtrl extends PanelCtrl {
// Make the results look like they came directly from a <6.2 datasource request
// NOTE: any object other than 'data' is no longer supported supported
this.handleQueryResult({
data: data.legacy,
});
this.handleQueryResult({ data: data.legacy });
} else {
this.handleDataFrames(data.series);
}
@ -218,10 +216,17 @@ class MetricsPanelCtrl extends PanelCtrl {
}
handleDataFrames(data: DataFrame[]) {
this.loading = false;
if (this.dashboard && this.dashboard.snapshot) {
this.panel.snapshotData = data;
this.panel.snapshotData = data.map(frame => toDataFrameDTO(frame));
}
try {
this.events.emit('data-frames-received', data);
} catch (err) {
this.processDataError(err);
}
// Subclasses that asked for DataFrame will override
}
handleQueryResult(result: DataQueryResponse) {
@ -236,7 +241,11 @@ class MetricsPanelCtrl extends PanelCtrl {
result = { data: [] };
}
this.events.emit('data-received', result.data);
try {
this.events.emit('data-received', result.data);
} catch (err) {
this.processDataError(err);
}
}
getAdditionalMenuItems() {

View File

@ -249,23 +249,25 @@ export class PanelCtrl {
}
getInfoContent(options: { mode: string }) {
let markdown = this.panel.description || '';
const { panel } = this;
let markdown = panel.description || '';
if (options.mode === 'tooltip') {
markdown = this.error || this.panel.description || '';
markdown = this.error || panel.description || '';
}
const templateSrv: TemplateSrv = this.$injector.get('templateSrv');
const interpolatedMarkdown = templateSrv.replace(markdown, this.panel.scopedVars);
const interpolatedMarkdown = templateSrv.replace(markdown, panel.scopedVars);
let html = '<div class="markdown-html panel-info-content">';
const md = renderMarkdown(interpolatedMarkdown);
html += config.disableSanitizeHtml ? md : sanitize(md);
const links = this.panel.links && getPanelLinksSupplier(this.panel).getLinks();
if (links && links.length > 0) {
if (panel.links && panel.links.length > 0) {
const interpolatedLinks = getPanelLinksSupplier(panel).getLinks();
html += '<ul class="panel-info-corner-links">';
for (const link of links) {
for (const link of interpolatedLinks) {
html +=
'<li><a class="panel-menu-link" href="' +
escapeHtml(link.href) +

View File

@ -149,6 +149,7 @@ class GraphCtrl extends MetricsPanelCtrl {
this.events.on('render', this.onRender.bind(this));
this.events.on('data-received', this.onDataReceived.bind(this));
this.events.on('data-frames-received', this.onDataReceived.bind(this));
this.events.on('data-error', this.onDataError.bind(this));
this.events.on('data-snapshot-load', this.onDataSnapshotLoad.bind(this));
this.events.on('init-edit-mode', this.onInitEditMode.bind(this));
@ -210,13 +211,11 @@ class GraphCtrl extends MetricsPanelCtrl {
// This should only be called from the snapshot callback
onDataReceived(dataList: LegacyResponseData[]) {
this.handleDataFrames(getProcessedDataFrames(dataList));
this.onDataFramesReceived(getProcessedDataFrames(dataList));
}
// Directly support DataFrame skipping event callbacks
handleDataFrames(data: DataFrame[]) {
super.handleDataFrames(data);
onDataFramesReceived(data: DataFrame[]) {
this.dataList = data;
this.seriesList = this.processor.getSeriesList({
dataList: this.dataList,

View File

@ -119,7 +119,7 @@ class SingleStatCtrl extends MetricsPanelCtrl {
super($scope, $injector);
_.defaults(this.panel, this.panelDefaults);
this.events.on('data-received', this.onDataReceived.bind(this));
this.events.on('data-frames-received', this.onFramesReceived.bind(this));
this.events.on('data-error', this.onDataError.bind(this));
this.events.on('data-snapshot-load', this.onDataReceived.bind(this));
this.events.on('init-edit-mode', this.onInitEditMode.bind(this));
@ -157,14 +157,23 @@ class SingleStatCtrl extends MetricsPanelCtrl {
// This should only be called from the snapshot callback
onDataReceived(dataList: LegacyResponseData[]) {
this.handleDataFrames(getProcessedDataFrames(dataList));
this.onFramesReceived(getProcessedDataFrames(dataList));
}
// Directly support DataFrame skipping event callbacks
handleDataFrames(frames: DataFrame[]) {
onFramesReceived(frames: DataFrame[]) {
const { panel } = this;
super.handleDataFrames(frames);
this.loading = false;
if (frames && frames.length > 1) {
this.data = {
value: 0,
display: {
text: 'Only queries that return single series/table is supported',
numeric: NaN,
},
};
this.render();
return;
}
const distinct = getDistinctNames(frames);
let fieldInfo = distinct.byName[panel.tableColumn]; //

View File

@ -5,7 +5,7 @@ $useDropShadow: false;
$attachmentOffset: 0%;
$easing: cubic-bezier(0, 0, 0.265, 1);
@include drop-theme('error', $popover-error-bg, $popover-color);
@include drop-theme('error', $popover-error-bg, $white);
@include drop-theme('popover', $popover-bg, $popover-color, $popover-border-color);
@include drop-theme('help', $popover-help-bg, $popover-help-color);

View File

@ -6,7 +6,7 @@
.drop-content {
border-radius: $border-radius-lg;
position: relative;
font-family: inherit;
font-weight: $font-weight-semi-bold;
background: $theme-bg;
color: $theme-color;
padding: $space-sm;