Merge pull request #30 from atlp-rwanda/demo-fn-12-07

fix conflicts
atlp-rwanda · Jul 16, 2024 · 33e1a15 · 33e1a15
2 parents 5bc2364 + 3456c12
commit 33e1a15
Show file tree

Hide file tree

Showing 8 changed files with 37 additions and 39 deletions.
diff --git a/src/Components/orderComponent.tsx b/src/Components/orderComponent.tsx
@@ -2,14 +2,15 @@ import React from "react";
 import { useNavigate } from "react-router-dom";
 
 interface Props {
-    status: 'pending'| 'processing' | 'shipped' | 'delivered';
+    status: 'pending'| 'processing' | 'shipped' | 'delivered' | 'cancelled';
 
 }
 
 const StatusIndicator: React.FC<Props> = ({ status }) => {
     const colorClass = status === 'pending' ? 'bg-primary':
                     status === 'processing' ? 'bg-secondary':
-                    status === 'shipped' ? 'bg-green-400':
+                    status === 'shipped' ? 'bg-orange-500':
+                    status === 'cancelled' ? 'bg-red-600':
                     status === 'delivered' ? 'bg-green-400': 'bg-gray-500'
 
     return (
@@ -21,13 +22,14 @@ const StatusIndicator: React.FC<Props> = ({ status }) => {
 interface OrderProps {
     status: 'pending'| 'processing' | 'shipped' | 'delivered',
     orderId: string | number,
+    keyIndex: number,
     expectedDeliveryDate: Date,
     orderDate: Date,
     onViewDetails: (orderId: string | number) => void
 
 }
 
-const Order: React.FC<OrderProps> = ({ orderId, orderDate, expectedDeliveryDate, status, onViewDetails}) => {
+const Order: React.FC<OrderProps> = ({ orderId, orderDate, keyIndex, expectedDeliveryDate, status, onViewDetails}) => {
     const formatDate = (dateString: Date) => {
         const options: Intl.DateTimeFormatOptions = {year: 'numeric', month: 'long', day: 'numeric'};
         const date = new Date(dateString);
@@ -40,7 +42,7 @@ const Order: React.FC<OrderProps> = ({ orderId, orderDate, expectedDeliveryDate,
             <div className="flex gap-10">
                 <div>
                 <div className="text-sm text-gray-400">No.</div>
-                <div>{orderId}</div>
+                <div>{keyIndex}</div>
                 </div>
 
                 <div>
@@ -69,7 +71,8 @@ interface Order {
     status: 'pending'| 'processing' | 'shipped' | 'delivered',
     orderId: string,
     expectedDeliveryDate: Date,
-    orderDate: Date
+    orderDate: Date,
+    createdAt: Date,
 }
 
 interface OrderTableProps {
@@ -89,7 +92,8 @@ const OrderTable: React.FC<OrderTableProps> = ({ orders }) => {
                         <Order
                             key={order.orderId} 
                             orderId={order.orderId} 
-                            orderDate= {order.orderDate}
+                            keyIndex={index + 1}
+                            orderDate= {order.createdAt}
                             expectedDeliveryDate={order.expectedDeliveryDate} 
                             status={order.status}
                             onViewDetails={handleViewDetails}

diff --git a/src/Components/orders.tsx b/src/Components/orders.tsx
@@ -2,15 +2,13 @@ import React from "react";
 import OrderTable from "./orderComponent";
 import { useGetAllOrdersQuery } from "../Redux/OrderSlice";
 
-
 interface Order {
     orderId: string;
     orderDate: Date;
     expectedDeliveryDate: Date;
     status: 'pending'| 'processing' | 'shipped' | 'delivered';
 }
 
-
 const OrderComponent = () => {
     function getAuthCookie() {
         const cookies = document.cookie.split(';');
@@ -22,26 +20,27 @@ const OrderComponent = () => {
         }
         return null;
     }
+
     const token = getAuthCookie();
     console.log('token ', token);
-    const {data: orders, isLoading, error} = useGetAllOrdersQuery({ token });
-
-    if(isLoading){
-        return <div>Loading orders...</div>
-    }
-
-    if(error){
-        return <div>Error loading orders</div>
-    }
+    const { data: orders, isLoading, error } = useGetAllOrdersQuery({ token });
 
-    return(
+    return (
         <div className="font-outfit">
             <div className="font-semibold m-10">
                 My Orders
             </div>
-            <OrderTable orders={orders}/>
+            {isLoading ? (
+                <div>Loading orders...</div>
+            ) : error ? (
+                <div>Error loading orders</div>
+            ) : !orders || orders.length === 0 ? (
+                <div>No orders available</div>
+            ) : (
+                <OrderTable orders={orders} />
+            )}
         </div>
-    )
-}
+    );
+};
 
-export default OrderComponent;
+export default OrderComponent;
diff --git a/src/Portal/Seller.tsx b/src/Portal/Seller.tsx
@@ -25,11 +25,10 @@ const Seller = () => {
         <button onClick={handelLogout}>Sign Out</button>
       </div>
       <div className="w-[45%] m-auto mb-40">
-        {/* <SellerSellingReport /> */}
-        {/* <SellerTopProduct />
-        <SellerOrderStatus /> */}
-        <SellerWeeklyReport />
-        <SellerSellingReport />
+      <SellerTopProduct />
+      <SellerOrderStatus />
+        {/* <SellerWeeklyReport />
+        <SellerSellingReport /> */}
       </div>
     </div>
   );

diff --git a/src/Redux/Analytic/SellerAnalytics/SellingReportSlice.tsx b/src/Redux/Analytic/SellerAnalytics/SellingReportSlice.tsx
@@ -48,6 +48,7 @@ export const fetchSellerSellingReport = createAsyncThunk(
 
     const decodedToken = jwtDecode<TokenPayload>(token);
     const vendorId = decodedToken.vendor;
+    console.log(vendorId)
 
     const response = await axios.get(
       `http://localhost:5000/annualSellingReport/${vendorId}`

diff --git a/src/Redux/OrderSlice.tsx b/src/Redux/OrderSlice.tsx
@@ -48,12 +48,5 @@ const OrderApiSlice = apiSlice.injectEndpoints({
   }),
 });
 
-export const {
-  useGetOrderStatusQuery,
-  useGetOrderQuery,
-  useUpdateOrderStatusMutation,
-  useGetUserInfoQuery,
-  useGetAllOrdersQuery,
-  useAllOrdersQuery,
-} = OrderApiSlice;
+export const { useGetOrderStatusQuery, useGetOrderQuery, useUpdateOrderStatusMutation, useGetUserInfoQuery, useGetAllOrdersQuery, useAllOrdersQuery } = OrderApiSlice;
 export default OrderApiSlice;
diff --git a/src/pages/Admin/AdminHome.tsx b/src/pages/Admin/AdminHome.tsx
@@ -5,7 +5,7 @@ import VendorRequestList from "../../Components/dashboard/VendorRequestList";
 import InteractionCard from "../../Components/dashboard/InteractionCard";
 import { useSelectStoresQuery } from "../../Redux/Admin/sellersSlice";
 import { useSelectUsersQuery } from "../../Redux/Admin/usersSlice";
-import { useAllOrdersQuery } from "../../Redux/OrderSlice";
+import { useAllOrdersQuery} from "../../Redux/OrderSlice";
 
 function AdminHome() {
   const { data: sellers = [], refetch: refetchSellers } = useSelectStoresQuery(

diff --git a/src/pages/Analytics.tsx b/src/pages/Analytics.tsx
@@ -9,6 +9,7 @@ import { useSelectUsersQuery } from "../Redux/Admin/usersSlice";
 import { useAllOrdersQuery } from "../Redux/OrderSlice";
 
 const Analytics = () => {
+
   const { data: sellers = [], refetch: refetchSellers } = useSelectStoresQuery(
     {}
   );

diff --git a/src/pages/orderTrackingPage.tsx b/src/pages/orderTrackingPage.tsx
@@ -7,6 +7,7 @@ import Navbar from "../Components/navBar";
 import { getCookie } from "../Components/OrderTracking/authUtils";
 import { useGetOrderQuery, useGetUserInfoQuery } from "../Redux/OrderSlice";
 import { useParams } from "react-router-dom";
+import Header from "../Components/Homepage/Homepage_header";
 
 export const OrderTrackingPage = () => {
   const { orderId } = useParams();
@@ -27,12 +28,12 @@ export const OrderTrackingPage = () => {
 
   const { data: userInfo, error: userInfoError, isLoading: userInfoLoading } = useGetUserInfoQuery({ userId }, { skip: !userId });
 
-  if(orderLoading) return <div>Loading order data...</div>
+
   if(orderError) return <div>Error loading order</div>
   return (
     <>
-      <Navbar />
-      <div className="flex flex-col gap-20 h-screen p-10 lg:p-20">
+      <Header/>
+      <div className="flex flex-col gap-20 h-screen p-10 lg:p-20 mt-20">
         <div className="order-details-container border-b pb-8">
           <OrderDetails orderId={orderId} />
           <OrderStatus orderId={orderId} currentStatus={orderStatus} />
-Original file line number
+Diff line change
@@ Expand Up @@
     import { useAllOrdersQuery } from "../Redux/OrderSlice";
     const Analytics = () => {
       const { data: sellers = [], refetch: refetchSellers } = useSelectStoresQuery(
         {}
       );
@@ Expand Down @@