diff --git a/frontend/src/metabase/components/CollectionLanding.jsx b/frontend/src/metabase/components/CollectionLanding.jsx index b9c789e77a59b32bcb22703ceff01fe28ca067bd..a12581ded9c5b74e941fb0022bce14715545dbc2 100644 --- a/frontend/src/metabase/components/CollectionLanding.jsx +++ b/frontend/src/metabase/components/CollectionLanding.jsx @@ -153,7 +153,7 @@ class DefaultLanding extends React.Component { await Promise.all( this.state.selectedItems.map(item => item.setCollection(collection)), ); - this.setState({ selectedItems: null, selectedAction: null }); + this.handleCloseModal(); } finally { this.handleBulkActionSuccess(); } @@ -166,6 +166,10 @@ class DefaultLanding extends React.Component { this.props.onSelectNone(); }; + handleCloseModal = () => { + this.setState({ selectedItems: null, selectedAction: null }); + }; + render() { const { ancestors, @@ -499,14 +503,12 @@ class DefaultLanding extends React.Component { </Box> {!_.isEmpty(selectedItems) && selectedAction == "copy" && ( - <Modal> + <Modal onClose={this.handleCloseModal}> <CollectionCopyEntityModal entityObject={selectedItems[0]} - onClose={() => - this.setState({ selectedItems: null, selectedAction: null }) - } + onClose={this.handleCloseModal} onSaved={newEntityObject => { - this.setState({ selectedItems: null, selectedAction: null }); + this.handleCloseModal(); this.handleBulkActionSuccess(); }} /> @@ -514,16 +516,14 @@ class DefaultLanding extends React.Component { )} {!_.isEmpty(selectedItems) && selectedAction == "move" && ( - <Modal> + <Modal onClose={this.handleCloseModal}> <CollectionMoveModal title={ selectedItems.length > 1 ? t`Move ${selectedItems.length} items?` : t`Move "${selectedItems[0].getName()}"?` } - onClose={() => - this.setState({ selectedItems: null, selectedAction: null }) - } + onClose={this.handleCloseModal} onMove={this.handleBulkMove} /> </Modal> diff --git a/frontend/src/metabase/containers/CollectionMoveModal.jsx b/frontend/src/metabase/containers/CollectionMoveModal.jsx index 8792b8b6bbada1f33815c94efaad6c84a3592939..e2b6cc855781a4cbfae4a48bf7888834b39ce6ba 100644 --- a/frontend/src/metabase/containers/CollectionMoveModal.jsx +++ b/frontend/src/metabase/containers/CollectionMoveModal.jsx @@ -3,10 +3,9 @@ import PropTypes from "prop-types"; import { t } from "c-3po"; -import { Flex, Box } from "grid-styled"; -import Subhead from "metabase/components/Subhead"; +import { Flex } from "grid-styled"; import Button from "metabase/components/Button"; -import Icon from "metabase/components/Icon"; +import ModalContent from "metabase/components/ModalContent"; import CollectionPicker from "metabase/containers/CollectionPicker"; @@ -41,15 +40,7 @@ class CollectionMoveModal extends React.Component { const { selectedCollectionId } = this.state; return ( - <Box p={3}> - <Flex align="center" mb={2}> - <Subhead>{this.props.title}</Subhead> - <Icon - name="close" - className="ml-auto" - onClick={() => this.props.onClose()} - /> - </Flex> + <ModalContent title={this.props.title} onClose={this.props.onClose}> <CollectionPicker value={selectedCollectionId} onChange={selectedCollectionId => @@ -78,7 +69,7 @@ class CollectionMoveModal extends React.Component { {t`Move`} </Button> </Flex> - </Box> + </ModalContent> ); } }