import React, { useState, useEffect, useMemo, useCallback } from "react"; import { Button, Card, CardBody, Col, Container, Form, Row } from "react-bootstrap"; import BreadCrumb from "../../../../Components/Common/BreadCrumb"; import { ToastContainer } from "react-toastify"; import { useDispatch, useSelector } from "react-redux"; import { createSelector } from "reselect"; import AddEditJobCandidateList from "../../../../Components/Common/AddEditJobCandidateList"; import Pagination from "../../../../Components/Common/Pagination"; import { Head, Link} from "@inertiajs/react"; import { ongetCandidateList } from "../../../../slices/thunk"; import Layout from "../../../../Layouts"; import { jobCandidates } from "../../../../common/data/appsJobs"; const CandidateList = () => { const dispatch: any = useDispatch(); const selectJobList = createSelector( (state: any) => state.Jobs, (job: any) => ({ candidatelist: job.candidatelist, }) ); // Inside your component const {candidatelist}: any = useSelector(selectJobList); useEffect(() => { dispatch(ongetCandidateList()); }, [dispatch]); //add modal state const [modal, setModal] = useState(false); const handleAddModal = useCallback(() => { setModal(!modal); setEditItem(null); }, [modal]); const handleShow = () => setModal(true) const [editItem, setEditItem] = useState(); useEffect(() => { setCalendarList(candidatelist) }, [dispatch,candidatelist]) const [isBookmarkClick, setIsBookmarkClick] = useState(false); const sortbyname = [ { label: "All", value: "All" }, { label: "Today", value: "Today" }, { label: "Yesterday", value: "Yesterday" }, { label: "Last 7 Days", value: "Last 7 Days" }, { label: "Last 30 Days", value: "Last 30 Days" }, { label: "Thise Month", value: "Thise Month" }, { label: "Last Year", value: "Last Year" }, ]; // const [candidateData, setCandidateData] = useState([]); const [calendarList, setCalendarList] = useState(); const [currentPage, setCurrentPage] = useState(1); //pagination const perPageData = 8; const indexOfLast = currentPage * perPageData; const indexOfFirst = indexOfLast - perPageData; const currentdata = useMemo(() => jobCandidates?.slice(indexOfFirst, indexOfLast), [indexOfFirst, indexOfLast]) useEffect(() => { setCalendarList(currentdata) }, [currentdata]); // search const handleSearch = (ele: any) => { let item = ele.value; if (item === "All Tasks") { setCalendarList([...candidatelist]); } else { handleSearchData({ data: candidatelist, item: item, setState: setCalendarList }) } } const handleSearchData = ({ data, item, setState }: any) => { setState( data.filter((search: any) => Object.values(search).some( (field) => typeof field === 'string' && field.toLowerCase().includes(item?.toLowerCase()), ) ) ) } return (
handleSearch(e.target)} />
{(calendarList || []).map((item: any, key: any) => (
{item.nickname ? (
{item.nickname}
) : (
)}
{item.candidateName}

{item.designation}

{" "} {item.location}
{" "} {item.type === "Part Time" ? {item.type} : item.type === "Full Time" ? {item.type} : {item.type} }
{item.rating1}
{item.rating2}k Ratings
View Details { e.preventDefault(); setIsBookmarkClick(!isBookmarkClick) }} className={isBookmarkClick ? "btn btn-ghost-danger btn-icon custom-toggle active" : "btn btn-ghost-danger btn-icon custom-toggle"} > {!isBookmarkClick ? : }
))}
); }; CandidateList.layout = (page: any) => export default CandidateList;