mirror of
https://github.com/apache/superset.git
synced 2024-09-16 02:29:39 -04:00
fix: dashbaord unable to refresh (#20220)
This commit is contained in:
parent
1530c34792
commit
3d5ae6226b
@ -481,6 +481,7 @@ export function exploreJSON(
|
|||||||
return Promise.all([
|
return Promise.all([
|
||||||
chartDataRequestCaught,
|
chartDataRequestCaught,
|
||||||
dispatch(triggerQuery(false, key)),
|
dispatch(triggerQuery(false, key)),
|
||||||
|
dispatch(updateQueryFormData(formData, key)),
|
||||||
...annotationLayers.map(annotation =>
|
...annotationLayers.map(annotation =>
|
||||||
dispatch(
|
dispatch(
|
||||||
runAnnotationQuery({
|
runAnnotationQuery({
|
||||||
|
@ -105,8 +105,8 @@ describe('chart actions', () => {
|
|||||||
const actionThunk = actions.postChartFormData({});
|
const actionThunk = actions.postChartFormData({});
|
||||||
|
|
||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, success
|
// chart update, trigger query, update form data, success
|
||||||
expect(dispatch.callCount).toBe(4);
|
expect(dispatch.callCount).toBe(5);
|
||||||
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
expect(dispatch.args[0][0].type).toBe(actions.CHART_UPDATE_STARTED);
|
expect(dispatch.args[0][0].type).toBe(actions.CHART_UPDATE_STARTED);
|
||||||
});
|
});
|
||||||
@ -116,32 +116,43 @@ describe('chart actions', () => {
|
|||||||
const actionThunk = actions.postChartFormData({});
|
const actionThunk = actions.postChartFormData({});
|
||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, update form data, success
|
// chart update, trigger query, update form data, success
|
||||||
expect(dispatch.callCount).toBe(4);
|
expect(dispatch.callCount).toBe(5);
|
||||||
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
expect(dispatch.args[1][0].type).toBe(actions.TRIGGER_QUERY);
|
expect(dispatch.args[1][0].type).toBe(actions.TRIGGER_QUERY);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should dispatch UPDATE_QUERY_FORM_DATA action with the query', () => {
|
||||||
|
const actionThunk = actions.postChartFormData({});
|
||||||
|
return actionThunk(dispatch).then(() => {
|
||||||
|
// chart update, trigger query, update form data, success
|
||||||
|
expect(dispatch.callCount).toBe(5);
|
||||||
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
|
expect(dispatch.args[2][0].type).toBe(actions.UPDATE_QUERY_FORM_DATA);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
it('should dispatch logEvent async action', () => {
|
it('should dispatch logEvent async action', () => {
|
||||||
const actionThunk = actions.postChartFormData({});
|
const actionThunk = actions.postChartFormData({});
|
||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, success
|
// chart update, trigger query, update form data, success
|
||||||
expect(dispatch.callCount).toBe(4);
|
|
||||||
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
|
||||||
|
|
||||||
dispatch.args[2][0](dispatch);
|
|
||||||
expect(dispatch.callCount).toBe(5);
|
expect(dispatch.callCount).toBe(5);
|
||||||
expect(dispatch.args[4][0].type).toBe(LOG_EVENT);
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
|
expect(typeof dispatch.args[3][0]).toBe('function');
|
||||||
|
|
||||||
|
dispatch.args[3][0](dispatch);
|
||||||
|
expect(dispatch.callCount).toBe(6);
|
||||||
|
expect(dispatch.args[5][0].type).toBe(LOG_EVENT);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should dispatch CHART_UPDATE_SUCCEEDED action upon success', () => {
|
it('should dispatch CHART_UPDATE_SUCCEEDED action upon success', () => {
|
||||||
const actionThunk = actions.postChartFormData({});
|
const actionThunk = actions.postChartFormData({});
|
||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, success
|
// chart update, trigger query, update form data, success
|
||||||
expect(dispatch.callCount).toBe(4);
|
expect(dispatch.callCount).toBe(5);
|
||||||
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
expect(dispatch.args[3][0].type).toBe(actions.CHART_UPDATE_SUCCEEDED);
|
expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_SUCCEEDED);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -157,8 +168,8 @@ describe('chart actions', () => {
|
|||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, update form data, fail
|
// chart update, trigger query, update form data, fail
|
||||||
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
expect(fetchMock.calls(MOCK_URL)).toHaveLength(1);
|
||||||
expect(dispatch.callCount).toBe(4);
|
expect(dispatch.callCount).toBe(5);
|
||||||
expect(dispatch.args[3][0].type).toBe(actions.CHART_UPDATE_FAILED);
|
expect(dispatch.args[4][0].type).toBe(actions.CHART_UPDATE_FAILED);
|
||||||
setupDefaultFetchMock();
|
setupDefaultFetchMock();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -174,9 +185,9 @@ describe('chart actions', () => {
|
|||||||
const actionThunk = actions.postChartFormData({}, false, timeoutInSec);
|
const actionThunk = actions.postChartFormData({}, false, timeoutInSec);
|
||||||
|
|
||||||
return actionThunk(dispatch).then(() => {
|
return actionThunk(dispatch).then(() => {
|
||||||
// chart update, trigger query, fail
|
// chart update, trigger query, update form data, fail
|
||||||
expect(dispatch.callCount).toBe(4);
|
expect(dispatch.callCount).toBe(5);
|
||||||
const updateFailedAction = dispatch.args[3][0];
|
const updateFailedAction = dispatch.args[4][0];
|
||||||
expect(updateFailedAction.type).toBe(actions.CHART_UPDATE_FAILED);
|
expect(updateFailedAction.type).toBe(actions.CHART_UPDATE_FAILED);
|
||||||
expect(updateFailedAction.queriesResponse[0].error).toBe('misc error');
|
expect(updateFailedAction.queriesResponse[0].error).toBe('misc error');
|
||||||
|
|
||||||
|
@ -48,7 +48,6 @@ describe('Dashboard', () => {
|
|||||||
removeSliceFromDashboard() {},
|
removeSliceFromDashboard() {},
|
||||||
triggerQuery() {},
|
triggerQuery() {},
|
||||||
logEvent() {},
|
logEvent() {},
|
||||||
updateQueryFormData() {},
|
|
||||||
},
|
},
|
||||||
initMessages: [],
|
initMessages: [],
|
||||||
dashboardState,
|
dashboardState,
|
||||||
|
@ -28,6 +28,7 @@ import {
|
|||||||
} from 'spec/helpers/testing-library';
|
} from 'spec/helpers/testing-library';
|
||||||
import { DatasourceType } from '@superset-ui/core';
|
import { DatasourceType } from '@superset-ui/core';
|
||||||
import { exploreActions } from 'src/explore/actions/exploreActions';
|
import { exploreActions } from 'src/explore/actions/exploreActions';
|
||||||
|
import { ChartStatus } from 'src/explore/types';
|
||||||
import { DataTablesPane } from '.';
|
import { DataTablesPane } from '.';
|
||||||
|
|
||||||
const createProps = () => ({
|
const createProps = () => ({
|
||||||
@ -57,7 +58,7 @@ const createProps = () => ({
|
|||||||
extra_form_data: {},
|
extra_form_data: {},
|
||||||
},
|
},
|
||||||
queryForce: false,
|
queryForce: false,
|
||||||
chartStatus: 'rendered',
|
chartStatus: 'rendered' as ChartStatus,
|
||||||
onCollapseChange: jest.fn(),
|
onCollapseChange: jest.fn(),
|
||||||
queriesResponse: [
|
queriesResponse: [
|
||||||
{
|
{
|
||||||
@ -150,7 +151,7 @@ describe('DataTablesPane', () => {
|
|||||||
<DataTablesPane
|
<DataTablesPane
|
||||||
{...{
|
{...{
|
||||||
...props,
|
...props,
|
||||||
chartStatus: 'success',
|
chartStatus: 'rendered',
|
||||||
queriesResponse: [
|
queriesResponse: [
|
||||||
{
|
{
|
||||||
colnames: ['__timestamp', 'genre'],
|
colnames: ['__timestamp', 'genre'],
|
||||||
@ -202,7 +203,7 @@ describe('DataTablesPane', () => {
|
|||||||
<DataTablesPane
|
<DataTablesPane
|
||||||
{...{
|
{...{
|
||||||
...props,
|
...props,
|
||||||
chartStatus: 'success',
|
chartStatus: 'rendered',
|
||||||
queriesResponse: [
|
queriesResponse: [
|
||||||
{
|
{
|
||||||
colnames: ['__timestamp', 'genre'],
|
colnames: ['__timestamp', 'genre'],
|
||||||
|
@ -85,6 +85,7 @@ export const DataTablesPane = ({
|
|||||||
datasource,
|
datasource,
|
||||||
queryForce,
|
queryForce,
|
||||||
onCollapseChange,
|
onCollapseChange,
|
||||||
|
chartStatus,
|
||||||
ownState,
|
ownState,
|
||||||
errorMessage,
|
errorMessage,
|
||||||
actions,
|
actions,
|
||||||
@ -92,7 +93,7 @@ export const DataTablesPane = ({
|
|||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const [activeTabKey, setActiveTabKey] = useState<string>(ResultTypes.Results);
|
const [activeTabKey, setActiveTabKey] = useState<string>(ResultTypes.Results);
|
||||||
const [isRequest, setIsRequest] = useState<Record<ResultTypes, boolean>>({
|
const [isRequest, setIsRequest] = useState<Record<ResultTypes, boolean>>({
|
||||||
results: getItem(LocalStorageKeys.is_datapanel_open, false),
|
results: false,
|
||||||
samples: false,
|
samples: false,
|
||||||
});
|
});
|
||||||
const [panelOpen, setPanelOpen] = useState(
|
const [panelOpen, setPanelOpen] = useState(
|
||||||
@ -111,7 +112,11 @@ export const DataTablesPane = ({
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (panelOpen && activeTabKey === ResultTypes.Results) {
|
if (
|
||||||
|
panelOpen &&
|
||||||
|
activeTabKey === ResultTypes.Results &&
|
||||||
|
chartStatus === 'rendered'
|
||||||
|
) {
|
||||||
setIsRequest({
|
setIsRequest({
|
||||||
results: true,
|
results: true,
|
||||||
samples: false,
|
samples: false,
|
||||||
@ -124,7 +129,7 @@ export const DataTablesPane = ({
|
|||||||
samples: true,
|
samples: true,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}, [panelOpen, activeTabKey]);
|
}, [panelOpen, activeTabKey, chartStatus]);
|
||||||
|
|
||||||
const handleCollapseChange = useCallback(
|
const handleCollapseChange = useCallback(
|
||||||
(isOpen: boolean) => {
|
(isOpen: boolean) => {
|
||||||
|
@ -50,7 +50,7 @@ export const ResultsPane = ({
|
|||||||
const [data, setData] = useState<Record<string, any>[][]>([]);
|
const [data, setData] = useState<Record<string, any>[][]>([]);
|
||||||
const [colnames, setColnames] = useState<string[]>([]);
|
const [colnames, setColnames] = useState<string[]>([]);
|
||||||
const [coltypes, setColtypes] = useState<GenericDataType[]>([]);
|
const [coltypes, setColtypes] = useState<GenericDataType[]>([]);
|
||||||
const [isLoading, setIsLoading] = useState<boolean>(false);
|
const [isLoading, setIsLoading] = useState<boolean>(true);
|
||||||
const [responseError, setResponseError] = useState<string>('');
|
const [responseError, setResponseError] = useState<string>('');
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@ -105,6 +105,12 @@ export const ResultsPane = ({
|
|||||||
}
|
}
|
||||||
}, [queryFormData, isRequest]);
|
}, [queryFormData, isRequest]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (errorMessage) {
|
||||||
|
setIsLoading(false);
|
||||||
|
}
|
||||||
|
}, [errorMessage]);
|
||||||
|
|
||||||
const originalFormattedTimeColumns = useOriginalFormattedTimeColumns(
|
const originalFormattedTimeColumns = useOriginalFormattedTimeColumns(
|
||||||
queryFormData.datasource,
|
queryFormData.datasource,
|
||||||
);
|
);
|
||||||
@ -119,15 +125,15 @@ export const ResultsPane = ({
|
|||||||
);
|
);
|
||||||
const filteredData = useFilteredTableData(filterText, data);
|
const filteredData = useFilteredTableData(filterText, data);
|
||||||
|
|
||||||
|
if (isLoading) {
|
||||||
|
return <Loading />;
|
||||||
|
}
|
||||||
|
|
||||||
if (errorMessage) {
|
if (errorMessage) {
|
||||||
const title = t('Run a query to display results');
|
const title = t('Run a query to display results');
|
||||||
return <EmptyStateMedium image="document.svg" title={title} />;
|
return <EmptyStateMedium image="document.svg" title={title} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isLoading) {
|
|
||||||
return <Loading />;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (responseError) {
|
if (responseError) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
@ -18,12 +18,14 @@
|
|||||||
*/
|
*/
|
||||||
import { Datasource, JsonObject, QueryFormData } from '@superset-ui/core';
|
import { Datasource, JsonObject, QueryFormData } from '@superset-ui/core';
|
||||||
import { ExploreActions } from 'src/explore/actions/exploreActions';
|
import { ExploreActions } from 'src/explore/actions/exploreActions';
|
||||||
|
import { ChartStatus } from 'src/explore/types';
|
||||||
|
|
||||||
export interface DataTablesPaneProps {
|
export interface DataTablesPaneProps {
|
||||||
queryFormData: QueryFormData;
|
queryFormData: QueryFormData;
|
||||||
datasource: Datasource;
|
datasource: Datasource;
|
||||||
queryForce: boolean;
|
queryForce: boolean;
|
||||||
ownState?: JsonObject;
|
ownState?: JsonObject;
|
||||||
|
chartStatus: ChartStatus;
|
||||||
onCollapseChange: (isOpen: boolean) => void;
|
onCollapseChange: (isOpen: boolean) => void;
|
||||||
errorMessage?: JSX.Element;
|
errorMessage?: JSX.Element;
|
||||||
actions: ExploreActions;
|
actions: ExploreActions;
|
||||||
|
@ -97,7 +97,6 @@ const createProps = () => ({
|
|||||||
fetchFaveStar: jest.fn(),
|
fetchFaveStar: jest.fn(),
|
||||||
saveFaveStar: jest.fn(),
|
saveFaveStar: jest.fn(),
|
||||||
redirectSQLLab: jest.fn(),
|
redirectSQLLab: jest.fn(),
|
||||||
updateQueryFormData: jest.fn(),
|
|
||||||
},
|
},
|
||||||
user: {
|
user: {
|
||||||
userId: 1,
|
userId: 1,
|
||||||
|
@ -392,6 +392,7 @@ const ExploreChartPanel = ({
|
|||||||
datasource={datasource}
|
datasource={datasource}
|
||||||
queryForce={force}
|
queryForce={force}
|
||||||
onCollapseChange={onCollapseChange}
|
onCollapseChange={onCollapseChange}
|
||||||
|
chartStatus={chart.chartStatus}
|
||||||
errorMessage={errorMessage}
|
errorMessage={errorMessage}
|
||||||
actions={actions}
|
actions={actions}
|
||||||
/>
|
/>
|
||||||
|
@ -267,7 +267,6 @@ function ExploreViewContainer(props) {
|
|||||||
const onQuery = useCallback(() => {
|
const onQuery = useCallback(() => {
|
||||||
props.actions.setForceQuery(false);
|
props.actions.setForceQuery(false);
|
||||||
props.actions.triggerQuery(true, props.chart.id);
|
props.actions.triggerQuery(true, props.chart.id);
|
||||||
props.actions.updateQueryFormData(props.form_data, props.chart.id);
|
|
||||||
addHistory();
|
addHistory();
|
||||||
setLastQueriedControls(props.controls);
|
setLastQueriedControls(props.controls);
|
||||||
}, [props.controls, addHistory, props.actions, props.chart.id]);
|
}, [props.controls, addHistory, props.actions, props.chart.id]);
|
||||||
|
Loading…
Reference in New Issue
Block a user