Merge branch 'banners-on-job' of WrenchBoard/Users-Wrench into master

src/components/MyActiveJobs/MyActiveJobTable.jsx

@@ -4,6 +4,7 @@ import dataImage2 from "../../assets/images/data-table-user-2.png";
 import { handlePagingFunc } from "../Pagination/HandlePagination";
 import PaginatedList from "../Pagination/PaginatedList";
 import { PriceFormatter } from "../Helpers/PriceFormatter";
+import localImgLoad from "../../lib/localImgLoad";
 
 export default function MyActiveJobTable({ MyJobList, className }) {
   const navigate = useNavigate();
@@ -58,7 +59,7 @@ export default function MyActiveJobTable({ MyJobList, className }) {
                             <div className="flex space-x-2 items-center w-full">
                               <div className="w-full h-[60px] rounded-full overflow-hidden flex justify-center items-center flex-[0.1] max-w-[60px]">
                                 <img
-                                  src={dataImage2}
+                                  src={localImgLoad(`images/taskbanners/${value.banner}`)}
                                   alt="data"
                                   className="w-full h-full"
                                 />

src/components/MyJobs/MyJobTable.jsx

@@ -13,6 +13,7 @@ import { PriceFormatter } from "../Helpers/PriceFormatter";
 
 import EditIcon from '../../assets/images/icon-edit.svg'
 import DeleteIcon from '../../assets/images/icon-delete.svg'
+import localImgLoad from "../../lib/localImgLoad";
 
 export default function MyJobTable({ MyJobList, reloadJobList, className }) {
   // Getting the categories
@@ -115,7 +116,7 @@ export default function MyJobTable({ MyJobList, reloadJobList, className }) {
           <div className="sm:flex sm:space-x-2 sm:justify-between sm:items-center job-items">
             <div className="flex space-x-2 items-center job-items w-full">
               <div className="w-full h-[60px] rounded-full overflow-hidden flex justify-center items-center flex-[0.1] min-w-[60px] max-w-[60px]">
-                <img src={dataImage2} alt="data" className="w-full h-full" />
+                <img src={localImgLoad(`images/taskbanners/${value.banner}`)} alt="data" className="w-full h-full" />
               </div>
               <div className="flex flex-col flex-[0.9]">
                 <h1 className="font-bold text-xl text-dark-gray dark:text-white">

src/components/MyPendingJobs/MyPendingJobTable.jsx

@@ -4,6 +4,7 @@ import { handlePagingFunc } from "../Pagination/HandlePagination";
 import PaginatedList from "../Pagination/PaginatedList";
 import PendingJobsPopout from "../jobPopout/PendingJobsPopout";
 import { PriceFormatter } from "../Helpers/PriceFormatter";
+import localImgLoad from "../../lib/localImgLoad";
 
 export default function MyPendingJobTable({ MyJobList, className }) {
   let [jobPopout, setJobPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
@@ -57,7 +58,7 @@ export default function MyPendingJobTable({ MyJobList, className }) {
                             <div className="flex space-x-2 items-center w-full">
                               <div className="w-full h-[60px] rounded-full overflow-hidden flex justify-center items-center flex-[0.1] max-w-[60px]">
                                 <img
-                                  src={dataImage2}
+                                  src={localImgLoad(`images/taskbanners/${value.banner}`)}
                                   alt="data"
                                   className="w-full h-full"
                                 />