changed project selection routing

src/components/Layout/Header.jsx

@@ -29,7 +29,8 @@ const Header = () => {
   const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
 
     const isDirectoryPath = /^\/directory$/.test(location.pathname);
-    const isDashboard = /^\/dashboard$/.test(location.pathname);
+    const isProjectPath = /^\/projects$/.test(location.pathname);
+    const isDashboard = /^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname) ;
   const getRole = (roles, joRoleId) => {
     if (!Array.isArray(roles)) return "User";
     let role = roles.find((role) => role.id === joRoleId);
@@ -159,6 +160,15 @@ const Header = () => {
     };
   }, [handler, newProjectHandler]);
 
+  const handleProjectChange =(project)=>{
+    if(isProjectPath){
+     dispatch(setProjectId(project))
+     navigate("/projects/details")
+    } else{
+      dispatch(setProjectId(project))
+    }
+  }
+
   return (
     <nav
       className="layout-navbar container-fluid mb-3 navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
@@ -212,7 +222,7 @@ const Header = () => {
                       <li key={project?.id}>
                         <button
                           className="dropdown-item"
-                          onClick={() => dispatch(setProjectId(project?.id))}
+                          onClick={()=>handleProjectChange(project?.id)}
                         >
                           {project?.name}
                           {project?.shortName && (

src/pages/project/ProjectList.jsx

@@ -22,16 +22,20 @@ const ProjectList = () => {
   const { profile: loginUser } = useProfile();
   const [listView, setListView] = useState(false);
   const [showModal, setShowModal] = useState(false);
-  const selectedProject = useSelector((store)=>store.localVariables.projectId)
+  const selectedProject = useSelector(
-  const dispatch = useDispatch()
+    (store) => store.localVariables.projectId
+  );
+  const dispatch = useDispatch();
 
   const { projects, loading, error, refetch } = useProjects();
   const [projectList, setProjectList] = useState([]);
 
   const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
-  const [HasManageProject, setHasManageProject] = useState(HasManageProjectPermission);
+  const [HasManageProject, setHasManageProject] = useState(
+    HasManageProjectPermission
+  );
 
-  const { mutate: createProject,isPending } = useCreateProject({
+  const { mutate: createProject, isPending } = useCreateProject({
     onSuccessCallback: () => {
       setShowModal(false);
     },
@@ -48,7 +52,9 @@ const ProjectList = () => {
 
   const handleShow = () => setShowModal(true);
   const handleClose = () => setShowModal(false);
-
+  useEffect(() => {
+    dispatch(setProjectId(null));
+  }, []);
   const sortingProject = (projects) => {
     if (!loading && Array.isArray(projects)) {
       const grouped = {};
@@ -74,14 +80,10 @@ const ProjectList = () => {
   };
 
   useEffect(() => {
-   if(selectedProject == null){
-       dispatch(setProjectId(projects[0]?.id));
-   }
-
     if (!loading && projects) {
       sortingProject(projects);
     }
-  }, [projects, loading, selectedStatuses]); 
+  }, [projects, loading, selectedStatuses]);
 
   useEffect(() => {
     setHasManageProject(loginUser ? HasManageProjectPermission : false);
@@ -114,12 +116,10 @@ const ProjectList = () => {
 
   const totalPages = Math.ceil(filteredProjects.length / ITEMS_PER_PAGE);
 
-  const {
+  const { currentItems, currentPage, paginate, setCurrentPage } = usePagination(
-    currentItems,
+    filteredProjects,
-    currentPage,
+    ITEMS_PER_PAGE
-    paginate,
+  );
-    setCurrentPage,
-  } = usePagination(filteredProjects, ITEMS_PER_PAGE);
 
   useEffect(() => {
     const tooltipTriggerList = Array.from(
@@ -130,17 +130,16 @@ const ProjectList = () => {
 
   return (
     <>
-    
       {showModal && (
-         <GlobalModel isOpen={showModal} closeModal={handleClose}>
+        <GlobalModel isOpen={showModal} closeModal={handleClose}>
-         <ManageProjectInfo
+          <ManageProjectInfo
-          project={null}
+            project={null}
-          handleSubmitForm={handleSubmitForm}
+            handleSubmitForm={handleSubmitForm}
-          onClose={handleClose}
+            onClose={handleClose}
-          isPending={isPending}
+            isPending={isPending}
-        />
+          />
-      </GlobalModel>
+        </GlobalModel>
-     )}
+      )}
 
       <div className="container-fluid">
         <Breadcrumb
@@ -211,7 +210,7 @@ const ProjectList = () => {
                       },
                       {
                         id: "cdad86aa-8a56-4ff4-b633-9c629057dfef",
-                        label:"In Progress"
+                        label: "In Progress",
                       },
                       {
                         id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
@@ -269,11 +268,14 @@ const ProjectList = () => {
         {listView ? (
           <div className="card cursor-pointer">
             <div className="card-body p-2">
-              <div className="table-responsive text-nowrap py-2 " style={{minHeight:"400px"}}>
+              <div
+                className="table-responsive text-nowrap py-2 "
+                style={{ minHeight: "400px" }}
+              >
                 <table className="table m-3">
                   <thead>
                     <tr>
-                      <th className="text-start" colSpan={5} >
+                      <th className="text-start" colSpan={5}>
                         Project Name
                       </th>
                       <th className="mx-2 text-start">Contact Person</th>
@@ -298,8 +300,8 @@ const ProjectList = () => {
                               },
                               {
                                 id: "cdad86aa-8a56-4ff4-b633-9c629057dfef",
-                                label:"In Progress"
+                                label: "In Progress",
-                               },
+                              },
                               {
                                 id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
                                 label: "On Hold",
@@ -342,7 +344,11 @@ const ProjectList = () => {
                   <tbody className="table-border-bottom-0 overflow-auto ">
                     {currentItems.length === 0 ? (
                       <tr className="text-center">
-                        <td colSpan="12" rowSpan='12'style={{height:"200px"}} >
+                        <td
+                          colSpan="12"
+                          rowSpan="12"
+                          style={{ height: "200px" }}
+                        >
                           No projects found
                         </td>
                       </tr>