diff --git a/src/components/MyActiveJobs/ActiveJobs.jsx b/src/components/MyActiveJobs/ActiveJobs.jsx
index 867462b..f06110e 100644
--- a/src/components/MyActiveJobs/ActiveJobs.jsx
+++ b/src/components/MyActiveJobs/ActiveJobs.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useRef, forwardRef } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import { useSelector } from "react-redux";
 import Layout from "../Partials/Layout";
 import { useNavigate } from "react-router-dom";
diff --git a/src/components/MyCoupons/CouponPopup.jsx b/src/components/MyCoupons/CouponPopup.jsx
index f76c407..4c34f50 100644
--- a/src/components/MyCoupons/CouponPopup.jsx
+++ b/src/components/MyCoupons/CouponPopup.jsx
@@ -8,30 +8,33 @@ const CouponPopup = ({ popUpHandler, data }) => {
 
   const redeemCouponHandler = async () => {
     setLoader(true);
-    
+
     try {
       const { code, coupon_id } = data;
       const reqData = { code_id: Number(coupon_id), code };
 
       const res = await apiCall.getCouponRedeem(reqData);
-      if(res.statusText === "OK") {
+      if (res.statusText === "OK") {
         toast.success("Great news! Your coupon has been redeemed.", {
           autoClose: 3000,
           hideProgressBar: true,
         });
       }
-      
-      popUpHandler();
-      setLoader(false);
+
+      setTimeout(() => {
+        popUpHandler();
+        setLoader(false);
+      }, 3000);
       throw new Response(res);
     } catch (error) {
-      error &&
-        toast.warn("An error occurred while processing your coupon.", {
-          autoClose: 3000,
-          hideProgressBar: true,
-        });
+      // error &&
+      //   toast.warn("An error occurred while processing your coupon.", {
+      //     autoClose: 3000,
+      //     hideProgressBar: true,
+      //   });
       setLoader(false);
-      console.log(error)
+      console.log(error);
+      return;
       // throw new Error(error);
     }
   };
@@ -82,7 +85,7 @@ const CouponPopup = ({ popUpHandler, data }) => {
             <button
               type="button"
               onClick={redeemCouponHandler}
-              className="text-white btn-gradient text-lg tracking-wide px-6 py-2 rounded-full"
+              className="text-white lg:w-[167px] btn-gradient flex justify-center items-center text-lg tracking-wide px-6 py-2 rounded-full"
             >
               {loader ? (
                 <div className="signup btn-loader"></div>
diff --git a/src/components/MyPendingJobs/MyPendingJobTable.jsx b/src/components/MyPendingJobs/MyPendingJobTable.jsx
index d7e6a03..e807d21 100644
--- a/src/components/MyPendingJobs/MyPendingJobTable.jsx
+++ b/src/components/MyPendingJobs/MyPendingJobTable.jsx
@@ -1,13 +1,10 @@
 import React, { useState } from "react";
 import dataImage2 from "../../assets/images/data-table-user-2.png";
 import PendingJobsPopout from "../jobPopout/PendingJobsPopout";
-
 import { handlePagingFunc } from "../Pagination/HandlePagination";
 import PaginatedList from "../Pagination/PaginatedList";
 
 export default function MyPendingJobTable({ MyJobList, className }) {
-  const filterCategories = ["All Categories", "Explore", "Featured"];
-  const [selectedCategory, setCategory] = useState(filterCategories[0]);
   let [jobPopout, setJobPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
 
   const [currentPage, setCurrentPage] = useState(0);
@@ -24,26 +21,28 @@ export default function MyPendingJobTable({ MyJobList, className }) {
   };
 
   return (
-      <div
-        className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
-          className || ""
-        }`}
-      >
-        {MyJobList && MyJobList?.result_list && (
-          <div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
-            <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
-              <tbody>
-                {/*<tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29]  default-border-b dark:border-[#5356fb29] ottom ">*/}
-                {/*    <td className="py-4">All Product</td>*/}
-                {/*    <td className="py-4 text-right">.</td>*/}
-                {/*</tr>*/}
+    <div
+      className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
+        className || ""
+      }`}
+    >
+      {MyJobList && MyJobList?.result_list && (
+        <div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
+          <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
+            <tbody>
+              {/*<tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29]  default-border-b dark:border-[#5356fb29] ottom ">*/}
+              {/*    <td className="py-4">All Product</td>*/}
+              {/*    <td className="py-4 text-right">.</td>*/}
+              {/*</tr>*/}
 
-                {
-                  <>
-                    {MyJobList &&
-                      MyJobList?.result_list &&
-                      MyJobList.result_list.length > 0 ?
-                      currentActiveJobList.map((value, index) => (
+              {
+                <>
+                  {MyJobList &&
+                  MyJobList?.result_list &&
+                  MyJobList.result_list.length > 0 ? (
+                    currentActiveJobList.map((value, index) => {
+                      let deliveryDate = value?.expire?.split(" ")[0];
+                      return (
                         <tr
                           key={index}
                           className="bg-white dark:bg-dark-white   border-b dark:border-[#5356fb29]  hover:bg-gray-50"
@@ -68,31 +67,33 @@ export default function MyPendingJobTable({ MyJobList, className }) {
                                     {value.price * 0.01}
                                   </span>
                                 </span>
-                                <span className="text-sm text-thin-light-gray">
-                                  Duration:{" "}
-                                  <span className="text-purple">
-                                    {" "}
-                                    {value.timeline_days} day(s)
+                                <div className="flex items-center gap-4">
+                                  <span className="text-sm text-thin-light-gray">
+                                    Duration:{" "}
+                                    <span className="text-purple">
+                                      {" "}
+                                      {value.timeline_days} day(s)
+                                    </span>
                                   </span>
-                                </span>
-                                <span className="text-sm text-thin-light-gray">
-                                  Expire:{" "}
-                                  <span className="text-purple">
-                                    {" "}
-                                    {value.expire}
+                                  <span className="text-sm text-thin-light-gray">
+                                    Expire:{" "}
+                                    <span className="text-purple">
+                                      {" "}
+                                      {deliveryDate}
+                                    </span>
                                   </span>
-                                </span>
-                                <span className="text-sm text-thin-light-gray">
-                                  Send to:{" "}
-                                  <span className="text-purple">
-                                    {" "}
-                                    {value.job_to}
+                                  <span className="text-sm text-thin-light-gray">
+                                    Send to:{" "}
+                                    <span className="text-purple">
+                                      {" "}
+                                      {value.job_to}
+                                    </span>
                                   </span>
-                                </span>
+                                </div>
                               </div>
                             </div>
                           </td>
-
+  
                           <td className="text-right py-4 px-2">
                             <button
                               type="button"
@@ -105,47 +106,46 @@ export default function MyPendingJobTable({ MyJobList, className }) {
                             </button>
                           </td>
                         </tr>
-                      ))
-                    :
+                      )
+                    })
+                  ) : (
                     <tr className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
-                      <td className="p-2">
-                        No Pending Task!
-                      </td>
+                      <td className="p-2">No Pending Task!</td>
                     </tr>
-                    }
-                  </>
-                }
-              </tbody>
-            </table>
-            {/* PAGINATION BUTTON */}
-            <PaginatedList
-              onClick={handlePagination}
-              prev={currentPage == 0 ? true : false}
-              next={
-                currentPage + Number(process.env.REACT_APP_ITEM_PER_PAGE) >=
-                MyJobList?.result_list.length
-                  ? true
-                  : false
+                  )}
+                </>
               }
-              data={MyJobList?.result_list}
-              start={indexOfFirstItem}
-              stop={indexOfLastItem}
-            />
-            {/* END OF PAGINATION BUTTON */}
-          </div>
-        )}
-
-        {/* Active Job Popout */}
-        {jobPopout.show && (
-          <PendingJobsPopout
-            details={jobPopout.data}
-            onClose={() => {
-              setJobPopout({ show: false, data: {} });
-            }}
-            situation={jobPopout.show}
+            </tbody>
+          </table>
+          {/* PAGINATION BUTTON */}
+          <PaginatedList
+            onClick={handlePagination}
+            prev={currentPage == 0 ? true : false}
+            next={
+              currentPage + Number(process.env.REACT_APP_ITEM_PER_PAGE) >=
+              MyJobList?.result_list.length
+                ? true
+                : false
+            }
+            data={MyJobList?.result_list}
+            start={indexOfFirstItem}
+            stop={indexOfLastItem}
           />
-        )}
-        {/* End of Active Job Popout */}
-      </div>
+          {/* END OF PAGINATION BUTTON */}
+        </div>
+      )}
+
+      {/* Active Job Popout */}
+      {jobPopout.show && (
+        <PendingJobsPopout
+          details={jobPopout.data}
+          onClose={() => {
+            setJobPopout({ show: false, data: {} });
+          }}
+          situation={jobPopout.show}
+        />
+      )}
+      {/* End of Active Job Popout */}
+    </div>
   );
 }
diff --git a/src/components/MyTasks/MyJobTable.jsx b/src/components/MyTasks/MyJobTable.jsx
index a7c7ed6..604c47e 100644
--- a/src/components/MyTasks/MyJobTable.jsx
+++ b/src/components/MyTasks/MyJobTable.jsx
@@ -85,6 +85,7 @@ export default function MyJobTable({ className, ActiveJobList }) {
                           {Number(task?.price) * 0.01}
                         </span>
                       </span>
+                      
                       <span className="text-sm text-thin-light-gray">
                         Duration:
                         <span className="text-purple ml-1">
diff --git a/src/views/MyPendingJobsPage.jsx b/src/views/MyPendingJobsPage.jsx
index 5c1458a..9830f34 100644
--- a/src/views/MyPendingJobsPage.jsx
+++ b/src/views/MyPendingJobsPage.jsx
@@ -1,34 +1,32 @@
-import React, { useContext,useState, useEffect } from "react";
+import React, { useContext, useState, useEffect } from "react";
 import usersService from "../services/UsersService";
-//import MyJobs from "../components/MyJobs";
-import MyActiveJobs from "../components/MyActiveJobs";
 import MyPendingJobs from "../components/MyPendingJobs";
 import { useSelector } from "react-redux";
 
 export default function MyPendingJobsPage() {
-    let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
-    const [MyJobList, setMyJobList] = useState([]);
-    const api = new usersService();
+  let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
+  const [MyJobList, setMyJobList] = useState([]);
+  const api = new usersService();
 
-    const getMyJobList = async () => {
-        try {
-            const res = await api.getMyPendingJobList();
-            setMyJobList(res.data);
-        } catch (error) {
-            console.log("Error getting mode");
-        }
-    };
-    useEffect(() => {
-        getMyJobList();
-    }, []);
+  const getMyJobList = async () => {
+    try {
+      const res = await api.getMyPendingJobList();
+      setMyJobList(res.data);
+    } catch (error) {
+      console.log("Error getting mode");
+    }
+  };
+  useEffect(() => {
+    getMyJobList();
+  }, []);
 
-    // debugger;
-    return (
-        <>
-            <MyPendingJobs
-                MyJobList={MyJobList}
-                commonHeadData={commonHeadBanner.result_list}
-            />
-        </>
-    );
+  // debugger;
+  return (
+    <>
+      <MyPendingJobs
+        MyJobList={MyJobList}
+        commonHeadData={commonHeadBanner.result_list}
+      />
+    </>
+  );
 }