From a2981ea552b142edce582dd1124efec31241962a Mon Sep 17 00:00:00 2001
From: Jonny Scholes <jonnyscholes@gmail.com>
Date: Sat, 10 Jul 2021 23:20:34 +1000
Subject: [PATCH 1/3] Link wallet preview button to profile. Separate unsync
 button from profile button.

---
 src/components/header/index.js | 48 ++++++++++++++++------------------
 1 file changed, 23 insertions(+), 25 deletions(-)

diff --git a/src/components/header/index.js b/src/components/header/index.js
index e94a5f240..034527ea6 100644
--- a/src/components/header/index.js
+++ b/src/components/header/index.js
@@ -29,20 +29,6 @@ export const Header = () => {
     context.setTheme(getItem('theme') || setItem('theme', 'dark'))
   }, [])
 
-  // we assume user isn't connected
-  let button = 'sync'
-
-  // but if they are
-  if (context.acc?.address) {
-    // is menu closed?
-    if (context.collapsed) {
-      button = walletPreview(context.acc.address)
-    } else {
-      // menu is open
-      button = 'unsync'
-    }
-  }
-
   //const activeAccount = await wallet.client.getActiveAccount()
   //console.log(activeAccount)
   const handleRoute = (path, data) => {
@@ -50,16 +36,29 @@ export const Header = () => {
     history.push(path, data)
   }
 
-  const handleSyncUnsync = () => {
-    if (context.acc?.address && !context.collapsed) {
-      // disconnect wallet
-      context.disconnect()
-    } else {
-      // connect wallet
-      context.syncTaquito()
-    }
+  // we assume user isn't connected
+  let profileButton = (
+    <Button onClick={()=>context.syncTaquito()} secondary>
+      <Primary>sync</Primary>
+    </Button>
+  )
+
+  // but if they are, we add shortcut to their profile
+  if (context.acc?.address) {
+    profileButton = (
+      <Button onClick={() => handleRoute('/sync', 'tz')} secondary>
+        <Primary>{walletPreview(context.acc.address)}</Primary>
+      </Button>
+    )
   }
 
+  // ... and show additional unsync button when menu opens
+  const unSyncButton = context.acc?.address && !context.collapsed ? (
+    <Button onClick={()=>context.disconnect()} secondary>
+      <Primary>unsync</Primary>
+    </Button>
+  ) : ''
+
   return (
     <>
       <header className={styles.container}>
@@ -138,9 +137,8 @@ export const Header = () => {
           </Button>
 
           <div className={styles.right}>
-            <Button onClick={handleSyncUnsync} secondary>
-              <Primary>{button}</Primary>
-            </Button>
+            {unSyncButton}
+            {profileButton}
 
             <Button onClick={context.toogleNavbar} secondary>
               <VisuallyHidden>

From d02efb7366f994a33e86e183b264f94788b7720e Mon Sep 17 00:00:00 2001
From: Jonny Scholes <jonnyscholes@gmail.com>
Date: Sat, 10 Jul 2021 23:21:07 +1000
Subject: [PATCH 2/3] Evenly space all buttons in right section of header

---
 src/components/header/styles.module.scss | 9 +++------
 src/components/icons/styles.module.scss  | 3 ---
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/src/components/header/styles.module.scss b/src/components/header/styles.module.scss
index 4c9a29b12..4b8320afe 100644
--- a/src/components/header/styles.module.scss
+++ b/src/components/header/styles.module.scss
@@ -47,12 +47,9 @@
         display: flex;
         align-items: center;
         font-size: 16px;
-      }
-
-      .hamburger {
-        width: 30px;
-        height: auto;
-        margin-left: 10px;
+        + * {
+          margin-left: 10px;
+        }
       }
     }
   }
diff --git a/src/components/icons/styles.module.scss b/src/components/icons/styles.module.scss
index e5d3f4e42..fa0d7ad58 100644
--- a/src/components/icons/styles.module.scss
+++ b/src/components/icons/styles.module.scss
@@ -1,9 +1,6 @@
 @import '../../styles/variables.scss';
 
 .menu {
-  margin-left: 6px;
-  // border: 1px dashed black;
-
   svg {
     display: block;
     width: 30px;

From 9b6794fdf7a23200370875b54a73b78ff872a6dd Mon Sep 17 00:00:00 2001
From: Jonny Scholes <jonnyscholes@gmail.com>
Date: Sun, 11 Jul 2021 10:30:12 +1000
Subject: [PATCH 3/3] Revert to a single button in header, keep link to profile

---
 src/components/header/index.js | 35 +++++++++++++++-------------------
 1 file changed, 15 insertions(+), 20 deletions(-)

diff --git a/src/components/header/index.js b/src/components/header/index.js
index 034527ea6..3f5790cad 100644
--- a/src/components/header/index.js
+++ b/src/components/header/index.js
@@ -37,28 +37,22 @@ export const Header = () => {
   }
 
   // we assume user isn't connected
-  let profileButton = (
-    <Button onClick={()=>context.syncTaquito()} secondary>
-      <Primary>sync</Primary>
-    </Button>
-  )
+  let headerButtonHandler = () => context.syncTaquito()
+  let headerButtonText = 'sync'
 
-  // but if they are, we add shortcut to their profile
+  // but if they are
   if (context.acc?.address) {
-    profileButton = (
-      <Button onClick={() => handleRoute('/sync', 'tz')} secondary>
-        <Primary>{walletPreview(context.acc.address)}</Primary>
-      </Button>
-    )
+    // is menu closed?
+    if (context.collapsed) {
+      headerButtonHandler = () => handleRoute('/sync', 'tz')
+      headerButtonText = walletPreview(context.acc.address)
+    } else {
+      // menu is open
+      headerButtonHandler = () => context.disconnect()
+      headerButtonText = 'unsync'
+    }
   }
 
-  // ... and show additional unsync button when menu opens
-  const unSyncButton = context.acc?.address && !context.collapsed ? (
-    <Button onClick={()=>context.disconnect()} secondary>
-      <Primary>unsync</Primary>
-    </Button>
-  ) : ''
-
   return (
     <>
       <header className={styles.container}>
@@ -137,8 +131,9 @@ export const Header = () => {
           </Button>
 
           <div className={styles.right}>
-            {unSyncButton}
-            {profileButton}
+            <Button onClick={headerButtonHandler} secondary>
+              <Primary>{headerButtonText}</Primary>
+            </Button>
 
             <Button onClick={context.toogleNavbar} secondary>
               <VisuallyHidden>