mirror of https://github.com/apache/superset.git
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 fetchMock from 'fetch-mock';
|
||||
|
||||
import Modal from 'src/common/components/Modal';
|
||||
import * as exploreUtils from 'src/explore/exploreUtils';
|
||||
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', () => {
|
||||
const middlewares = [thunk];
|
||||
|
@ -79,11 +78,11 @@ describe('SaveModal', () => {
|
|||
|
||||
it('renders a Modal with the right set of components', () => {
|
||||
const wrapper = getWrapper();
|
||||
expect(wrapper.find(Modal)).toExist();
|
||||
expect(wrapper.find(StyledModal)).toExist();
|
||||
expect(wrapper.find(FormControl)).toExist();
|
||||
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);
|
||||
});
|
||||
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
/* eslint camelcase: 0 */
|
||||
import React from 'react';
|
||||
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 Modal from 'src/common/components/Modal';
|
||||
import Button from 'src/components/Button';
|
||||
|
@ -55,6 +55,12 @@ type SaveModalState = {
|
|||
action: ActionType;
|
||||
};
|
||||
|
||||
export const StyledModal = styled(Modal)`
|
||||
.ant-modal-body {
|
||||
overflow: visible;
|
||||
}
|
||||
`;
|
||||
|
||||
class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
||||
constructor(props: SaveModalProps) {
|
||||
super(props);
|
||||
|
@ -153,7 +159,7 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
|||
|
||||
render() {
|
||||
return (
|
||||
<Modal
|
||||
<StyledModal
|
||||
show
|
||||
onHide={this.props.onHide}
|
||||
title={t('Save Chart')}
|
||||
|
@ -261,7 +267,7 @@ class SaveModal extends React.Component<SaveModalProps, SaveModalState> {
|
|||
/>
|
||||
</FormGroup>
|
||||
</div>
|
||||
</Modal>
|
||||
</StyledModal>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue