mirror of
https://github.com/streetwriters/notesnook.git
synced 2026-09-03 12:41:45 +02:00
refactor SideMenu
This commit is contained in:
@@ -1,5 +1,3 @@
|
||||
// @flow
|
||||
|
||||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import {
|
||||
@@ -9,7 +7,6 @@ import {
|
||||
View,
|
||||
} from 'react-native';
|
||||
import Animated, {Easing} from 'react-native-reanimated';
|
||||
|
||||
import styles from './styles';
|
||||
|
||||
const deviceScreen = Dimensions.get('window');
|
||||
@@ -19,6 +16,14 @@ function shouldOpenMenu(dx) {
|
||||
return dx > barrierForward;
|
||||
}
|
||||
|
||||
/**
|
||||
* @typedef {SideMenu.propTypes} propTypes
|
||||
*/
|
||||
|
||||
/**
|
||||
* @param {propTypes} props
|
||||
* @extends {React.Component<propTypes, {}>}}
|
||||
*/
|
||||
export default class SideMenu extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
@@ -60,12 +65,8 @@ export default class SideMenu extends React.Component {
|
||||
hiddenMenuOffset: deviceScreen.width * hiddenMenuOffsetPercentage,
|
||||
left,
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
onLayoutChange(e) {
|
||||
const {width, height} = e.nativeEvent.layout;
|
||||
const openMenuOffset = width * this.state.openOffsetMenuPercentage;
|
||||
@@ -85,8 +86,8 @@ export default class SideMenu extends React.Component {
|
||||
const style = [
|
||||
styles.frontView,
|
||||
{width, height},
|
||||
this.props.animationStyle(this.state.left),
|
||||
this.props.containerStyle
|
||||
this.props.animationStyle(this.state.left),
|
||||
this.props.containerStyle,
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -240,13 +241,6 @@ export default class SideMenu extends React.Component {
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
//eSubscribeEvent(eSendSideMenuOverlayRef, this._getOverlayViewRef);
|
||||
}
|
||||
componentWillUnmount() {
|
||||
//eUnSubscribeEvent(eSendSideMenuOverlayRef, this._getOverlayViewRef);
|
||||
}
|
||||
|
||||
_getOverlayViewRef = (data) => {
|
||||
//this.overlayViewRef = data.ref;
|
||||
};
|
||||
@@ -1,61 +0,0 @@
|
||||
import {createDrawerNavigator} from '@react-navigation/drawer';
|
||||
import {NavigationContainer} from '@react-navigation/native';
|
||||
import * as React from 'react';
|
||||
import {Menu} from '../components/Menu';
|
||||
import {DDS} from '../services/DeviceDetection';
|
||||
import {eSubscribeEvent, eUnSubscribeEvent} from '../services/EventManager';
|
||||
import {eCloseSideMenu, eOpenSideMenu} from '../utils/Events';
|
||||
import {sideMenuRef} from '../utils/Refs';
|
||||
import {NavigatorStack} from './NavigatorStack';
|
||||
|
||||
const Drawer = createDrawerNavigator();
|
||||
|
||||
export const NavigationStack = ({component = NavigatorStack}) => {
|
||||
const [locked, setLocked] = React.useState(false);
|
||||
|
||||
const setGestureDisabled = () => {
|
||||
setLocked(true);
|
||||
};
|
||||
|
||||
const setGestureEnabled = () => {
|
||||
setLocked(false);
|
||||
};
|
||||
|
||||
React.useEffect(() => {
|
||||
eSubscribeEvent(eOpenSideMenu, setGestureEnabled);
|
||||
eSubscribeEvent(eCloseSideMenu, setGestureDisabled);
|
||||
return () => {
|
||||
eUnSubscribeEvent(eOpenSideMenu, setGestureEnabled);
|
||||
eUnSubscribeEvent(eCloseSideMenu, setGestureDisabled);
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<NavigationContainer ref={sideMenuRef}>
|
||||
<Drawer.Navigator
|
||||
screenOptions={{
|
||||
swipeEnabled: locked ? false : true,
|
||||
|
||||
}}
|
||||
drawerStyle={{
|
||||
width: DDS.isLargeTablet()
|
||||
? DDS.width * 0.15
|
||||
: DDS.isSmallTab
|
||||
? '30%'
|
||||
: '65%',
|
||||
borderRightWidth: 0,
|
||||
}}
|
||||
|
||||
edgeWidth={200}
|
||||
drawerType={DDS.isTab || DDS.isSmallTab ? 'permanent' : 'slide'}
|
||||
drawerContent={DrawerComponent}
|
||||
initialRouteName="Main">
|
||||
<Drawer.Screen name="Main" component={component} />
|
||||
</Drawer.Navigator>
|
||||
</NavigationContainer>
|
||||
);
|
||||
};
|
||||
|
||||
const DrawerComponent = () => {
|
||||
return <Menu />;
|
||||
};
|
||||
Reference in New Issue
Block a user