optimized to prevented for maximum deep rendering
This commit is contained in:
parent
ce37d5f447
commit
2c4ad2ba4a
@ -25,12 +25,13 @@ const ProjectList = () => {
|
|||||||
const { profile: loginUser } = useProfile();
|
const { profile: loginUser } = useProfile();
|
||||||
const [listView, setListView] = useState(false);
|
const [listView, setListView] = useState(false);
|
||||||
const [showModal, setShowModal] = useState(false);
|
const [showModal, setShowModal] = useState(false);
|
||||||
|
|
||||||
const { projects, loading, error, refetch } = useProjects();
|
const { projects, loading, error, refetch } = useProjects();
|
||||||
const [projectList, setProjectList] = useState([]);
|
const [projectList, setProjectList] = useState([]);
|
||||||
|
|
||||||
const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
|
const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
|
||||||
const [HasManageProject, setHasManageProject] = useState(
|
const [HasManageProject, setHasManageProject] = useState(HasManageProjectPermission);
|
||||||
HasManageProjectPermission
|
|
||||||
);
|
|
||||||
const { mutate: createProject } = useCreateProject({
|
const { mutate: createProject } = useCreateProject({
|
||||||
onSuccessCallback: () => {
|
onSuccessCallback: () => {
|
||||||
setShowModal(false);
|
setShowModal(false);
|
||||||
@ -62,32 +63,32 @@ const ProjectList = () => {
|
|||||||
.filter((statusId) => grouped[statusId])
|
.filter((statusId) => grouped[statusId])
|
||||||
.flatMap((statusId) =>
|
.flatMap((statusId) =>
|
||||||
grouped[statusId].sort((a, b) =>
|
grouped[statusId].sort((a, b) =>
|
||||||
a.name.toLowerCase()?.localeCompare(b.name.toLowerCase())
|
a.name.toLowerCase().localeCompare(b.name.toLowerCase())
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
setProjectList(sortedGrouped);
|
|
||||||
|
setProjectList((prev) => {
|
||||||
|
const isSame = JSON.stringify(prev) === JSON.stringify(sortedGrouped);
|
||||||
|
return isSame ? prev : sortedGrouped;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (!loading && projects) {
|
||||||
sortingProject(projects);
|
sortingProject(projects);
|
||||||
}, [projects, loginUser?.projects, loading]);
|
}
|
||||||
|
}, [projects, loading, selectedStatuses]); // Include selectedStatuses if it changes filtering
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (loginUser) {
|
setHasManageProject(loginUser ? HasManageProjectPermission : false);
|
||||||
setHasManageProject(HasManageProjectPermission);
|
|
||||||
} else {
|
|
||||||
setHasManageProject(false);
|
|
||||||
}
|
|
||||||
}, [loginUser, HasManageProjectPermission]);
|
}, [loginUser, HasManageProjectPermission]);
|
||||||
|
|
||||||
|
const handleSubmitForm = (newProject, setLoading, reset) => {
|
||||||
|
setLoading(true);
|
||||||
const handleSubmitForm = (newProject, setloading, reset) => {
|
|
||||||
setloading(true);
|
|
||||||
createProject(newProject, {
|
createProject(newProject, {
|
||||||
onSettled: () => {
|
onSettled: () => {
|
||||||
setloading(false);
|
setLoading(false);
|
||||||
reset();
|
reset();
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@ -114,10 +115,14 @@ const ProjectList = () => {
|
|||||||
return matchesStatus && matchesSearch;
|
return matchesStatus && matchesSearch;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const totalPages = Math.ceil(filteredProjects.length / ITEMS_PER_PAGE);
|
||||||
|
|
||||||
const totalPages = Math.ceil( filteredProjects.length / ITEMS_PER_PAGE );
|
const {
|
||||||
|
currentItems,
|
||||||
const {currentItems,currentPage,paginate,setCurrentPage} = usePagination(filteredProjects, ITEMS_PER_PAGE)
|
currentPage,
|
||||||
|
paginate,
|
||||||
|
setCurrentPage,
|
||||||
|
} = usePagination(filteredProjects, ITEMS_PER_PAGE);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const tooltipTriggerList = Array.from(
|
const tooltipTriggerList = Array.from(
|
||||||
@ -126,8 +131,6 @@ const ProjectList = () => {
|
|||||||
tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
|
tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user