From 634e9651eccbef7fb4f51da4c2638547669dc84e Mon Sep 17 00:00:00 2001
From: Chuma McPhoy <chuma.mcphoy@scandichotels.com>
Date: Wed, 19 Jun 2024 10:18:31 +0200
Subject: [PATCH] feat: use avatar component in hamburger dropdown

---
 components/Current/Header/MainMenu/index.tsx           | 7 +++++--
 components/Current/Header/MainMenu/mainMenu.module.css | 7 +------
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/components/Current/Header/MainMenu/index.tsx b/components/Current/Header/MainMenu/index.tsx
index e43a48a2c..5ebb09540 100644
--- a/components/Current/Header/MainMenu/index.tsx
+++ b/components/Current/Header/MainMenu/index.tsx
@@ -76,8 +76,11 @@ export function MainMenu({
             <ul className={styles.linkRow}>
               {!!user ? (
                 <>
-                  <li>
-                    <div className={styles.loggedInLogo} />
+                  <li className={styles.avatarWrapper}>
+                    <Avatar
+                      firstName={user.firstName}
+                      lastName={user.lastName}
+                    />
                   </li>
                   <li className={styles.mobileLinkRow}>
                     <Link
diff --git a/components/Current/Header/MainMenu/mainMenu.module.css b/components/Current/Header/MainMenu/mainMenu.module.css
index 8cc27d0e4..d9e5339f5 100644
--- a/components/Current/Header/MainMenu/mainMenu.module.css
+++ b/components/Current/Header/MainMenu/mainMenu.module.css
@@ -180,13 +180,8 @@
   padding: 15px 15px 15px 5px;
 }
 
-.loggedInLogo {
-  height: 35px;
-  width: 35px;
-  border-radius: 50px;
-  background-color: #000;
+.avatarWrapper {
   margin-right: 4px;
-  margin-left: -4px;
 }
 
 .mobileLinkButton {