From e8b66d8fcea497be8b1820cde8ec187383b70c60 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Wed, 12 Aug 2020 03:27:24 +0300
Subject: feat: create basic drawer

---
 src/components/Header/Header.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

(limited to 'src/components/Header/Header.tsx')

diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 461a1f2..224f6b0 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { useHistory } from 'react-router-dom';
 import {
   IconButton,
@@ -9,7 +9,7 @@ import {
   AccountCircle,
   Notifications,
   Home,
-  Menu,
+  Menu
 } from '@material-ui/icons';
 import { makeStyles, useTheme } from '@material-ui/core/styles';
 
@@ -18,6 +18,7 @@ import MobileHeader from './MobileHeader';
 import BottomBar from './BottomBar';
 import BrowserHeader from './BrowserHeader';
 import Avatar from '../Avatar/Avatar';
+import Drawer from '../Drawer/Drawer';
 
 
 const useStyles = makeStyles(theme => ({
@@ -38,6 +39,7 @@ const Header: React.FC = React.memo(() => {
   const theme = useTheme();
   const history = useHistory();
   const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
+  const [isDrawerOpen, setIsDrawerOpen] = useState<boolean>(false);
 
   const handleHome = (): void => {
     history.push('/');
@@ -56,6 +58,10 @@ const Header: React.FC = React.memo(() => {
     history.push('/notifications');
   };
 
+  const handleMenu = (): void => {
+    setIsDrawerOpen(true);
+  };
+
   const feed = (
     <IconButton onClick={handleFeed}>
       <Home />
@@ -69,7 +75,7 @@ const Header: React.FC = React.memo(() => {
   );
 
   const menu = (
-    <IconButton>
+    <IconButton onClick={handleMenu}>
       <Menu />
     </IconButton>
   );
@@ -94,6 +100,7 @@ const Header: React.FC = React.memo(() => {
     <>
       <MobileHeader logo={logo} menu={menu} />
       <BottomBar feed={feed} profile={profile} notifications={notifications} />
+      <Drawer isOpen={isDrawerOpen} setIsOpen={setIsDrawerOpen} />
     </>
   ) : (
     <BrowserHeader logo={logo} profile={profile} notifications={notifications} feed={feed} />
-- 
cgit v1.2.3