mirror of
https://github.com/apache/superset.git
synced 2024-09-14 09:39:47 -04:00
fix: Select options overflowing Save chart modal on Explore view (#12522)
* Fix select options overflowing modal * fix unit test Co-authored-by: Ville Brofeldt <ville.v.brofeldt@gmail.com>
This commit is contained in:
parent
8f940aecca
commit
e1eeeebe53
@ -29,10 +29,9 @@ import Button from 'src/components/Button';
|
|||||||
import sinon from 'sinon';
|
import sinon from 'sinon';
|
||||||
import fetchMock from 'fetch-mock';
|
import fetchMock from 'fetch-mock';
|
||||||
|
|
||||||
import Modal from 'src/common/components/Modal';
|
|
||||||
import * as exploreUtils from 'src/explore/exploreUtils';
|
import * as exploreUtils from 'src/explore/exploreUtils';
|
||||||
import * as saveModalActions from 'src/explore/actions/saveModalActions';
|
import * as saveModalActions from 'src/explore/actions/saveModalActions';
|
||||||
import SaveModal from 'src/explore/components/SaveModal';
|
import SaveModal, { StyledModal } from 'src/explore/components/SaveModal';
|
||||||
|
|
||||||
describe('SaveModal', () => {
|
describe('SaveModal', () => {
|
||||||
const middlewares = [thunk];
|
const middlewares = [thunk];
|
||||||
@ -79,11 +78,11 @@ describe('SaveModal', () => {
|
|||||||
|
|
||||||
it('renders a Modal with the right set of components', () => {
|
it('renders a Modal with the right set of components', () => {
|
||||||
const wrapper = getWrapper();
|
const wrapper = getWrapper();
|
||||||
expect(wrapper.find(Modal)).toExist();
|
expect(wrapper.find(StyledModal)).toExist();
|
||||||
expect(wrapper.find(FormControl)).toExist();
|
expect(wrapper.find(FormControl)).toExist();
|
||||||
expect(wrapper.find(Radio)).toHaveLength(2);
|
expect(wrapper.find(Radio)).toHaveLength(2);
|
||||||
|
|
||||||
const footerWrapper = shallow(wrapper.find('Modal').props().footer);
|
const footerWrapper = shallow(wrapper.find(StyledModal).props().footer);
|
||||||
expect(footerWrapper.find(Button)).toHaveLength(3);
|
expect(footerWrapper.find(Button)).toHaveLength(3);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -19,7 +19,7 @@
|
|||||||
/* eslint camelcase: 0 */
|
/* eslint camelcase: 0 */
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Alert, FormControl, FormGroup, Radio } from 'react-bootstrap';
|
import { Alert, FormControl, FormGroup, Radio } from 'react-bootstrap';
|
||||||
import { JsonObject, t } from '@superset-ui/core';
|
import { JsonObject, t, styled } from '@superset-ui/core';
|
||||||
import ReactMarkdown from 'react-markdown';
|
import ReactMarkdown from 'react-markdown';
|
||||||
import Modal from 'src/common/components/Modal';
|
import Modal from 'src/common/components/Modal';
|
||||||
import Button from 'src/components/Button';
|
import Button from 'src/components/Button';
|
||||||
@ -55,6 +55,12 @@ type SaveModalState = {
|
|||||||
action: ActionType;
|
action: ActionType;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const StyledModal = styled(Modal)`
|
||||||
|
.ant-modal-body {
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
||||||
constructor(props: SaveModalProps) {
|
constructor(props: SaveModalProps) {
|
||||||
super(props);
|
super(props);
|
||||||
@ -153,7 +159,7 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Modal
|
<StyledModal
|
||||||
show
|
show
|
||||||
onHide={this.props.onHide}
|
onHide={this.props.onHide}
|
||||||
title={t('Save Chart')}
|
title={t('Save Chart')}
|
||||||
@ -261,7 +267,7 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
|||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</StyledModal>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user