Caregiver Job List - Copy this React, Tailwind Component to your project

Desing-CaregiverJobList-page-using-aos-and-styling-will-have-a-header-Your-Jobthen-global-search-for-one-fousing-job-title,location,-job-type-and-the-other-search-is-for-salary-,-then-filter-for-expereincelevel-then-list-of-job-cards-each-card-will-have-application-job-title,-,-job-description,-salary,position,location,jobType,ex[erenice-level,client-name,-and-apply-button-.-the-main-thing-here-is-to-care-giver-to-apply-job-so-on-the-right-side-with-better-styling-and-color-#CE257A-for-button-and-and-it-have-nned-a-paggination-on-list-it-need-to-show-only-5-cards-paggination-with-nu,ber,next,orevother-header-my-ocde-is-/*-eslint-disable-no-unused-vars-*/-import-React,-{-useContext,-useEffect-}-from-"react";-import-{-CareGiverContext-}-from-"../../context/CareGiverContext";-const-CaregiverJobList-=-()-=>-{-const-{-jobs,-applyToJob-}-=-useContext(CareGiverContext);-useEffect(()-=>-{-//console.log(jobs);-//-Log-jobs-to-ensure-they're-fetched-},-[jobs]);-return-(-<div>-{jobs-&&-jobs.length->-0-?-(-jobs.map(-(job)-=>-//-Check-if-the-job-status-is-not-'closed'-job.status-!==-"closed"-&&-(-<div-key={job._id}>-<h3>{job.title}</h3>-<p>{job.description}</p>-<button-onClick={()-=>-applyToJob(job._id)}>Apply</button>-</div>-)-)-)-:-(-<p>No-jobs-available.</p>-)}-</div>-);-};-export-default-CaregiverJobList;