1 files changed, 24 insertions, 13 deletions
diff --git a/src/core/components/elements/Sidebar/Sidebar.jsx b/src/core/components/elements/Sidebar/Sidebar.jsx
index 74984393..412ed915 100644
--- a/src/core/components/elements/Sidebar/Sidebar.jsx
+++ b/src/core/components/elements/Sidebar/Sidebar.jsx
@@ -1,13 +1,22 @@
-import { getAuth } from "@/core/utils/auth"
 import Link from "../Link/Link"
 import greeting from "@/core/utils/greeting"
 import { Cog6ToothIcon } from "@heroicons/react/24/solid"
+import useAuth from "@/core/hooks/useAuth"
 
 const Sidebar = ({
   active,
   close
 }) => {
-  const auth = getAuth()
+  const auth = useAuth()
+
+  const SidebarLink = ({ children, ...props }) => (
+    <Link 
+      {...props} 
+      onClick={close}
+    >{ children }</Link>
+  )
+
+  const itemClassName = 'px-4 py-3 block !text-gray_r-12/80 font-normal'
   
   return (
     <>
@@ -24,29 +33,31 @@ const Sidebar = ({
             { auth && (
               <>
                 <div className="text-caption-2 text-gray_r-11">
-                  {/* { greeting() }, */}
+                  { greeting() },
                   <span className="text-body-2 text-gray_r-12 block mt-1 font-medium">
                     { auth?.name }
                   </span>
                 </div>
-                <Link href="/my/menu" className="!text-gray_r-11 ml-auto my-auto">
+                <Link 
+                  onClick={close} 
+                  href="/my/menu" 
+                  className="!text-gray_r-11 ml-auto my-auto"
+                >
                   <Cog6ToothIcon className="w-6" />
                 </Link>
               </>
             ) }
           </div>
-          <Link href="/" className="px-4 py-3 block !text-gray_r-12 font-normal">
+          <SidebarLink className={itemClassName} href="/">
             Semua Brand
-          </Link>
-          <Link href="/" className="px-4 py-3 block !text-gray_r-12 font-normal">
+          </SidebarLink>
+          <SidebarLink className={itemClassName} href="/">
             Tentang Indoteknik
-          </Link>
-          <Link href="/" className="px-4 py-3 block !text-gray_r-12 font-normal">
+          </SidebarLink>
+          <SidebarLink className={itemClassName} href="/">
             Pusat Bantuan
-          </Link>
-          <Link href="/" className="px-4 py-3 block !text-gray_r-12 font-normal">
-            Kategori
-          </Link>
+          </SidebarLink>
+          <button className={`${itemClassName} w-full text-left`}>Kategori</button>
         </div>
       </div>
     </>