From f2dad674f9096ca2423cbbdc0228576f094f064c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <rafizadanly@gmail.com>
Date: Mon, 26 Dec 2022 12:01:19 +0700
Subject: Fitur Logout

---
 src/components/Header.js | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

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

diff --git a/src/components/Header.js b/src/components/Header.js
index ad706fe9..99972307 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -7,7 +7,8 @@ import {
   MagnifyingGlassIcon,
   Bars3Icon,
   ShoppingCartIcon,
-  ChevronRightIcon
+  ChevronRightIcon,
+  Cog6ToothIcon
 } from "@heroicons/react/24/outline";
 
 // Helpers
@@ -16,6 +17,7 @@ import { getAuth, useAuth } from "../helpers/auth";
 import Link from "./Link";
 // Images
 import Logo from "../images/logo.png";
+import greeting from "../helpers/greeting";
 
 export default function Header({ title }) {
   const router = useRouter();
@@ -25,18 +27,17 @@ export default function Header({ title }) {
   const searchQueryRef = useRef();
   const [isMenuActive, setIsMenuActive] = useState(false);
   const [auth, setAuth] = useAuth();
-
+  
   useEffect(() => {
     if (q) {
       searchQueryRef.current.blur();
       setSuggestions([]);
     };
-  }, [q])
+  }, [q]);
 
   const clickSuggestion = (value) => {
-    console.log(value);
     router.push(`/shop/search?q=${value}`, undefined, { scroll: false });
-  }
+  };
 
   const getSuggestion = useCallback(async () => {
     if (searchQuery.trim().length > 0) {
@@ -73,10 +74,13 @@ export default function Header({ title }) {
       <div className={'menu-wrapper' + (isMenuActive ? ' active ' : '')}>
         <div className="flex gap-x-2 items-center border-b border-gray_r-6 p-4">
           { auth && (
-            <Link href="/my/menu" className="w-full flex text-gray_r-12" onClick={closeMenu}>
-              <h1>Hi, {auth.name}</h1>
+            <Link href="/my/menu" className="w-full flex items-center text-gray_r-12" onClick={closeMenu}>
+              <div>
+                <p className="text-gray_r-11 text-caption-2">{ greeting() },</p>
+                <h1>{auth.name}</h1>
+              </div>
               <div className="ml-auto">
-                <ChevronRightIcon className="w-5" />
+                <Cog6ToothIcon className="w-5" />
               </div>
             </Link>
           ) }
-- 
cgit v1.2.3