show delete spinner only for the employee being removed

This commit is contained in:
Pramod Mahajan 2025-05-04 18:50:53 +05:30
parent b3906f460e
commit 294c13878d

View File

@ -18,9 +18,10 @@ const Teams = ({ project }) => {
const [isModalOpen, setIsModelOpen] = useState(false);
const [error, setError] = useState("");
const [empJobRoles, setEmpJobRoles] = useState(null);
const [clearFormTrigger, setClearFormTrigger] = useState(false);
const [employees, setEmployees] = useState([]);
const [filteredEmployees, setFilteredEmployees] = useState([]);
const [ removingEmployeeId, setRemovingEmployeeId ] = useState( null );
const [assignedLoading,setAssignedLoading]= useState(false)
const HasAssignUserPermission = useHasUserPermission(ASSIGN_TO_PROJECT);
@ -45,8 +46,9 @@ const Teams = ({ project }) => {
ProjectRepository.manageProjectAllocation(items)
.then((response) => {
showToast("Details updated successfully.", "success");
setClearFormTrigger(true);
fetchEmployees();
setRemovingEmployeeId( null );
setAssignedLoading(false)
})
.catch((error) => {
showToast(error.message, "error");
@ -54,6 +56,7 @@ const Teams = ({ project }) => {
};
const removeAllocation = (item) => {
setRemovingEmployeeId(item.id);
submitAllocations([
{
empID: item.employeeId,
@ -134,13 +137,13 @@ const Teams = ({ project }) => {
aria-hidden="true"
>
<MapUsers
projectId={project.id}
projectId={project?.id}
onClose={onModelClose}
empJobRoles={empJobRoles}
onSubmit={handleEmpAlicationFormSubmit}
allocation={employees}
clearTrigger={clearFormTrigger}
onClearComplete={() => setClearFormTrigger(false)}
assignedLoading={assignedLoading}
setAssignedLoading={setAssignedLoading}
></MapUsers>
</div>
@ -247,7 +250,13 @@ const Teams = ({ project }) => {
onClick={() => removeAllocation(item)}
>
{" "}
<i className="bx bx-trash me-1 text-danger"></i>{" "}
{removingEmployeeId === item.id ? <div
class="spinner-border spinner-border-sm text-primary"
role="status"
>
<span class="visually-hidden">Loading...</span>
</div>:<i className="bx bx-trash me-1 text-danger"></i>}
</button>
)}
{!item.isActive && <span>Not in project</span>}
@ -267,4 +276,3 @@ const Teams = ({ project }) => {
};
export default Teams;