optimized to prevented for maximum deep rendering

This commit is contained in:
Pramod Mahajan 2025-07-08 13:30:11 +05:30
parent ce37d5f447
commit 2c4ad2ba4a

View File

@ -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);
@ -43,7 +44,7 @@ const ProjectList = () => {
"603e994b-a27f-4e5d-a251-f3d69b0498ba", "603e994b-a27f-4e5d-a251-f3d69b0498ba",
"ef1c356e-0fe0-42df-a5d3-8daee355492d", "ef1c356e-0fe0-42df-a5d3-8daee355492d",
"cdad86aa-8a56-4ff4-b633-9c629057dfef", "cdad86aa-8a56-4ff4-b633-9c629057dfef",
"33deaef9-9af1-4f2a-b443-681ea0d04f81", "33deaef9-9af1-4f2a-b443-681ea0d04f81",
]); ]);
const handleShow = () => setShowModal(true); const handleShow = () => setShowModal(true);
@ -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(() => {
sortingProject(projects); if (!loading && projects) {
}, [projects, loginUser?.projects, loading]); sortingProject(projects);
}
}, [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,11 +115,15 @@ 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,
currentPage,
paginate,
setCurrentPage,
} = usePagination(filteredProjects, ITEMS_PER_PAGE);
const {currentItems,currentPage,paginate,setCurrentPage} = usePagination(filteredProjects, ITEMS_PER_PAGE)
useEffect(() => { useEffect(() => {
const tooltipTriggerList = Array.from( const tooltipTriggerList = Array.from(
document.querySelectorAll('[data-bs-toggle="tooltip"]') document.querySelectorAll('[data-bs-toggle="tooltip"]')
@ -126,8 +131,6 @@ const ProjectList = () => {
tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el)); tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
}, []); }, []);
return ( return (
<> <>