victorAnumudu
60 lines
2.3 KiB
React
60 lines
2.3 KiB
React
import React, {useState} from 'react'
|
|
|
|
import PaginatedList from '../../Pagination/PaginatedList';
|
|
import {handlePagingFunc} from '../../Pagination/HandlePagination';
|
|
|
|
function ReferralTable({history}) {
|
|
|
|
const [currentPage, setCurrentPage] = useState(0);
|
|
const indexOfFirstItem = Number(currentPage);
|
|
const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
|
const currentReferral = history?.data?.slice(indexOfFirstItem, indexOfLastItem);
|
|
|
|
const handlePagination = (e) => {
|
|
handlePagingFunc(e,setCurrentPage)
|
|
}
|
|
|
|
return (
|
|
<div className='flex flex-col justify-between h-full'>
|
|
<table className="referral-list w-full table-auto border-collapse text-left">
|
|
<thead className='border-b-2'>
|
|
<tr className='text-slate-600'>
|
|
<th className="p-3">Added/Name</th>
|
|
<th className="p-3">Email</th>
|
|
<th className="p-3">Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{history.data.length ?
|
|
currentReferral.map((item, index) => (
|
|
<tr key={index} className='text-slate-500'>
|
|
<td className="p-3">{item.added_date} / {item.firstname} {item.lastname}</td>
|
|
<td className="p-3">{item.email}</td>
|
|
<td className="p-3">{item.status}</td>
|
|
</tr>
|
|
))
|
|
:
|
|
(
|
|
history.error ?
|
|
<tr className='text-slate-500'>
|
|
<td colSpan={3}>Opps! couldn't get referral history. Try reloading the page</td>
|
|
</tr>
|
|
:
|
|
(
|
|
<tr className='text-slate-500'>
|
|
<td colSpan={3}>No Item Found on referral List</td>
|
|
</tr>
|
|
)
|
|
)
|
|
}
|
|
</tbody>
|
|
</table>
|
|
|
|
{/* PAGINATION BUTTON */}
|
|
<PaginatedList onClick={handlePagination} prev={currentPage == 0 ? true : false} next={currentPage+Number(process.env.REACT_APP_ITEM_PER_PAGE) >= history?.data?.length ? true : false} data={history?.data} start={indexOfFirstItem} stop={indexOfLastItem} />
|
|
{/* END OF PAGINATION BUTTON */}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ReferralTable |