From f99e0aba70efad0deb907d8e27f09fc9f527c8a4 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Fri, 17 Feb 2023 17:07:50 +0700
Subject: Refactor

---
 src2/pages/my/menu.js | 82 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 82 insertions(+)
 create mode 100644 src2/pages/my/menu.js

(limited to 'src2/pages/my/menu.js')

diff --git a/src2/pages/my/menu.js b/src2/pages/my/menu.js
new file mode 100644
index 00000000..ae6c2af8
--- /dev/null
+++ b/src2/pages/my/menu.js
@@ -0,0 +1,82 @@
+
+import AppBar from "@/components/layouts/AppBar";
+import Layout from "@/components/layouts/Layout";
+import Link from "@/components/elements/Link";
+import { useAuth } from "@/core/utils/auth";
+import {
+  ArrowRightOnRectangleIcon,
+  ChatBubbleLeftRightIcon,
+  ChevronRightIcon,
+  MapIcon,
+  PaperClipIcon,
+  PencilSquareIcon,
+  QuestionMarkCircleIcon,
+  ReceiptPercentIcon,
+  UserIcon,
+  HeartIcon
+} from "@heroicons/react/24/outline"; 
+import WithAuth from "@/components/auth/WithAuth";
+
+const Menu = ({ icon, name, url }) => {
+  return (
+    <Link href={url} className="text-gray_r-11 font-normal flex gap-x-2 items-center py-4 border-b border-gray_r-6">
+      <span className="flex gap-x-2">
+        { icon }
+        { name }
+      </span>
+      <ChevronRightIcon className="w-5 ml-auto"/>
+    </Link>
+  );
+};
+
+export default function MyMenu() {
+  const [auth] = useAuth();
+
+  return (
+    <WithAuth>
+      <Layout>
+        <AppBar title="Menu Utama" />
+
+        <div className="p-4 flex gap-x-2 items-center">
+          <div className="flex-1 flex gap-x-3 items-center">
+            <div className="p-2 bg-gray_r-4 rounded-full h-fit">
+              <UserIcon className="w-6" />
+            </div>
+            <div>
+              <h2>{ auth?.name }</h2>
+              { auth?.company ? (
+                <div className="badge-red font-normal text-xs">Akun Bisnis</div>
+                ) : (
+                <div className="badge-gray font-normal text-xs">Akun Individu</div>
+              ) }
+            </div>
+          </div>
+          <Link href="/my/profile">
+            <PencilSquareIcon className="w-6 text-yellow_r-12"/>
+          </Link>
+        </div>
+    
+        <div className="px-4 mt-4">
+          <p className="font-medium mb-2">Aktivitas Pembelian</p>
+          <div className="flex flex-col mb-6">
+            <Menu icon={<ReceiptPercentIcon className="w-5" />} name="Daftar Transaksi" url="/my/transactions" />
+            <Menu icon={<PaperClipIcon className="w-5" />} name="Invoice & Faktur Pajak" url="/my/invoices" />
+            <Menu icon={<HeartIcon className="w-5" />} name="Wishlist" url="/my/wishlist" />
+          </div>
+
+          <p className="font-medium mb-2">Pusat Bantuan</p>
+          <div className="flex flex-col mb-6">
+            <Menu icon={<ChatBubbleLeftRightIcon className="w-5"/>} name="Layanan Pelanggan" url="/" />
+            <Menu icon={<QuestionMarkCircleIcon className="w-5"/>} name="F.A.Q" url="/faqs" />
+          </div>
+
+          <p className="font-medium mb-2">Pengaturan Akun</p>
+          <div className="flex flex-col mb-6">
+            <Menu icon={<MapIcon className="w-5" />} name="Daftar Alamat" url="/my/address" />
+            <Menu icon={<ArrowRightOnRectangleIcon className="w-5" />} name="Keluar Akun" url="/logout" />
+          </div>
+        </div>
+      </Layout>
+    </WithAuth>
+  );
+}
\ No newline at end of file
-- 
cgit v1.2.3