From 77dc482dda42f9532ece78c4c568b37658270c0a Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Wed, 12 Aug 2020 04:26:54 +0300
Subject: feat: improve Avatar

---
 src/components/Avatar/Avatar.tsx | 16 ++++------------
 src/components/Header/Header.tsx |  2 +-
 2 files changed, 5 insertions(+), 13 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Avatar/Avatar.tsx b/src/components/Avatar/Avatar.tsx
index e445891..29754c9 100644
--- a/src/components/Avatar/Avatar.tsx
+++ b/src/components/Avatar/Avatar.tsx
@@ -1,35 +1,27 @@
 import React from 'react';
 import { useHistory } from 'react-router-dom';
 import { Avatar as AvatarBase } from '@material-ui/core';
-import AccountCircle from '@material-ui/icons/AccountCircle';
 import { User } from 'which-types';
 
 interface PropTypes {
-  user: User;
+  user?: User;
   className?: string;
 }
 
 const Avatar: React.FC<PropTypes> = ({ user, className }) => {
   const history = useHistory();
-  const { username, avatarUrl } = user;
 
   const handleClick = () => {
-    history.push(`/profile/${username}`);
+    if (user) history.push(`/profile/${user.username}`);
   };
 
-  return avatarUrl ? (
+  return (
     <AvatarBase
-      src={avatarUrl}
-      alt={username[0].toUpperCase()}
+      src={user?.avatarUrl}
       onClick={handleClick}
       className={className}
       style={{ cursor: 'pointer' }}
     />
-  ) : (
-    <AccountCircle
-      className={className}
-      onClick={handleClick}
-    />
   );
 };
 
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 224f6b0..a1ca1b1 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -89,7 +89,7 @@ const Header: React.FC = React.memo(() => {
   const profile = (
     <IconButton onClick={handleProfile}>
       {
-        user
+        user?.avatarUrl
           ? <Avatar className={classes.avatar} user={user} />
           : <AccountCircle className={classes.avatar} />
       }
-- 
cgit v1.2.3


From 86a946b2b0535829857757eeaa2226e6f0814f3b Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Wed, 12 Aug 2020 04:40:14 +0300
Subject: feat: support drawer in browser

---
 src/components/Header/BrowserHeader.tsx | 24 ++++++++++++++++--------
 src/components/Header/Header.tsx        |  5 ++++-
 2 files changed, 20 insertions(+), 9 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Header/BrowserHeader.tsx b/src/components/Header/BrowserHeader.tsx
index 2dda717..2acb69c 100644
--- a/src/components/Header/BrowserHeader.tsx
+++ b/src/components/Header/BrowserHeader.tsx
@@ -5,6 +5,7 @@ import SearchBar from './SearchBar';
 
 interface PropTypes {
   logo: JSX.Element;
+  menu: JSX.Element;
   feed: JSX.Element;
   notifications: JSX.Element;
   profile: JSX.Element;
@@ -18,7 +19,8 @@ const useStyles = makeStyles({
     justifyContent: 'space-around'
   },
   group: {
-    display: 'flex'
+    display: 'flex',
+    alignItems: 'center'
   }
 });
 
@@ -27,6 +29,7 @@ const BrowserHeader: React.FC<PropTypes> = React.memo(props => {
   const classes = useStyles();
   const {
     logo,
+    menu,
     feed,
     notifications,
     profile
@@ -34,13 +37,18 @@ const BrowserHeader: React.FC<PropTypes> = React.memo(props => {
 
   return (
     <AppBar position="fixed">
-      <Toolbar className={classes.root}>
-        {logo}
-        <SearchBar />
-        <div className={classes.group}>
-          {feed}
-          {notifications}
-          {profile}
+      <Toolbar>
+        {menu}
+        <div className={classes.root}>
+          <div className={classes.group}>
+            {logo}
+          </div>
+          <SearchBar />
+          <div className={classes.group}>
+            {feed}
+            {notifications}
+            {profile}
+          </div>
         </div>
       </Toolbar>
     </AppBar>
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index a1ca1b1..93ba47d 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -103,7 +103,10 @@ const Header: React.FC = React.memo(() => {
       <Drawer isOpen={isDrawerOpen} setIsOpen={setIsDrawerOpen} />
     </>
   ) : (
-    <BrowserHeader logo={logo} profile={profile} notifications={notifications} feed={feed} />
+    <>
+      <BrowserHeader menu={menu} logo={logo} profile={profile} notifications={notifications} feed={feed} />
+      <Drawer isOpen={isDrawerOpen} setIsOpen={setIsDrawerOpen} />
+    </>
   );
 });
 
-- 
cgit v1.2.3


From 5744923265ff51e392575edfd6a8182589105dc6 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Wed, 12 Aug 2020 01:59:27 +0300
Subject: feat: PollCreation page and Fab component

---
 src/components/Fab/Fab.tsx | 55 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 src/components/Fab/Fab.tsx

(limited to 'src/components')

diff --git a/src/components/Fab/Fab.tsx b/src/components/Fab/Fab.tsx
new file mode 100644
index 0000000..335fcba
--- /dev/null
+++ b/src/components/Fab/Fab.tsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { useHistory } from 'react-router-dom'
+import {
+  Fab as FabBase,
+  useMediaQuery,
+  Slide,
+  useScrollTrigger
+} from '@material-ui/core/';
+import { makeStyles } from '@material-ui/core/styles';
+import PlusIcon from '@material-ui/icons/Add';
+
+interface PropTypes {
+  hideOnScroll?: boolean;
+}
+
+const useStyles = makeStyles(theme => ({
+  root: {
+    zIndex: 1200,
+    position: 'fixed',
+
+    [theme.breakpoints.down('sm')]: {
+      right: theme.spacing(2),
+      bottom: theme.spacing(8)
+    },
+    [theme.breakpoints.up('md')]: {
+      right: theme.spacing(5),
+      bottom: theme.spacing(5)
+    }
+  }
+}));
+
+const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
+  const classes = useStyles();
+  const history = useHistory();
+  const trigger = useScrollTrigger();
+
+  const handleClick = () => {
+    history.push('/new');
+  };
+
+  return (
+    <Slide appear={false} direction="up" in={(!hideOnScroll) || !trigger}>
+      <FabBase 
+        onClick={handleClick}
+        className={classes.root}
+        color="secondary"
+      >
+        <PlusIcon />
+      </FabBase>
+    </Slide>
+  );
+};
+
+export default Fab;
+
-- 
cgit v1.2.3


From d60f6d2e73a0c72237e0d807f15e75f14036057f Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Thu, 13 Aug 2020 17:13:50 +0300
Subject: feat: make bottom bar dense

---
 src/components/Header/BottomBar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components')

diff --git a/src/components/Header/BottomBar.tsx b/src/components/Header/BottomBar.tsx
index 67fe219..6264929 100644
--- a/src/components/Header/BottomBar.tsx
+++ b/src/components/Header/BottomBar.tsx
@@ -26,7 +26,7 @@ const BottomBar: React.FC<PropTypes> = React.memo(props => {
 
   return (
     <AppBar position="fixed" className={classes.root}>
-      <Toolbar className={classes.toolbar}>
+      <Toolbar variant="dense" className={classes.toolbar}>
         {notifications}
         {feed}
         {profile}
-- 
cgit v1.2.3


From c65923480118e90675c81782b9e3bc653e8e3b40 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Thu, 13 Aug 2020 17:20:28 +0300
Subject: fix: resolve eslint errors

---
 src/components/Fab/Fab.tsx | 15 +++++----------
 1 file changed, 5 insertions(+), 10 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Fab/Fab.tsx b/src/components/Fab/Fab.tsx
index 335fcba..7ca2893 100644
--- a/src/components/Fab/Fab.tsx
+++ b/src/components/Fab/Fab.tsx
@@ -1,11 +1,6 @@
 import React from 'react';
-import { useHistory } from 'react-router-dom'
-import {
-  Fab as FabBase,
-  useMediaQuery,
-  Slide,
-  useScrollTrigger
-} from '@material-ui/core/';
+import { useHistory } from 'react-router-dom';
+import { Fab as FabBase, Slide, useScrollTrigger } from '@material-ui/core/';
 import { makeStyles } from '@material-ui/core/styles';
 import PlusIcon from '@material-ui/icons/Add';
 
@@ -15,7 +10,7 @@ interface PropTypes {
 
 const useStyles = makeStyles(theme => ({
   root: {
-    zIndex: 1200,
+    zIndex: 1000,
     position: 'fixed',
 
     [theme.breakpoints.down('sm')]: {
@@ -29,7 +24,7 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
+const Fab: React.FC<PropTypes> = ({ hideOnScroll = false }) => {
   const classes = useStyles();
   const history = useHistory();
   const trigger = useScrollTrigger();
@@ -40,7 +35,7 @@ const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
 
   return (
     <Slide appear={false} direction="up" in={(!hideOnScroll) || !trigger}>
-      <FabBase 
+      <FabBase
         onClick={handleClick}
         className={classes.root}
         color="secondary"
-- 
cgit v1.2.3