Refactor

app/dashboard/orders/[id]/page.tsx

@@ -1,8 +1,10 @@
+
 "use client";
 
+import { fetchData } from '@/lib/data-service';
 import { useEffect, useState } from "react";
 import { useParams } from "next/navigation";
-import Layout from "@/components/kokonutui/layout";
+import Layout from "@/components/layout/layout";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -55,10 +57,34 @@ export default function OrderDetailsPage() {
   const params = useParams();
   const orderId = params?.id;
 
+  const fetchProductNames = async (
+    productIds: string[],
+    authToken: string
+  ): Promise<Record<string, string>> => {
+    const productNamesMap: Record<string, string> = {};
+    try {
+      const promises = productIds.map((id) =>
+        fetchData(`${process.env.NEXT_PUBLIC_API_URL}/products/${id}`, {
+          method: "GET",
+          headers: { Authorization: `Bearer ${authToken}` },
+        })
+      );
+      const responses = await Promise.all(promises);
+      const results = await Promise.all(responses.map((res) => res));
+  
+      results.forEach((product, index) => {
+        productNamesMap[productIds[index]] = product.name || "Unknown Product";
+      });
+    } catch (err) {
+      console.error("Failed to fetch product names:", err);
+    }
+    return productNamesMap;
+  };
+
   const handleMarkAsPaid = async () => {
     try {
       const authToken = document.cookie.split("Authorization=")[1];
-      const response = await fetch(
+      const response = await fetchData(
         `${process.env.NEXT_PUBLIC_API_URL}/orders/${orderId}`,
         {
           method: "PUT",
@@ -70,7 +96,7 @@ export default function OrderDetailsPage() {
         }
       );
 
-      if (response.ok) {
+      if (response && response.message === "Order status updated successfully") {
         setIsPaid(true); // Update isPaid state
         setOrder((prevOrder) => (prevOrder ? { ...prevOrder, status: "paid" } : null)); // Update order status
         console.log("Order marked as paid successfully.");
@@ -92,7 +118,7 @@ export default function OrderDetailsPage() {
 
         const authToken = document.cookie.split("Authorization=")[1];
 
-        const res = await fetch(
+        const res = await fetchData(
           `${process.env.NEXT_PUBLIC_API_URL}/orders/${orderId}`,
           {
             method: "GET",
@@ -100,9 +126,9 @@ export default function OrderDetailsPage() {
           }
         );
 
-        if (!res.ok) throw new Error("Failed to fetch order details");
+        if (!res) throw new Error("Failed to fetch order details");
 
-        const data: Order = await res.json();
+        const data: Order = await res;
         setOrder(data);
 
         const productIds = data.products.map((product) => product.productId);
@@ -120,32 +146,8 @@ export default function OrderDetailsPage() {
       }
     };
 
-    const fetchProductNames = async (
-      productIds: string[],
-      authToken: string
-    ): Promise<Record<string, string>> => {
-      const productNamesMap: Record<string, string> = {};
-      try {
-        const promises = productIds.map((id) =>
-          fetch(`${process.env.NEXT_PUBLIC_API_URL}/products/${id}`, {
-            method: "GET",
-            headers: { Authorization: `Bearer ${authToken}` },
-          })
-        );
-        const responses = await Promise.all(promises);
-        const results = await Promise.all(responses.map((res) => res.json()));
-
-        results.forEach((product, index) => {
-          productNamesMap[productIds[index]] = product.name || "Unknown Product";
-        });
-      } catch (err) {
-        console.error("Failed to fetch product names:", err);
-      }
-      return productNamesMap;
-    };
-
     fetchOrderDetails();
-  }, [orderId]);
+}, [orderId]);
 
   const handleAddTracking = async () => {
     if (!trackingNumber) return;
@@ -153,7 +155,7 @@ export default function OrderDetailsPage() {
     try {
       const authToken = document.cookie.split("Authorization=")[1];
 
-      const res = await fetch(
+      const res = await fetchData(
         `${process.env.NEXT_PUBLIC_API_URL}/orders/${orderId}/tracking`,
         {
           method: "PUT",

app/dashboard/orders/page.tsx

@@ -2,9 +2,9 @@
 
 import { useEffect } from "react";
 import { useRouter } from "next/navigation";
-import Dashboard from "@/components/kokonutui/dashboard";
+import Dashboard from "@/components/dashboard/dashboard";
 import { Package } from "lucide-react";
-import OrderTable from "@/components/order-table";
+import OrderTable from "@/components/tables/order-table";
 
 export default function OrdersPage() {
   const router = useRouter();