From c7583413bbb84e7c9b8d8cd7fd54c0f117a89e6a Mon Sep 17 00:00:00 2001
From: Ardeman <are.theman@gmail.com>
Date: Sun, 9 Mar 2025 20:22:48 +0800
Subject: [PATCH] feat: add AdminContext for managing upload state in admin
 dashboard

---
 app/contexts/admin.tsx                    | 47 +++++++++++++++++++++++
 app/layouts/admin/dashboard.tsx           |  3 ++
 app/routes/_admin.lg-admin._dashboard.tsx |  9 +++--
 3 files changed, 56 insertions(+), 3 deletions(-)
 create mode 100644 app/contexts/admin.tsx

diff --git a/app/contexts/admin.tsx b/app/contexts/admin.tsx
new file mode 100644
index 0000000..7e093a1
--- /dev/null
+++ b/app/contexts/admin.tsx
@@ -0,0 +1,47 @@
+import {
+  createContext,
+  useState,
+  useContext,
+  type PropsWithChildren,
+  type Dispatch,
+  type SetStateAction,
+} from 'react'
+
+type TUpload =
+  | 'featured_image'
+  | 'ads'
+  | 'content'
+  | 'profile_picture'
+  | undefined
+
+type AdminContextProperties = {
+  isUploadOpen: TUpload
+  setIsUploadOpen: Dispatch<SetStateAction<TUpload>>
+}
+
+const AdminContext = createContext<AdminContextProperties | undefined>(
+  undefined,
+)
+
+export const AdminProvider = ({ children }: PropsWithChildren) => {
+  const [isUploadOpen, setIsUploadOpen] = useState<TUpload>()
+
+  return (
+    <AdminContext.Provider
+      value={{
+        isUploadOpen,
+        setIsUploadOpen,
+      }}
+    >
+      {children}
+    </AdminContext.Provider>
+  )
+}
+
+export const useAdminContext = (): AdminContextProperties => {
+  const context = useContext(AdminContext)
+  if (!context) {
+    throw new Error('useAdminContext must be used within a AdminProvider')
+  }
+  return context
+}
diff --git a/app/layouts/admin/dashboard.tsx b/app/layouts/admin/dashboard.tsx
index a57480e..c23d2f1 100644
--- a/app/layouts/admin/dashboard.tsx
+++ b/app/layouts/admin/dashboard.tsx
@@ -1,10 +1,13 @@
 import type { PropsWithChildren } from 'react'
 
+import { useAdminContext } from '~/contexts/admin'
+
 import { Navbar } from './navbar'
 import { Sidebar } from './sidebar'
 
 export const AdminDashboardLayout = (properties: PropsWithChildren) => {
   const { children } = properties
+  const {} = useAdminContext()
   return (
     <div className="flex flex-col">
       <Navbar />
diff --git a/app/routes/_admin.lg-admin._dashboard.tsx b/app/routes/_admin.lg-admin._dashboard.tsx
index 11b5ffc..61edd57 100644
--- a/app/routes/_admin.lg-admin._dashboard.tsx
+++ b/app/routes/_admin.lg-admin._dashboard.tsx
@@ -2,6 +2,7 @@ import { Outlet } from 'react-router'
 
 import { getCategories } from '~/apis/common/get-categories'
 import { getTags } from '~/apis/common/get-tags'
+import { AdminProvider } from '~/contexts/admin'
 import { AdminDashboardLayout } from '~/layouts/admin/dashboard'
 
 import type { Route } from './+types/_admin.lg-admin._dashboard'
@@ -18,9 +19,11 @@ export const loader = async ({}: Route.LoaderArgs) => {
 
 const DashboardLayout = () => {
   return (
-    <AdminDashboardLayout>
-      <Outlet />
-    </AdminDashboardLayout>
+    <AdminProvider>
+      <AdminDashboardLayout>
+        <Outlet />
+      </AdminDashboardLayout>
+    </AdminProvider>
   )
 }
 export default DashboardLayout