Attempt at hamburgermenu

p4/.expo/packager-info.json

@@ -2,8 +2,8 @@
   "devToolsPort": 19002,
   "expoServerPort": 19000,
   "packagerPort": 19001,
-  "packagerPid": 2212,
-  "expoServerNgrokUrl": "https://5v-9za.anonymous.p4.exp.direct",
-  "packagerNgrokUrl": "https://packager.5v-9za.anonymous.p4.exp.direct",
-  "ngrokPid": 1260
+  "packagerPid": 16820,
+  "expoServerNgrokUrl": "https://5v-9za.hhorge.p4.exp.direct",
+  "packagerNgrokUrl": "https://packager.5v-9za.hhorge.p4.exp.direct",
+  "ngrokPid": 14216
 }

p4/src/components/Body.js

@@ -8,7 +8,6 @@ import SideMenuComp from './SideMenu'
 //import Content from '../Content/Content.js';
 //import Wordcloud from '../Wordcloud/Wordcloud.js';
 
-//hello
 const Body = () => {
     return(
         <ScrollView>

p4/src/components/SideMenu.js

-import { SideMenu, List, ListItem } from 'react-native-elements';
+//import { SideMenu, List, ListItem } from 'react-native-elements';
 import { useSelector } from "react-redux";
 import Filtering from './Filtering'
 import React from 'react';
 import { View, Text } from 'react-native';
+import { toggleSideMenu } from "../actions";
+import Drawer from 'react-native-drawer'
+import { useDispatch } from "react-redux";
 
-const SideMenuComp = () => {
+
+const SideMenu = () => {
+    
+    const dispatch = useDispatch();
+    onHamburgerClick = () =>{
+    dispatch(toggleSideMenu())
+     
+ }
     const stateSideMenu = useSelector(state => state.sideMenu);
 
     return(
-        <SideMenu
-            isOpen={false}
-            menu={stateSideMenu}
-            >
+        <View styles={styles.container}>
+            <Drawer
+                open={stateSideMenu}
+                type="static"
+                tapToClose={true}
+                openDrawerOffset={0.5}
+                closedDrawerOffset={0}
+                content={<Filtering/>}
+                styles={styles.drawerStyle}
+                tweenHandler={Drawer.tweenPresets.parallax}
+                tweenEasing={"easeInQuad"}
+                tweenDuration={400}
+                onClose={onHamburgerClick}
+                />
+                
+        </View>
 
-        </SideMenu>
     )
 }
 
-export default SideMenuComp;
\ No newline at end of file
+export default SideMenu;
\ No newline at end of file

p4/src/components/Top.js

@@ -7,10 +7,14 @@ import { toggleSideMenu } from "../actions";
 const Top = () =>{
 
      const dispatch = useDispatch();
+     onHamburgerClick = () =>{
+     dispatch(toggleSideMenu())
+      
+  }
 
     return(
     <Header style={styles.container}
-      leftComponent={{ icon: 'menu', color: '#fff'}}
+      leftComponent={{ icon: 'menu', color: '#fff', onPress: () => onHamburgerClick()}}
       centerComponent={{ text: 'MY TITLE', style: { color: '#fff' } }}
       rightComponent={{ icon: 'home', color: '#fff' }}
     />