Prevent doodle from closing on outside click (#2047)
Adds a new property to the dispatch, which when set to true, replaces the onClose handler with a no-op, preventing the modal from closing. Signed-off-by: Plastikmensch <plastikmensch@users.noreply.github.com> Signed-off-by: Plastikmensch <plastikmensch@users.noreply.github.com>main
parent
de67b567ad
commit
910d2d9f6b
|
@ -46,7 +46,7 @@ const mapDispatchToProps = (dispatch) => ({
|
||||||
},
|
},
|
||||||
|
|
||||||
onDoodleOpen() {
|
onDoodleOpen() {
|
||||||
dispatch(openModal('DOODLE', { noEsc: true }));
|
dispatch(openModal('DOODLE', { noEsc: true, noClose: true }));
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -116,13 +116,16 @@ export default class ModalRoot extends React.PureComponent {
|
||||||
this._modal = c;
|
this._modal = c;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// prevent closing of modal when clicking the overlay
|
||||||
|
noop = () => {}
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const { type, props, ignoreFocus } = this.props;
|
const { type, props, ignoreFocus } = this.props;
|
||||||
const { backgroundColor } = this.state;
|
const { backgroundColor } = this.state;
|
||||||
const visible = !!type;
|
const visible = !!type;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Base backgroundColor={backgroundColor} onClose={this.handleClose} noEsc={props ? props.noEsc : false} ignoreFocus={ignoreFocus}>
|
<Base backgroundColor={backgroundColor} onClose={props && props.noClose ? this.noop : this.handleClose} noEsc={props ? props.noEsc : false} ignoreFocus={ignoreFocus}>
|
||||||
{visible && (
|
{visible && (
|
||||||
<>
|
<>
|
||||||
<BundleContainer fetchComponent={MODAL_COMPONENTS[type]} loading={this.renderLoading(type)} error={this.renderError} renderDelay={200}>
|
<BundleContainer fetchComponent={MODAL_COMPONENTS[type]} loading={this.renderLoading(type)} error={this.renderError} renderDelay={200}>
|
||||||
|
|
Loading…
Reference in New Issue