diff --git a/p4/src/components/SideMenu.js b/p4/src/components/SideMenu.js
index 080902f9f01b2ae7463b7ba639f0115f217f6936..1c64a2cc9cdfe96db439d10ffc639d69a8e9b690 100644
--- a/p4/src/components/SideMenu.js
+++ b/p4/src/components/SideMenu.js
@@ -1,20 +1,41 @@
-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}
-            >
-            
-        </SideMenu>
+        <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>
+
     )
 }
 
-export default SideMenuComp;
\ No newline at end of file
+export default SideMenu;
\ No newline at end of file
diff --git a/p4/src/components/Top.js b/p4/src/components/Top.js
index da3c43d3867874e8047414cd577d000399cc8d4e..6b6b1b8266352f3565a1eefb053acffa6d9d3325 100644
--- a/p4/src/components/Top.js
+++ b/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' }}
     />