changes tage reponse and changed confirm modal format

This commit is contained in:
pramod mahajan 2025-09-03 16:40:20 +05:30
parent a8239d5c31
commit e66ce11cd5
10 changed files with 246 additions and 284 deletions

View File

@ -198,23 +198,14 @@ const ManageBucket = () => {
return (
<>
{deleteBucket && (
<div
className={`modal fade ${deleteBucket ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: deleteBucket ? "block" : "none",
backgroundColor: deleteBucket ? "rgba(0,0,0,0.5)" : "transparent",
}}
>
<ConfirmModal
type={"delete"}
header={"Delete Bucket"}
message={"Are you sure you want to delete this bucket?"}
onSubmit={handleDeleteContact}
onClose={() => setDeleteBucket(null)}
/>
</div>
<ConfirmModal
isOpen={!!deleteBucket}
type="delete"
header="Delete Bucket"
message="Are you sure you want to delete this bucket?"
onSubmit={handleDeleteContact}
onClose={() => setDeleteBucket(null)}
/>
)}
<div className="container m-0 p-0" style={{ minHeight: "00px" }}>
@ -237,8 +228,9 @@ const ManageBucket = () => {
onChange={(e) => setSearchTerm(e.target.value)}
/>
<i
className={`bx bx-refresh cursor-pointer fs-4 ${loading ? "spin" : ""
}`}
className={`bx bx-refresh cursor-pointer fs-4 ${
loading ? "spin" : ""
}`}
title="Refresh"
onClick={() => refetch()}
/>
@ -247,8 +239,9 @@ const ManageBucket = () => {
<button
type="button"
className={`btn btn-sm btn-primary ms-auto ${action_bucket ? "d-none" : ""
}`}
className={`btn btn-sm btn-primary ms-auto ${
action_bucket ? "d-none" : ""
}`}
onClick={() => {
setAction_bucket(true);
select_bucket(null);
@ -285,16 +278,18 @@ const ManageBucket = () => {
</div>
)}
{!loading && buckets.length > 0 && sortedBucktesList.length === 0 && (
<div className="col-12">
<div
className="d-flex justify-content-center align-items-center py-5 w-100"
style={{ marginLeft: "250px" }}
>
No matching buckets found.
{!loading &&
buckets.length > 0 &&
sortedBucktesList.length === 0 && (
<div className="col-12">
<div
className="d-flex justify-content-center align-items-center py-5 w-100"
style={{ marginLeft: "250px" }}
>
No matching buckets found.
</div>
</div>
</div>
)}
)}
{!loading &&
sortedBucktesList.map((bucket) => (
<div className="col" key={bucket.id}>
@ -305,29 +300,29 @@ const ManageBucket = () => {
{(DirManager ||
DirAdmin ||
bucket?.createdBy?.id ===
profile?.employeeInfo?.id) && (
<div className="d-flex gap-2">
<i
className="bx bx-edit bx-sm text-primary cursor-pointer"
onClick={() => {
select_bucket(bucket);
setAction_bucket(true);
const initialSelectedEmployees = employeesList
.filter((emp) =>
bucket.employeeIds?.includes(
emp.employeeId
)
profile?.employeeInfo?.id) && (
<div className="d-flex gap-2">
<i
className="bx bx-edit bx-sm text-primary cursor-pointer"
onClick={() => {
select_bucket(bucket);
setAction_bucket(true);
const initialSelectedEmployees = employeesList
.filter((emp) =>
bucket.employeeIds?.includes(
emp.employeeId
)
.map((emp) => ({ ...emp, isActive: true }));
setSelectEmployee(initialSelectedEmployees);
}}
></i>
<i
className="bx bx-trash bx-sm text-danger cursor-pointer ms-0"
onClick={() => setDeleteBucket(bucket?.id)}
></i>
</div>
)}
)
.map((emp) => ({ ...emp, isActive: true }));
setSelectEmployee(initialSelectedEmployees);
}}
></i>
<i
className="bx bx-trash bx-sm text-danger cursor-pointer ms-0"
onClick={() => setDeleteBucket(bucket?.id)}
></i>
</div>
)}
</h6>
<h6 className="card-subtitle mb-2 text-muted text-start">
Contacts:{" "}

View File

@ -33,7 +33,10 @@ const NoteCardDirectoryEditable = ({
note: editorValue,
contactId,
};
const response = await DirectoryRepository.UpdateNote(noteItem.id, payload);
const response = await DirectoryRepository.UpdateNote(
noteItem.id,
payload
);
const cachedContactProfile = getCachedData("Contact Profile");
if (cachedContactProfile?.contactId === contactId) {
@ -75,9 +78,9 @@ const NoteCardDirectoryEditable = ({
const contactProfile = (contactId) => {
DirectoryRepository.GetContactProfile(contactId).then((res) => {
setOpen_contact(res?.data);
setIsOpenModalNote(true);
});
setOpen_contact(res?.data);
setIsOpenModalNote(true);
});
};
const handleRestore = async () => {
@ -95,7 +98,6 @@ const NoteCardDirectoryEditable = ({
return (
<>
{isOpenModalNote && (
<GlobalModel
isOpen={isOpenModalNote}
@ -125,7 +127,6 @@ const NoteCardDirectoryEditable = ({
{/* Header */}
<div className="d-flex justify-content-between align-items-center mb-1">
<div className="d-flex align-items-center">
<Avatar
size="xxs"
firstName={noteItem?.createdBy?.firstName}
@ -133,30 +134,36 @@ const NoteCardDirectoryEditable = ({
className="m-0"
/>
<div>
<div className="d-flex ms-0 align-middle cursor-pointer" onClick={() =>contactProfile(noteItem.contactId)}>
<div
className="d-flex ms-0 align-middle cursor-pointer"
onClick={() => contactProfile(noteItem.contactId)}
>
<span>
<span className="fw-bold "> {noteItem?.contactName} </span> <span className="text-muted font-weight-normal">
<span className="fw-bold "> {noteItem?.contactName} </span>{" "}
<span className="text-muted font-weight-normal">
({noteItem?.organizationName})
</span>
</span>
</div>
<div className="d-flex ms-0 align-middle">
</div>
<div className="d-flex ms-0 align-middle"></div>
<div className="d-flex ms-0 mt-2">
<span className="text-muted">
by <span className="fw-bold "> {noteItem?.createdBy?.firstName} {noteItem?.createdBy?.lastName} </span>
&nbsp; <span className="text-muted">
on {moment
by{" "}
<span className="fw-bold ">
{" "}
{noteItem?.createdBy?.firstName}{" "}
{noteItem?.createdBy?.lastName}{" "}
</span>
&nbsp;{" "}
<span className="text-muted">
on{" "}
{moment
.utc(noteItem?.createdAt)
.add(5, "hours")
.add(30, "minutes")
.format("DD MMMM, YYYY [at] hh:mm A")}
</span>
</span>
</div>
</div>
</div>
@ -228,26 +235,16 @@ const NoteCardDirectoryEditable = ({
{/* Delete Confirm Modal */}
{isDeleteModalOpen && (
<div
className={`modal fade ${isDeleteModalOpen ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: isDeleteModalOpen ? "block" : "none",
backgroundColor: "rgba(0,0,0,0.5)",
}}
aria-hidden="false"
>
<ConfirmModal
type={"delete"}
header={"Delete Note"}
message={"Are you sure you want to delete this note?"}
onSubmit={suspendEmployee}
onClose={() => setIsDeleteModalOpen(false)}
loading={isDeleting}
paramData={noteItem}
/>
</div>
<ConfirmModal
isOpen={isDeleteModalOpen}
type="delete"
header="Delete Note"
message="Are you sure you want to delete this note?"
onSubmit={suspendEmployee}
onClose={() => setIsDeleteModalOpen(false)}
loading={isDeleting}
paramData={noteItem}
/>
)}
</>
);

View File

@ -156,23 +156,16 @@ const DocumentsList = ({
return (
<>
{IsDeleteModalOpen && (
<div
className="modal fade show"
tabIndex="-1"
role="dialog"
style={{ display: "block", backgroundColor: "rgba(0,0,0,0.5)" }}
aria-hidden="false"
>
<ConfirmModal
type="delete"
header="Delete Document"
message="Are you sure you want delete?"
onSubmit={handleDelete}
onClose={() => setIsDeleteModalOpen(false)}
loading={!!isPending}
paramData={deletingId}
/>
</div>
<ConfirmModal
isOpen={IsDeleteModalOpen}
type="delete"
header="Delete Document"
message="Are you sure you want to delete this document?"
onSubmit={handleDelete}
onClose={() => setIsDeleteModalOpen(false)}
loading={!!isPending}
paramData={deletingId}
/>
)}
<div className="table-responsive">

View File

@ -4,4 +4,4 @@ const EmployeeList = () => {
return <div>EmployeeList</div>;
};
export default EmployeeList;
export default EmployeeList;

View File

@ -110,8 +110,9 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
label: "Submitted By",
align: "text-start",
getValue: (e) =>
`${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""}`.trim() ||
"N/A",
`${e.createdBy?.firstName ?? ""} ${
e.createdBy?.lastName ?? ""
}`.trim() || "N/A",
customRender: (e) => (
<div className="d-flex align-items-center">
<Avatar
@ -185,26 +186,16 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
return (
<>
{IsDeleteModalOpen && (
<div
className={`modal fade show`}
tabIndex="-1"
role="dialog"
style={{
display: "block",
backgroundColor: "rgba(0,0,0,0.5)",
}}
aria-hidden="false"
>
<ConfirmModal
type="delete"
header="Delete Expense"
message="Are you sure you want delete?"
onSubmit={handleDelete}
onClose={() => setIsDeleteModalOpen(false)}
loading={isPending}
paramData={deletingId}
/>
</div>
<ConfirmModal
isOpen={IsDeleteModalOpen}
type="delete"
header="Delete Expense"
message="Are you sure you want delete?"
onSubmit={handleDelete}
onClose={() => setIsDeleteModalOpen(false)}
loading={isPending}
paramData={deletingId}
/>
)}
<div className="card px-0 px-sm-4">

View File

@ -32,8 +32,8 @@ const WorkItem = ({
forWorkArea,
deleteHandleTask,
}) => {
const projectId = useSelector((store)=>store.localVariables.projectId)
const isTaskPlanning = /^\/activities\/task$/.test(location.pathname);
const projectId = useSelector((store) => store.localVariables.projectId);
const isTaskPlanning = /^\/activities\/task$/.test(location.pathname);
const [itemName, setItemName] = useState("");
const [NewWorkItem, setNewWorkItem] = useState();
@ -135,25 +135,15 @@ const isTaskPlanning = /^\/activities\/task$/.test(location.pathname);
)}
{showModal2 && (
<div
className={`modal fade ${showModal2 ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: showModal2 ? "block" : "none",
backgroundColor: showModal2 ? "rgba(0,0,0,0.5)" : "transparent",
}}
aria-hidden="false"
>
<ConfirmModal
type={"delete"}
header={"Delete Activity"}
message={"Are you sure you want delete?"}
onSubmit={handleSubmit}
onClose={closeModalDelete}
loading={loadingDelete}
/>
</div>
<ConfirmModal
isOpen={showModal2}
type="delete"
header="Delete Activity"
message="Are you sure you want delete?"
onSubmit={handleSubmit}
onClose={closeModalDelete}
loading={isPending}
/>
)}
<tr key={NewWorkItem?.workItemId}>
@ -240,9 +230,7 @@ const isTaskPlanning = /^\/activities\/task$/.test(location.pathname);
</td>
{(ManageInfra ||
(
ManageAndAssignTak &&
PlannedWork !== CompletedWork)) && (
(ManageAndAssignTak && PlannedWork !== CompletedWork)) && (
<td className="text-end align-items-middle border-top">
{/* Desktop (md and up): inline icons */}
<div className="d-none d-md-flex justify-content-end gap-1 px-2">

View File

@ -249,26 +249,15 @@ const Teams = () => {
</div>
{IsDeleteModal && (
<div
className={`modal fade ${IsDeleteModal ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: IsDeleteModal ? "block" : "none",
backgroundColor: IsDeleteModal ? "rgba(0,0,0,0.5)" : "transparent",
}}
aria-hidden="false"
>
<ConfirmModal
type={"delete"}
header={"Removed Employee"}
message={"Are you sure you want delete?"}
onSubmit={removeAllocation}
onClose={closeDeleteModal}
loading={isPending}
paramData={deleteEmployee}
/>
</div>
<ConfirmModal
isOpen={IsDeleteModal}
type="delete"
header="Removed Employee"
message="Are you sure you want delete?"
onSubmit={() => removeAllocation(deleteEmployee)}
onClose={closeDeleteModal}
loading={isPending}
/>
)}
<div className="card card-action mb-6">

View File

@ -3,13 +3,15 @@ import { useFormContext } from "react-hook-form";
const TagInput = ({ label, name, placeholder, color = "#e9ecef", options = [] }) => {
const { setValue, watch } = useFormContext();
const tags = watch(name) || [];
const tags = watch(name) || [];
const [input, setInput] = useState("");
const [suggestions, setSuggestions] = useState([]);
const handleAdd = (newTag) => {
if (!tags.some((t) => t.name === newTag)) {
setValue(name, [...tags, { name: newTag, isActive: true }], { shouldValidate: true });
const tagObj = typeof newTag === "string" ? { name: newTag, isActive: true } : newTag;
if (!tags.some((t) => t.name === tagObj.name)) {
setValue(name, [...tags, tagObj], { shouldValidate: true });
}
};
@ -30,26 +32,32 @@ const TagInput = ({ label, name, placeholder, color = "#e9ecef", options = [] })
}
};
const handleChange = (e) => {
const val = e.target.value;
setInput(val);
if (val) {
setSuggestions(
options
.filter(
(opt) =>
opt.toLowerCase().includes(val.toLowerCase()) &&
!tags.some((t) => t.name === opt)
)
.map((s) => ({ name: s, isActive: true }))
);
} else {
setSuggestions([]);
}
};
const handleChange = (e) => {
const val = e.target.value;
setInput(val);
if (val) {
setSuggestions(
options
.filter((opt) => {
const label = typeof opt === "string" ? opt : opt.name;
return (
label.toLowerCase().includes(val.toLowerCase()) &&
!tags.some((t) => t.name === label)
);
})
.map((opt) => ({
name: typeof opt === "string" ? opt : opt.name,
isActive: true,
}))
);
} else {
setSuggestions([]);
}
};
const handleSuggestionClick = (sugg) => {
handleAdd(sugg.name);
handleAdd(sugg);
setInput("");
setSuggestions([]);
};
@ -60,7 +68,10 @@ const TagInput = ({ label, name, placeholder, color = "#e9ecef", options = [] })
{label}
</label>
<div className="form-control form-control-sm p-1" style={{ minHeight: "38px", position: "relative" }}>
<div
className="form-control form-control-sm p-1"
style={{ minHeight: "38px", position: "relative" }}
>
<div className="d-flex flex-wrap align-items-center gap-1">
{tags.map((tag, index) => (
<span
@ -104,7 +115,6 @@ const TagInput = ({ label, name, placeholder, color = "#e9ecef", options = [] })
zIndex: 1000,
maxHeight: "150px",
overflowY: "auto",
boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.2)",
borderRadius: "3px",
border: "1px solid #ddd",
}}
@ -127,4 +137,5 @@ const TagInput = ({ label, name, placeholder, color = "#e9ecef", options = [] })
};
export default TagInput;

View File

@ -301,25 +301,15 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
</GlobalModel>
)}
{deleteContact && (
<div
className={`modal fade ${deleteContact ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: deleteContact ? "block" : "none",
backgroundColor: deleteContact ? "rgba(0,0,0,0.5)" : "transparent",
}}
aria-hidden="false"
>
<ConfirmModal
type={"delete"}
header={"Delete Contact"}
message={"Are you sure you want delete?"}
onSubmit={handleDeleteContact}
onClose={() => setDeleteContact(null)}
loading={IsDeleting}
/>
</div>
<ConfirmModal
isOpen={!!deleteContact}
type="delete"
header="Delete Contact"
message="Are you sure you want delete?"
onSubmit={handleDeleteContact}
onClose={() => setDeleteContact(null)}
loading={IsDeleting}
/>
)}
{openBucketModal && (
@ -383,12 +373,14 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
{/* Empty state AFTER list */}
{!loading && contacts?.length === 0 && (
<p className="mt-3 ms-3 text-muted" >No contact found</p>
<p className="mt-3 ms-3 text-muted">No contact found</p>
)}
{!loading &&
contacts?.length > 0 &&
currentItems.length === 0 && (
<p className="mt-3 ms-3 text-muted">No matching contact found</p>
<p className="mt-3 ms-3 text-muted">
No matching contact found
</p>
)}
</div>
</div>
@ -419,11 +411,9 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
{!loading && contacts?.length === 0 && (
<p className="mt-3 ms-3 text-muted">No contact found</p>
)}
{!loading &&
contacts?.length > 0 &&
currentItems.length === 0 && (
<p className="mt-3 ms-3 text-muted">No matching contact found</p>
)}
{!loading && contacts?.length > 0 && currentItems.length === 0 && (
<p className="mt-3 ms-3 text-muted">No matching contact found</p>
)}
</div>
)}
@ -446,7 +436,9 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
currentItems.length > ITEMS_PER_PAGE && (
<nav aria-label="Page navigation">
<ul className="pagination pagination-sm justify-content-end py-1">
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
<li
className={`page-item ${currentPage === 1 ? "disabled" : ""}`}
>
<button
className="page-link btn-xs"
onClick={() => paginate(currentPage - 1)}
@ -458,8 +450,9 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
{[...Array(totalPages)].map((_, index) => (
<li
key={index}
className={`page-item ${currentPage === index + 1 ? "active" : ""
}`}
className={`page-item ${
currentPage === index + 1 ? "active" : ""
}`}
>
<button
className="page-link"
@ -471,8 +464,9 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
))}
<li
className={`page-item ${currentPage === totalPages ? "disabled" : ""
}`}
className={`page-item ${
currentPage === totalPages ? "disabled" : ""
}`}
>
<button
className="page-link"
@ -489,4 +483,4 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
);
};
export default Directory;
export default Directory;

View File

@ -177,10 +177,12 @@ const EmployeeList = () => {
useEffect(() => {
if (!loading && Array.isArray(employees)) {
const sorted = [...employees].sort((a, b) => {
const nameA = `${a.firstName || ""}${a.middleName || ""}${a.lastName || ""
}`.toLowerCase();
const nameB = `${b.firstName || ""}${b.middleName || ""}${b.lastName || ""
}`.toLowerCase();
const nameA = `${a.firstName || ""}${a.middleName || ""}${
a.lastName || ""
}`.toLowerCase();
const nameB = `${b.firstName || ""}${b.middleName || ""}${
b.lastName || ""
}`.toLowerCase();
return nameA?.localeCompare(nameB);
});
@ -259,37 +261,26 @@ const EmployeeList = () => {
)}
{IsDeleteModalOpen && (
<div
className={`modal fade ${IsDeleteModalOpen ? "show" : ""}`}
tabIndex="-1"
role="dialog"
style={{
display: IsDeleteModalOpen ? "block" : "none",
backgroundColor: IsDeleteModalOpen
? "rgba(0,0,0,0.5)"
: "transparent",
}}
aria-hidden="false"
>
<ConfirmModal
type={"delete"}
header={
selectedEmpFordelete?.isActive
? "Suspend Employee"
: "Reactivate Employee"
}
message={`Are you sure you want to ${selectedEmpFordelete?.isActive ? "suspend" : "reactivate"
} this employee?`}
onSubmit={() =>
suspendEmployee({
employeeId: selectedEmpFordelete.id,
active: !selectedEmpFordelete.isActive,
})
}
onClose={() => setIsDeleteModalOpen(false)}
loading={employeeLodaing}
/>
</div>
<ConfirmModal
isOpen={IsDeleteModalOpen}
type="delete"
header={
selectedEmpFordelete?.isActive
? "Suspend Employee"
: "Reactivate Employee"
}
message={`Are you sure you want to ${
selectedEmpFordelete?.isActive ? "suspend" : "reactivate"
} this employee?`}
onSubmit={() =>
suspendEmployee({
employeeId: selectedEmpFordelete.id,
active: !selectedEmpFordelete.isActive,
})
}
onClose={() => setIsDeleteModalOpen(false)}
loading={employeeLodaing}
/>
)}
<div className="container-fluid">
@ -511,8 +502,9 @@ const EmployeeList = () => {
Status
</th>
<th
className={`sorting_disabled ${!Manage_Employee && "d-none"
}`}
className={`sorting_disabled ${
!Manage_Employee && "d-none"
}`}
rowSpan="1"
colSpan="1"
style={{ width: "50px" }}
@ -532,9 +524,9 @@ const EmployeeList = () => {
)}
{/* Conditional messages for no data or no search results */}
{!loading &&
displayData?.length === 0 &&
searchText &&
!showAllEmployees ? (
displayData?.length === 0 &&
searchText &&
!showAllEmployees ? (
<tr>
<td colSpan={8}>
<small className="muted">
@ -544,8 +536,8 @@ const EmployeeList = () => {
</tr>
) : null}
{!loading &&
displayData?.length === 0 &&
(!searchText || showAllEmployees) ? (
displayData?.length === 0 &&
(!searchText || showAllEmployees) ? (
<tr>
<td
colSpan={8}
@ -639,7 +631,9 @@ const EmployeeList = () => {
<div className="dropdown-menu dropdown-menu-end">
{/* View always visible */}
<button
onClick={() => navigate(`/employee/${item.id}`)}
onClick={() =>
navigate(`/employee/${item.id}`)
}
className="dropdown-item py-1"
>
<i className="bx bx-detail bx-sm"></i> View
@ -650,9 +644,12 @@ const EmployeeList = () => {
<>
<button
className="dropdown-item py-1"
onClick={() => handleEmployeeModel(item.id)}
onClick={() =>
handleEmployeeModel(item.id)
}
>
<i className="bx bx-edit bx-sm"></i> Edit
<i className="bx bx-edit bx-sm"></i>{" "}
Edit
</button>
{/* Suspend only when active */}
@ -661,7 +658,8 @@ const EmployeeList = () => {
className="dropdown-item py-1"
onClick={() => handleOpenDelete(item)}
>
<i className="bx bx-task-x bx-sm"></i> Suspend
<i className="bx bx-task-x bx-sm"></i>{" "}
Suspend
</button>
)}
@ -670,11 +668,13 @@ const EmployeeList = () => {
type="button"
data-bs-toggle="modal"
data-bs-target="#managerole-modal"
onClick={() => setEmpForManageRole(item.id)}
onClick={() =>
setEmpForManageRole(item.id)
}
>
<i className="bx bx-cog bx-sm"></i> Manage Role
<i className="bx bx-cog bx-sm"></i>{" "}
Manage Role
</button>
</>
)}
@ -684,7 +684,8 @@ const EmployeeList = () => {
className="dropdown-item py-1"
onClick={() => handleOpenDelete(item)}
>
<i className="bx bx-refresh bx-sm me-1"></i> Re-activate
<i className="bx bx-refresh bx-sm me-1"></i>{" "}
Re-activate
</button>
)}
</div>
@ -703,8 +704,9 @@ const EmployeeList = () => {
<nav aria-label="Page">
<ul className="pagination pagination-sm justify-content-end py-1">
<li
className={`page-item ${currentPage === 1 ? "disabled" : ""
}`}
className={`page-item ${
currentPage === 1 ? "disabled" : ""
}`}
>
<button
className="page-link btn-xs"
@ -717,8 +719,9 @@ const EmployeeList = () => {
{[...Array(totalPages)]?.map((_, index) => (
<li
key={index}
className={`page-item ${currentPage === index + 1 ? "active" : ""
}`}
className={`page-item ${
currentPage === index + 1 ? "active" : ""
}`}
>
<button
className="page-link"
@ -730,8 +733,9 @@ const EmployeeList = () => {
))}
<li
className={`page-item ${currentPage === totalPages ? "disabled" : ""
}`}
className={`page-item ${
currentPage === totalPages ? "disabled" : ""
}`}
>
<button
className="page-link"