iop
/
superset
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: dashboard edit/save errors (#10834) 

* use conditional operator for lookup

* editing dashboard title should update after save

* uncomment test

* fix json metadata save

* json metadata color scheme should overwrite state

* test's functionality is no longer applicable

* add lastModifiedTime to DashboardInfo
This commit is contained in:
Elizabeth Thompson 2020-10-22 14:33:22 -07:00 committed by GitHub
parent 30c71fd794
commit 43b92b220f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 650 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

193
superset-frontend/cypress-base/cypress/integration/dashboard/edit_properties.test.ts Normal file
View File

@ -0,0 +1,193 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
// eslint-disable-next-line import/no-extraneous-dependencies
import * as ace from 'brace';
import * as shortid from 'shortid';
import { WORLD_HEALTH_DASHBOARD } from './dashboard.helper';
function selectColorScheme(color: string) {
// open color scheme dropdown
cy.get('.modal-body')
.contains('Color Scheme')
.parents('.ControlHeader')
.next('.Select')
.click()
.then($colorSelect => {
// select a new color scheme
cy.wrap($colorSelect).find(`[data-test="${color}"]`).click();
});
}
function assertMetadata(text: string) {
const regex = new RegExp(text);
cy.get('.modal-body')
.find('#json_metadata')
.should('be.visible')
.then(() => {
const metadata = cy.$$('#json_metadata')[0];
// cypress can read this locally, but not in ci
// so we have to use the ace module directly to fetch the value
expect(ace.edit(metadata).getValue()).to.match(regex);
});
}
function typeMetadata(text: string) {
cy.get('.modal-body').find('#json_metadata').should('be.visible').type(text);
}
function openAdvancedProperties() {
return cy
.get('.modal-body')
.contains('Advanced')
.should('be.visible')
.click();
}
function openDashboardEditProperties() {
// open dashboard properties edit modal
cy.get('#save-dash-split-button').trigger('click', { force: true });
cy.get('.dropdown-menu').contains('Edit dashboard properties').click();
}
describe('Dashboard edit action', () => {
beforeEach(() => {
cy.server();
cy.login();
cy.visit(WORLD_HEALTH_DASHBOARD);
cy.route(`/api/v1/dashboard/1`).as('dashboardGet');
cy.get('.dashboard-grid', { timeout: 50000 })
.should('be.visible') // wait for 50 secs to load dashboard
.then(() => {
cy.get('.dashboard-header [data-test=edit-alt]')
.should('be.visible')
.click();
openDashboardEditProperties();
});
});
it('should update the title', () => {
const dashboardTitle = `Test dashboard [${shortid.generate()}]`;
// update title
cy.get('.modal-body')
.should('be.visible')
.contains('Title')
.siblings('input')
.type(`{selectall}{backspace}${dashboardTitle}`);
// save edit changes
cy.get('.modal-footer')
.contains('Save')
.click()
.then(() => {
// assert that modal edit window has closed
cy.get('.modal-body').should('not.exist');
// assert title has been updated
cy.get('.editable-title input').should('have.value', dashboardTitle);
});
});
describe('the color picker is changed', () => {
describe('the metadata has a color scheme', () => {
describe('the advanced tab is open', () => {
// TODO test passes locally but not on ci
xit('should overwrite the color scheme', () => {
openAdvancedProperties();
cy.wait('@dashboardGet').then(() => {
selectColorScheme('d3Category20b');
assertMetadata('d3Category20b');
});
});
});
describe('the advanced tab is not open', () => {
// TODO test passes locally but not on ci
xit('should overwrite the color scheme', () => {
selectColorScheme('bnbColors');
openAdvancedProperties();
cy.wait('@dashboardGet').then(() => {
assertMetadata('bnbColors');
});
});
});
});
});
describe('a valid colorScheme is entered', () => {
// TODO test passes locally but not on ci
xit('should save json metadata color change to dropdown', () => {
// edit json metadata
openAdvancedProperties().then(() => {
typeMetadata(
'{selectall}{backspace}{{}"color_scheme":"d3Category20"{}}',
);
});
// save edit changes
cy.get('.modal-footer')
.contains('Save')
.click()
.then(() => {
// assert that modal edit window has closed
cy.get('.modal-body').should('not.exist');
// assert color has been updated
openDashboardEditProperties();
openAdvancedProperties().then(() => {
assertMetadata('d3Category20');
});
cy.get('.color-scheme-container').should(
'have.attr',
'data-test',
'd3Category20',
);
});
});
});
describe('an invalid colorScheme is entered', () => {
// TODO test passes locally but not on ci
xit('should throw an error', () => {
// edit json metadata
openAdvancedProperties().then(() => {
typeMetadata(
'{selectall}{backspace}{{}"color_scheme":"THIS_DOES_NOT_WORK"{}}',
);
});
// save edit changes
cy.get('.modal-footer')
.contains('Save')
.click()
.then(() => {
// assert that modal edit window has closed
cy.get('.modal-body')
.contains('A valid color scheme is required')
.should('be.visible');
});
cy.on('uncaught:exception', err => {
expect(err.message).to.include('something about the error');
// return false to prevent the error from
// failing this test
return false;
});
});
});
});

102
superset-frontend/cypress-base/cypress/integration/dashboard/save.test.js
View File

@ -16,45 +16,46 @@
* specific language governing permissions and limitations
* under the License.
*/
import readResponseBlob from '../../utils/readResponseBlob';
import shortid from 'shortid';
import { WORLD_HEALTH_DASHBOARD } from './dashboard.helper';
describe('Dashboard save action', () => {
let dashboardId;
function openDashboardEditProperties() {
cy.get('.dashboard-header [data-test=edit-alt]').click();
cy.get('#save-dash-split-button').trigger('click', { force: true });
cy.get('.dropdown-menu').contains('Edit dashboard properties').click();
}
describe('Dashboard save action', () => {
beforeEach(() => {
cy.server();
cy.login();
cy.visit(WORLD_HEALTH_DASHBOARD);
cy.get('#app').then(data => {
const bootstrapData = JSON.parse(data[0].dataset.bootstrap);
const dashboard = bootstrapData.dashboard_data;
dashboardId = dashboard.id;
cy.route('POST', `/superset/copy_dash/${dashboardId}/`).as('copyRequest');
});
cy.get('[data-test="more-horiz"]').trigger('click', { force: true });
cy.get('[data-test="save-as-menu-item"]').trigger('click', { force: true });
cy.get('[data-test="modal-save-dashboard-button"]').trigger('click', {
force: true,
});
});
it('should save as new dashboard', () => {
cy.wait('@copyRequest').then(xhr => {
expect(xhr.status).to.eq(200);
readResponseBlob(xhr.response.body).then(json => {
expect(json.id).to.be.gt(dashboardId);
cy.get('#app').then(data => {
const bootstrapData = JSON.parse(data[0].dataset.bootstrap);
const dashboard = bootstrapData.dashboard_data;
const dashboardId = dashboard.id;
cy.route('POST', `/superset/copy_dash/${dashboardId}/`).as('copyRequest');
cy.get('[data-test="more-horiz"]').trigger('click', { force: true });
cy.get('[data-test="save-as-menu-item"]').trigger('click', {
force: true,
});
cy.get('[data-test="modal-save-dashboard-button"]').trigger('click', {
force: true,
});
});
});
it('should save/overwrite dashboard', () => {
// should have box_plot chart
cy.get('[data-test="grid-row-background--transparent"]').within(() => {
cy.get('.box_plot', { timeout: 10000 }).should('be.visible');
});
// should load chart
cy.get('.dashboard-grid', { timeout: 50000 }); // wait for 50 secs
// remove box_plot chart from dashboard
cy.get('[data-test="edit-alt"]').click({ timeout: 5000 });
@ -80,4 +81,63 @@ describe('Dashboard save action', () => {
.find('.box_plot', { timeout: 20000 })
.should('not.be.visible');
});
it('should save after edit', () => {
cy.get('.dashboard-grid', { timeout: 50000 }) // wait for 50 secs to load dashboard
.then(() => {
const dashboardTitle = `Test dashboard [${shortid.generate()}]`;
openDashboardEditProperties();
// open color scheme dropdown
cy.get('.modal-body')
.contains('Color Scheme')
.parents('.ControlHeader')
.next('.Select')
.click()
.then($colorSelect => {
// select a new color scheme
cy.wrap($colorSelect)
.find('.Select__option')
.first()
.next()
.click();
});
// remove json metadata
cy.get('.modal-body')
.contains('Advanced')
.click()
.then(() => {
cy.get('#json_metadata').type('{selectall}{backspace}');
});
// update title
cy.get('.modal-body')
.contains('Title')
.siblings('input')
.type(`{selectall}{backspace}${dashboardTitle}`);
// save edit changes
cy.get('.modal-footer')
.contains('Save')
.click()
.then(() => {
// assert that modal edit window has closed
cy.get('.modal-body').should('not.exist');
// save dashboard changes
cy.get('.dashboard-header').contains('Save').click();
// assert success flash
cy.contains('saved successfully').should('be.visible');
// assert title has been updated
cy.get('.editable-title input').should(
'have.value',
dashboardTitle,
);
});
});
});
});

1
superset-frontend/cypress-base/tsconfig.json
View File

@ -1,5 +1,6 @@
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"strict": true,
"target": "ES5",
"lib": ["ES5", "ES2015", "DOM"],

279
superset-frontend/spec/javascripts/dashboard/components/PropertiesModal_spec.jsx Normal file
View File

@ -0,0 +1,279 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import React from 'react';
import { mount } from 'enzyme';
import { Provider } from 'react-redux';
import {
supersetTheme,
SupersetClient,
ThemeProvider,
} from '@superset-ui/core';
import PropertiesModal from 'src/dashboard/components/PropertiesModal';
import { mockStore } from '../fixtures/mockStore';
const dashboardResult = {
json: {
result: {
dashboard_title: 'New Title',
slug: '/new',
json_metadata: '{"something":"foo"}',
owners: [],
},
},
};
describe('PropertiesModal', () => {
afterEach(() => {
jest.restoreAllMocks();
jest.resetAllMocks();
});
const requiredProps = {
dashboardId: 1,
show: true,
addSuccessToast: () => {},
};
function setup(overrideProps) {
return mount(
<Provider store={mockStore}>
<PropertiesModal {...requiredProps} {...overrideProps} />
</Provider>,
{
wrappingComponent: ThemeProvider,
wrappingComponentProps: { theme: supersetTheme },
},
);
}
describe('onColorSchemeChange', () => {
it('sets up a default state', () => {
const wrapper = setup({ colorScheme: 'SUPERSET_DEFAULT' });
expect(
wrapper.find('PropertiesModal').instance().state.values.colorScheme,
).toEqual('SUPERSET_DEFAULT');
});
describe('with a valid color scheme as an arg', () => {
describe('without metadata', () => {
const wrapper = setup({ colorScheme: 'SUPERSET_DEFAULT' });
const modalInstance = wrapper.find('PropertiesModal').instance();
it('does not update the color scheme in the metadata', () => {
const spy = jest.spyOn(modalInstance, 'onMetadataChange');
modalInstance.onColorSchemeChange('SUPERSET_DEFAULT');
expect(spy).not.toHaveBeenCalled();
});
});
describe('with metadata', () => {
describe('with color_scheme in the metadata', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
modalInstance.setState({
values: {
json_metadata: '{"color_scheme":"foo"}',
},
});
it('will update the metadata', () => {
const spy = jest.spyOn(modalInstance, 'onMetadataChange');
modalInstance.onColorSchemeChange('SUPERSET_DEFAULT');
expect(spy).toHaveBeenCalledWith(
'{"color_scheme":"SUPERSET_DEFAULT"}',
);
});
});
describe('without color_scheme in the metadata', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
modalInstance.setState({
values: {
json_metadata: '{"timed_refresh_immune_slices": []}',
},
});
it('will not update the metadata', () => {
const spy = jest.spyOn(modalInstance, 'onMetadataChange');
modalInstance.onColorSchemeChange('SUPERSET_DEFAULT');
expect(spy).not.toHaveBeenCalled();
});
});
});
});
describe('with an invalid color scheme as an arg', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
it('will raise an error', () => {
const spy = jest.spyOn(modalInstance.dialog, 'show');
expect(() =>
modalInstance.onColorSchemeChange('THIS_WILL_NOT_WORK'),
).toThrowError('A valid color scheme is required');
expect(spy).toHaveBeenCalled();
});
});
});
describe('onOwnersChange', () => {
it('should update the state with the value passed', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
const spy = jest.spyOn(modalInstance, 'updateFormState');
modalInstance.onOwnersChange('foo');
expect(spy).toHaveBeenCalledWith('owners', 'foo');
});
});
describe('onMetadataChange', () => {
it('should update the state with the value passed', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
const spy = jest.spyOn(modalInstance, 'updateFormState');
modalInstance.onMetadataChange('foo');
expect(spy).toHaveBeenCalledWith('json_metadata', 'foo');
});
});
describe('onChange', () => {
it('should update the state with the value passed', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
const spy = jest.spyOn(modalInstance, 'updateFormState');
modalInstance.onChange({ target: { name: 'test', value: 'foo' } });
expect(spy).toHaveBeenCalledWith('test', 'foo');
});
});
describe('fetchDashboardDetails', () => {
it('should make an api call', () => {
const spy = jest.spyOn(SupersetClient, 'get');
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
modalInstance.fetchDashboardDetails();
expect(spy).toHaveBeenCalledWith({
endpoint: '/api/v1/dashboard/1',
});
});
it('should update state', async () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
const fetchSpy = jest
.spyOn(SupersetClient, 'get')
.mockResolvedValue(dashboardResult);
modalInstance.fetchDashboardDetails();
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toBeUndefined();
expect(modalInstance.state.values.dashboard_title).toEqual('New Title');
expect(modalInstance.state.values.slug).toEqual('/new');
expect(modalInstance.state.values.json_metadata).toEqual(
'{"something":"foo"}',
);
});
it('should call onOwnersChange', async () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
const fetchSpy = jest.spyOn(SupersetClient, 'get').mockResolvedValue({
json: {
result: {
dashboard_title: 'New Title',
slug: '/new',
json_metadata: '{"something":"foo"}',
owners: [{ id: 1, first_name: 'Al', last_name: 'Pacino' }],
},
},
});
const onOwnersSpy = jest.spyOn(modalInstance, 'onOwnersChange');
modalInstance.fetchDashboardDetails();
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toBeUndefined();
expect(onOwnersSpy).toHaveBeenCalledWith([
{ value: 1, label: 'Al Pacino' },
]);
});
describe('when colorScheme is undefined as a prop', () => {
describe('when color_scheme is defined in json_metadata', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
it('should use the color_scheme from json_metadata in the api response', async () => {
const fetchSpy = jest.spyOn(SupersetClient, 'get').mockResolvedValue({
json: {
result: {
dashboard_title: 'New Title',
slug: '/new',
json_metadata: '{"color_scheme":"SUPERSET_DEFAULT"}',
owners: [],
},
},
});
modalInstance.fetchDashboardDetails();
// this below triggers the callback of the api call
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toEqual(
'SUPERSET_DEFAULT',
);
});
describe('when color_scheme is not defined in json_metadata', () => {
const wrapper = setup();
const modalInstance = wrapper.find('PropertiesModal').instance();
it('should be undefined', async () => {
const fetchSpy = jest
.spyOn(SupersetClient, 'get')
.mockResolvedValue(dashboardResult);
modalInstance.fetchDashboardDetails();
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toBeUndefined();
});
});
});
});
describe('when colorScheme is defined as a prop', () => {
describe('when color_scheme is defined in json_metadata', () => {
const wrapper = setup({ colorScheme: 'SUPERSET_DEFAULT' });
const modalInstance = wrapper.find('PropertiesModal').instance();
it('should use the color_scheme from json_metadata in the api response', async () => {
const fetchSpy = jest.spyOn(SupersetClient, 'get').mockResolvedValue({
json: {
result: {
dashboard_title: 'New Title',
slug: '/new',
json_metadata: '{"color_scheme":"SUPERSET_DEFAULT"}',
owners: [],
},
},
});
modalInstance.fetchDashboardDetails();
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toEqual(
'SUPERSET_DEFAULT',
);
});
});
describe('when color_scheme is not defined in json_metadata', () => {
const wrapper = setup({ colorScheme: 'SUPERSET_DEFAULT' });
const modalInstance = wrapper.find('PropertiesModal').instance();
it('should use the colorScheme from the prop', async () => {
const fetchSpy = jest
.spyOn(SupersetClient, 'get')
.mockResolvedValue(dashboardResult);
modalInstance.fetchDashboardDetails();
await fetchSpy();
expect(modalInstance.state.values.colorScheme).toBeUndefined();
});
});
});
});
});

2
superset-frontend/src/components/EditableTitle.tsx
View File

@ -56,7 +56,7 @@ export default function EditableTitle({
const contentRef = useRef<any | HTMLInputElement | HTMLTextAreaElement>();
useEffect(() => {
if (currentTitle !== lastTitle) {
if (title !== currentTitle) {
setLastTitle(currentTitle);
setCurrentTitle(title);
}

13
superset-frontend/src/dashboard/components/Header.jsx
View File

@ -277,11 +277,20 @@ class Header extends React.PureComponent {
colorScheme,
colorNamespace,
);
const labelColors = colorScheme ? scale.getColorMap() : {};
// use the colorScheme for default labels
let labelColors = colorScheme ? scale.getColorMap() : {};
// but allow metadata to overwrite if it exists
// eslint-disable-next-line camelcase
const metadataLabelColors = dashboardInfo.metadata?.label_colors;
if (metadataLabelColors) {
labelColors = { ...labelColors, ...metadataLabelColors };
}
// check refresh frequency is for current session or persist
const refreshFrequency = shouldPersistRefreshFrequency
? currentRefreshFrequency
: dashboardInfo.metadata.refresh_frequency; // eslint-disable camelcase
: dashboardInfo.metadata?.refresh_frequency; // eslint-disable-line camelcase
const data = {
positions,

95
superset-frontend/src/dashboard/components/PropertiesModal.jsx
View File

@ -23,7 +23,12 @@ import Button from 'src/components/Button';
import Dialog from 'react-bootstrap-dialog';
import { AsyncSelect } from 'src/components/Select';
import rison from 'rison';
import { styled, t, SupersetClient } from '@superset-ui/core';
import {
styled,
t,
SupersetClient,
getCategoricalSchemeRegistry,
} from '@superset-ui/core';
import FormLabel from 'src/components/FormLabel';
import { JsonEditor } from 'src/components/AsyncAceEditor';
@ -42,7 +47,7 @@ const propTypes = {
dashboardId: PropTypes.number.isRequired,
show: PropTypes.bool,
onHide: PropTypes.func,
colorScheme: PropTypes.object,
colorScheme: PropTypes.string,
setColorSchemeAndUnsavedChanges: PropTypes.func,
onSubmit: PropTypes.func,
addSuccessToast: PropTypes.func.isRequired,
@ -88,7 +93,34 @@ class PropertiesModal extends React.PureComponent {
JsonEditor.preload();
}
onColorSchemeChange(value) {
onColorSchemeChange(value, { updateMetadata = true } = {}) {
// check that color_scheme is valid
const colorChoices = getCategoricalSchemeRegistry().keys();
const { json_metadata: jsonMetadata } = this.state.values;
const jsonMetadataObj = jsonMetadata?.length
? JSON.parse(jsonMetadata)
: {};
if (!colorChoices.includes(value)) {
this.dialog.show({
title: 'Error',
bsSize: 'medium',
bsStyle: 'danger',
actions: [Dialog.DefaultAction('Ok', () => {}, 'btn-danger')],
body: t('A valid color scheme is required'),
});
throw new Error('A valid color scheme is required');
}
// update metadata to match selection
if (
updateMetadata &&
Object.keys(jsonMetadataObj).includes('color_scheme')
) {
jsonMetadataObj.color_scheme = value;
this.onMetadataChange(JSON.stringify(jsonMetadataObj));
}
this.updateFormState('colorScheme', value);
}
@ -114,6 +146,10 @@ class PropertiesModal extends React.PureComponent {
endpoint: `/api/v1/dashboard/${this.props.dashboardId}`,
}).then(response => {
const dashboard = response.json.result;
const jsonMetadataObj = dashboard.json_metadata?.length
? JSON.parse(dashboard.json_metadata)
: {};
this.setState(state => ({
isDashboardLoaded: true,
values: {
@ -121,6 +157,7 @@ class PropertiesModal extends React.PureComponent {
dashboard_title: dashboard.dashboard_title || '',
slug: dashboard.slug || '',
json_metadata: dashboard.json_metadata || '',
colorScheme: jsonMetadataObj.color_scheme,
},
}));
const initialSelectedOwners = dashboard.owners.map(owner => ({
@ -178,17 +215,37 @@ class PropertiesModal extends React.PureComponent {
submit(e) {
e.preventDefault();
e.stopPropagation();
const { values } = this.state;
const {
values: {
json_metadata: jsonMetadata,
slug,
dashboard_title: dashboardTitle,
colorScheme,
owners: ownersValue,
},
} = this.state;
const { onlyApply } = this.props;
const owners = values.owners.map(o => o.value);
const owners = ownersValue.map(o => o.value);
let metadataColorScheme;
// update color scheme to match metadata
if (jsonMetadata?.length) {
const { color_scheme: metadataColorScheme } = JSON.parse(jsonMetadata);
if (metadataColorScheme) {
this.onColorSchemeChange(metadataColorScheme, {
updateMetadata: false,
});
}
}
if (onlyApply) {
this.props.onSubmit({
id: this.props.dashboardId,
title: values.dashboard_title,
slug: values.slug,
jsonMetadata: values.json_metadata,
title: dashboardTitle,
slug,
jsonMetadata,
ownerIds: owners,
colorScheme: values.colorScheme,
colorScheme: metadataColorScheme || colorScheme,
});
this.props.onHide();
} else {
@ -196,20 +253,20 @@ class PropertiesModal extends React.PureComponent {
endpoint: `/api/v1/dashboard/${this.props.dashboardId}`,
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
dashboard_title: values.dashboard_title,
slug: values.slug || null,
json_metadata: values.json_metadata || null,
dashboard_title: dashboardTitle,
slug: slug || null,
json_metadata: jsonMetadata || null,
owners,
}),
}).then(({ json }) => {
}).then(({ json: { result } }) => {
this.props.addSuccessToast(t('The dashboard has been saved'));
this.props.onSubmit({
id: this.props.dashboardId,
title: json.result.dashboard_title,
slug: json.result.slug,
jsonMetadata: json.result.json_metadata,
ownerIds: json.result.owners,
colorScheme: values.colorScheme,
title: result.dashboard_title,
slug: result.slug,
jsonMetadata: result.json_metadata,
ownerIds: result.owners,
colorScheme: metadataColorScheme || colorScheme,
});
this.props.onHide();
}, this.handleErrorResponse);
@ -221,6 +278,7 @@ class PropertiesModal extends React.PureComponent {
const { onHide, onlyApply } = this.props;
const saveLabel = onlyApply ? t('Apply') : t('Save');
return (
<Modal show={this.props.show} onHide={this.props.onHide} bsSize="lg">
<form onSubmit={this.submit}>
@ -321,6 +379,7 @@ class PropertiesModal extends React.PureComponent {
tabSize={2}
width="100%"
height="200px"
wrapEnabled
/>
<p className="help-block">
{t(

5
superset-frontend/src/dashboard/containers/DashboardHeader.jsx
View File

@ -83,7 +83,10 @@ function mapStateToProps({
isLoading: isDashboardLoading(charts),
hasUnsavedChanges: !!dashboardState.hasUnsavedChanges,
maxUndoHistoryExceeded: !!dashboardState.maxUndoHistoryExceeded,
lastModifiedTime: dashboardState.lastModifiedTime,
lastModifiedTime: Math.max(
dashboardState.lastModifiedTime,
dashboardInfo.lastModifiedTime,
),
editMode: !!dashboardState.editMode,
slug: dashboardInfo.slug,
metadata: dashboardInfo.metadata,

1
superset-frontend/src/dashboard/reducers/dashboardInfo.js
View File

@ -25,6 +25,7 @@ export default function dashboardStateReducer(state = {}, action) {
return {
...state,
...action.newInfo,
lastModifiedTime: new Date().getTime() / 1000,
};
default:
return state;

1
superset-frontend/src/dashboard/reducers/getInitialState.js
View File

@ -276,6 +276,7 @@ export default function getInitialState(bootstrapData) {
flash_messages: common.flash_messages,
conf: common.conf,
},
lastModifiedTime: dashboard.last_modified_time,
},
dashboardFilters,
dashboardState: {

2
superset-frontend/src/explore/components/controls/ColorSchemeControl.jsx
View File

@ -76,7 +76,7 @@ export default class ColorSchemeControl extends React.PureComponent {
label={`${currentScheme.id}-tooltip`}
tooltip={currentScheme.label}
>
<ul className="color-scheme-container">
<ul className="color-scheme-container" data-test={currentScheme.id}>
{colors.map((color, i) => (
<li
key={`${currentScheme.id}-${i}`}