From bc9a0fd74050d64570f2c10285b531330c497fa9 Mon Sep 17 00:00:00 2001
From: Hafid Nur <hafidnurazis@gmail.com>
Date: Thu, 27 Mar 2025 15:06:30 +0700
Subject: [PATCH] feat: Another page template

- Template untuk page Data Akun dan Validasi Transaksi
---
 apps/backoffice/src/app/accounts/layout.tsx   | 18 ++++++++++++++++++
 apps/backoffice/src/app/accounts/page.tsx     | 17 +++++++++++++++++
 .../src/app/transactions/layout.tsx           | 18 ++++++++++++++++++
 apps/backoffice/src/app/transactions/page.tsx | 19 +++++++++++++++++++
 .../backoffice-sidebar/backoffice-sidebar.tsx |  2 +-
 5 files changed, 73 insertions(+), 1 deletion(-)
 create mode 100644 apps/backoffice/src/app/accounts/layout.tsx
 create mode 100644 apps/backoffice/src/app/accounts/page.tsx
 create mode 100644 apps/backoffice/src/app/transactions/layout.tsx
 create mode 100644 apps/backoffice/src/app/transactions/page.tsx

diff --git a/apps/backoffice/src/app/accounts/layout.tsx b/apps/backoffice/src/app/accounts/layout.tsx
new file mode 100644
index 0000000..423168f
--- /dev/null
+++ b/apps/backoffice/src/app/accounts/layout.tsx
@@ -0,0 +1,18 @@
+import { FC, ReactElement } from 'react';
+import { Outlet } from 'react-router-dom';
+import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
+
+export const AppLayout: FC = (): ReactElement => {
+  return (
+    <div className="bg-primary-50 min-h-screen flex justify-center">
+      <div className="bg-primary-50 min-h-screen max-w-[1280px] w-full flex">
+        <BackofficeSidebar />
+        <div className="flex-1 overflow-auto">
+          <Outlet />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default AppLayout;
diff --git a/apps/backoffice/src/app/accounts/page.tsx b/apps/backoffice/src/app/accounts/page.tsx
new file mode 100644
index 0000000..ffa154e
--- /dev/null
+++ b/apps/backoffice/src/app/accounts/page.tsx
@@ -0,0 +1,17 @@
+import { FC, ReactElement } from 'react';
+
+export const Components: FC = (): ReactElement => {
+  return (
+    <main className="w-full px-[48px] py-[40px] flex flex-col gap-8">
+      {/* Dashboard Header */}
+      <header className="bg-white py-4 px-8 rounded-md shadow p-4">
+        <h1 className="text-p2 font-semibold">Data Akun</h1>
+      </header>
+
+      {/* Transaction Table Section */}
+      <div className="flex justify-between gap-[40px] p-8 bg-white rounded-md"></div>
+    </main>
+  );
+};
+
+export default Components;
diff --git a/apps/backoffice/src/app/transactions/layout.tsx b/apps/backoffice/src/app/transactions/layout.tsx
new file mode 100644
index 0000000..423168f
--- /dev/null
+++ b/apps/backoffice/src/app/transactions/layout.tsx
@@ -0,0 +1,18 @@
+import { FC, ReactElement } from 'react';
+import { Outlet } from 'react-router-dom';
+import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
+
+export const AppLayout: FC = (): ReactElement => {
+  return (
+    <div className="bg-primary-50 min-h-screen flex justify-center">
+      <div className="bg-primary-50 min-h-screen max-w-[1280px] w-full flex">
+        <BackofficeSidebar />
+        <div className="flex-1 overflow-auto">
+          <Outlet />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default AppLayout;
diff --git a/apps/backoffice/src/app/transactions/page.tsx b/apps/backoffice/src/app/transactions/page.tsx
new file mode 100644
index 0000000..cd1c262
--- /dev/null
+++ b/apps/backoffice/src/app/transactions/page.tsx
@@ -0,0 +1,19 @@
+import { ArrowDownOutlined, PlusOutlined } from '@ant-design/icons';
+import { Button } from '@imphnen-frontend-service/ui/atoms';
+import { FC, ReactElement } from 'react';
+
+export const Components: FC = (): ReactElement => {
+  return (
+    <main className="w-full px-[48px] py-[40px] flex flex-col gap-8">
+      {/* Dashboard Header */}
+      <header className="bg-white py-4 px-8 rounded-md shadow p-4">
+        <h1 className="text-p2 font-semibold">Validasi Transaksi</h1>
+      </header>
+
+      {/* Accounts Table Section */}
+      <div className="flex justify-between gap-[40px] p-8 bg-white rounded-md"></div>
+    </main>
+  );
+};
+
+export default Components;
diff --git a/libs/ui/src/organisms/backoffice-sidebar/backoffice-sidebar.tsx b/libs/ui/src/organisms/backoffice-sidebar/backoffice-sidebar.tsx
index a5e9b7a..d894144 100644
--- a/libs/ui/src/organisms/backoffice-sidebar/backoffice-sidebar.tsx
+++ b/libs/ui/src/organisms/backoffice-sidebar/backoffice-sidebar.tsx
@@ -33,7 +33,7 @@ export const BackofficeSidebar: FC = (): ReactElement => {
           </Link>
 
           <Link
-            to="/users"
+            to="/accounts"
             className={`flex items-center justify-items-start gap-3 px-[8px] py-[10px] ${
               isActive('/accounts')
                 ? 'bg-primary-500 text-white rounded-md'