mirror of https://github.com/apache/superset.git
[dashboard]Add timeout message on Dashboard view (#2910)
Same as explore view, if query takes > 45 seconds not returned, we will show Query timeout warning message. Otherwise user will see 504 Gateway timeout error.
This commit is contained in:
parent
65f25a1e5a
commit
c9e5fbb09b
|
@ -4,6 +4,7 @@ import Mustache from 'mustache';
|
||||||
import vizMap from '../../visualizations/main';
|
import vizMap from '../../visualizations/main';
|
||||||
import { getExploreUrl } from '../explore/exploreUtils';
|
import { getExploreUrl } from '../explore/exploreUtils';
|
||||||
import { applyDefaultFormData } from '../explore/stores/store';
|
import { applyDefaultFormData } from '../explore/stores/store';
|
||||||
|
import { QUERY_TIMEOUT_THRESHOLD } from '../constants';
|
||||||
|
|
||||||
const utils = require('./utils');
|
const utils = require('./utils');
|
||||||
|
|
||||||
|
@ -123,9 +124,6 @@ const px = function () {
|
||||||
controller.done(this);
|
controller.done(this);
|
||||||
},
|
},
|
||||||
getErrorMsg(xhr) {
|
getErrorMsg(xhr) {
|
||||||
if (xhr.statusText === 'timeout') {
|
|
||||||
return 'The request timed out';
|
|
||||||
}
|
|
||||||
let msg = '';
|
let msg = '';
|
||||||
if (!xhr.responseText) {
|
if (!xhr.responseText) {
|
||||||
const status = xhr.status;
|
const status = xhr.status;
|
||||||
|
@ -158,9 +156,14 @@ const px = function () {
|
||||||
errHtml += `<div class="alert alert-danger">${errorMsg}</div>`;
|
errHtml += `<div class="alert alert-danger">${errorMsg}</div>`;
|
||||||
}
|
}
|
||||||
if (xhr) {
|
if (xhr) {
|
||||||
const extendedMsg = this.getErrorMsg(xhr);
|
if (xhr.statusText === 'timeout') {
|
||||||
if (extendedMsg) {
|
errHtml += '<div class="alert alert-warning">' +
|
||||||
errHtml += `<div class="alert alert-danger">${extendedMsg}</div>`;
|
`Query timeout - visualization query are set to time out at ${QUERY_TIMEOUT_THRESHOLD / 1000} seconds.</div>`;
|
||||||
|
} else {
|
||||||
|
const extendedMsg = this.getErrorMsg(xhr);
|
||||||
|
if (extendedMsg) {
|
||||||
|
errHtml += `<div class="alert alert-danger">${extendedMsg}</div>`;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
container.html(errHtml);
|
container.html(errHtml);
|
||||||
|
@ -205,15 +208,20 @@ const px = function () {
|
||||||
token.find('img.loading').show();
|
token.find('img.loading').show();
|
||||||
container.fadeTo(0.5, 0.25);
|
container.fadeTo(0.5, 0.25);
|
||||||
container.css('height', this.height());
|
container.css('height', this.height());
|
||||||
$.getJSON(this.jsonEndpoint(), (queryResponse) => {
|
$.ajax({
|
||||||
try {
|
url: this.jsonEndpoint(),
|
||||||
vizMap[formData.viz_type](this, queryResponse);
|
timeout: QUERY_TIMEOUT_THRESHOLD,
|
||||||
this.done(queryResponse);
|
success: (queryResponse) => {
|
||||||
} catch (e) {
|
try {
|
||||||
this.error('An error occurred while rendering the visualization: ' + e);
|
vizMap[formData.viz_type](this, queryResponse);
|
||||||
}
|
this.done(queryResponse);
|
||||||
}).fail((err) => {
|
} catch (e) {
|
||||||
this.error(err.responseText, err);
|
this.error('An error occurred while rendering the visualization: ' + e);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: (err) => {
|
||||||
|
this.error(err.responseText, err);
|
||||||
|
},
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
resize() {
|
resize() {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
border: 1px superset black;
|
border: 1px superset black;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard .filter_box .slice_container > div {
|
.dashboard .filter_box .slice_container > div:not(.alert) {
|
||||||
padding-top: 0;
|
padding-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue