Prevented side menu to be swipeable while a modal window is displayed

This commit is contained in:
Alejandro Celaya 2019-03-03 12:05:29 +01:00
parent 220d634f80
commit 127bcc14eb
2 changed files with 11 additions and 3 deletions

View file

@ -4,7 +4,7 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org). The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org).
## [Unpublished] ## 2.0.1 - 2019-03-03
#### Added #### Added
@ -27,6 +27,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
* [#104](https://github.com/shlinkio/shlink-web-client/issues/104) Fixed blank page being showed when not-found paths are loaded. * [#104](https://github.com/shlinkio/shlink-web-client/issues/104) Fixed blank page being showed when not-found paths are loaded.
* [#94](https://github.com/shlinkio/shlink-web-client/issues/94) Fixed initial zoom and center on maps. * [#94](https://github.com/shlinkio/shlink-web-client/issues/94) Fixed initial zoom and center on maps.
* [#93](https://github.com/shlinkio/shlink-web-client/issues/93) Prevented side menu to be swipeable while a modal window is displayed.
## 2.0.0 - 2019-01-13 ## 2.0.0 - 2019-01-13

View file

@ -44,6 +44,13 @@ const MenuLayout = (TagsList, ShortUrls, AsideMenu, CreateShortUrl, ShortUrlVisi
const burgerClasses = classnames('menu-layout__burger-icon', { const burgerClasses = classnames('menu-layout__burger-icon', {
'menu-layout__burger-icon--active': this.state.showSideBar, 'menu-layout__burger-icon--active': this.state.showSideBar,
}); });
const swipeMenuIfNoModalExists = (showSideBar) => () => {
if (document.querySelector('.modal')) {
return;
}
this.setState({ showSideBar });
};
return ( return (
<React.Fragment> <React.Fragment>
@ -56,8 +63,8 @@ const MenuLayout = (TagsList, ShortUrls, AsideMenu, CreateShortUrl, ShortUrlVisi
<Swipeable <Swipeable
delta={40} delta={40}
className="menu-layout__swipeable" className="menu-layout__swipeable"
onSwipedLeft={() => this.setState({ showSideBar: false })} onSwipedLeft={swipeMenuIfNoModalExists(false)}
onSwipedRight={() => this.setState({ showSideBar: true })} onSwipedRight={swipeMenuIfNoModalExists(true)}
> >
<div className="row menu-layout__swipeable-inner"> <div className="row menu-layout__swipeable-inner">
<AsideMenu <AsideMenu