api ulangan

src/providers/routing/AppRoutes.tsx

@@ -1,3 +1,12 @@
+import LoginLayout from "@/LoginLayout";
+import Banners from "@/pages/Banners";
+import Categories from "@/pages/Categories";
+import Faq from "@/pages/Faq";
+import HomePage from "@/pages/Home";
+import Orders from "@/pages/Orders";
+import Product from "@/pages/Product";
+import Units from "@/pages/Units";
+import Users from "@/pages/Users";
 import routesConfig from "@/providers/routing/config";
 import { Navigate, useRoutes } from "react-router-dom";
 
@@ -8,6 +17,42 @@ const AppRouter = () => {
       path: "*",
       element: <Navigate to="/" />,
     },
+    {
+      path: "/dashboard",
+      element: (
+        <LoginLayout>
+          <HomePage />
+        </LoginLayout>
+      ),
+    },
+    {
+      path: "/dashboard/products",
+      element: <Product />,
+    },
+    {
+      path: "/dashboard/categories",
+      element: <Categories />,
+    },
+    {
+      path: "/dashboard/units",
+      element: <Units />,
+    },
+    {
+      path: "/dashboard/banners",
+      element: <Banners />,
+    },
+    {
+      path: "/dashboard/orders",
+      element: <Orders />,
+    },
+    {
+      path: "/dashboard/users",
+      element: <Users />,
+    },
+    {
+      path: "/dashboard/faq",
+      element: <Faq />,
+    },
   ]);
 
   return routes;

src/providers/routing/config.tsx

@@ -1,4 +1,4 @@
-import { Home } from "@/pages/Home";
+import Login from "@/pages/Login";
 import { Outlet, type RouteObject } from "react-router-dom";
 
 const routesConfig: RouteObject = {
@@ -8,7 +8,7 @@ const routesConfig: RouteObject = {
       children: [
         {
           path: "/",
-          element: <Home />,
+          element: <Login />,
         },
       ],
     },

src/providers/theme/ThemeProvider.tsx

@@ -1,6 +1,11 @@
-import { createContext, useContext, useEffect, useState } from 'react';
+"use client";
 
-type Theme = 'dark' | 'light' | 'system';
+import {
+  ThemeProviderContext,
+  type Theme,
+  type ThemeProviderState,
+} from "@/providers/theme/themeContext";
+import { useContext, useEffect, useState } from "react";
 
 type ThemeProviderProps = {
   children: React.ReactNode;
@@ -8,23 +13,10 @@ type ThemeProviderProps = {
   storageKey?: string;
 };
 
-type ThemeProviderState = {
-  theme: Theme;
-  setTheme: (theme: Theme) => void;
-};
-
-const initialState: ThemeProviderState = {
-  theme: 'system',
-  setTheme: () => null,
-};
-
-const ThemeProviderContext = createContext<ThemeProviderState>(initialState);
-
 export function ThemeProvider({
   children,
-  defaultTheme = 'system',
-  storageKey = 'vite-ui-theme',
-  ...props
+  defaultTheme = "system",
+  storageKey = "vite-ui-theme",
 }: ThemeProviderProps) {
   const [theme, setTheme] = useState<Theme>(
     () => (localStorage.getItem(storageKey) as Theme) || defaultTheme,
@@ -32,15 +24,13 @@ export function ThemeProvider({
 
   useEffect(() => {
     const root = window.document.documentElement;
+    root.classList.remove("light", "dark");
 
-    root.classList.remove('light', 'dark');
-
-    if (theme === 'system') {
-      const systemTheme = window.matchMedia('(prefers-color-scheme: dark)')
+    if (theme === "system") {
+      const systemTheme = window.matchMedia("(prefers-color-scheme: dark)")
         .matches
-        ? 'dark'
-        : 'light';
-
+        ? "dark"
+        : "light";
       root.classList.add(systemTheme);
       return;
     }
@@ -48,7 +38,7 @@ export function ThemeProvider({
     root.classList.add(theme);
   }, [theme]);
 
-  const value = {
+  const value: ThemeProviderState = {
     theme,
     setTheme: (theme: Theme) => {
       localStorage.setItem(storageKey, theme);
@@ -57,17 +47,14 @@ export function ThemeProvider({
   };
 
   return (
-    <ThemeProviderContext.Provider {...props} value={value}>
+    <ThemeProviderContext.Provider value={value}>
       {children}
     </ThemeProviderContext.Provider>
   );
 }
 
-export const useTheme = () => {
+export function useTheme() {
   const context = useContext(ThemeProviderContext);
-
-  if (context === undefined)
-    throw new Error('useTheme must be used within a ThemeProvider');
-
+  if (!context) throw new Error("useTheme must be used within ThemeProvider");
   return context;
-};
+}

src/providers/theme/themeContext.ts

@@ -0,0 +1,16 @@
+import { createContext } from "react";
+
+export type Theme = "dark" | "light" | "system";
+
+export type ThemeProviderState = {
+  theme: Theme;
+  setTheme: (theme: Theme) => void;
+};
+
+export const initialState: ThemeProviderState = {
+  theme: "system",
+  setTheme: () => null,
+};
+
+export const ThemeProviderContext =
+  createContext<ThemeProviderState>(initialState);