Implemented signalr for action assigning employee to project

src/components/Activities/InfraPlanning.jsx

@@ -19,7 +19,7 @@ import InfraTable from "../Project/Infrastructure/InfraTable";
 
 const InfraPlanning = () =>
 {
-  const {profile: LoggedUser} = useProfile()
+  const {profile: LoggedUser, refetch : fetchData} = useProfile()
   const dispatch = useDispatch()
   const {projects,loading:project_listLoader,error:projects_error} = useProjects()
 

src/components/Layout/Header.jsx

@@ -1,5 +1,5 @@
 import getGreetingMessage from "../../utils/greetingHandler";
-import { clearAllCache } from "../../slices/apiDataManager";
+import { cacheData, clearAllCache, getCachedData } from "../../slices/apiDataManager";
 import AuthRepository from "../../repositories/AuthRepository";
 import { useDispatch, useSelector } from "react-redux";
 import { changeMaster, setProjectId } from "../../slices/localVariablesSlice";
@@ -9,8 +9,9 @@ import { useLocation, useNavigate, useParams } from "react-router-dom";
 import Avatar from "../../components/common/Avatar";
 import { useChangePassword } from "../Context/ChangePasswordContext";
 import { useProjects } from "../../hooks/useProjects";
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { useProjectName } from "../../hooks/useProjects";
+import eventBus from "../../services/eventBus";
 
 const Header = () => {
   const { profile } = useProfile();
@@ -64,7 +65,7 @@ const Header = () => {
     navigate(`/employee/${profile?.employeeInfo?.id}?for=attendance`);
   };
   // const { projects, loading: projectLoading } = useProjects();
-  const { projectNames, loading: projectLoading } = useProjectName();
+  const { projectNames, loading: projectLoading, fetchData } = useProjectName();
 
   const selectedProject = useSelector(
     (store) => store.localVariables.projectId
@@ -85,7 +86,11 @@ const Header = () => {
 
   const { openChangePassword } = useChangePassword();
   useEffect(() => {
-    if (projectNames && selectedProject !== " ") {
+    if (
+      projectNames &&
+      selectedProject !== " " &&
+      !getCachedData("hasReceived")
+    ) {
       dispatch(setProjectId(projectNames[0]?.id));
     }
   }, [projectNames]);
@@ -93,6 +98,24 @@ const Header = () => {
   /** Check if current page id project details page */
   const isProjectPath = /^\/projects\/[a-f0-9-]{36}$/.test(location.pathname);
 
+  const handler = useCallback(
+    async (data) => {
+      
+      await fetchData();
+      const projectExist = data.projectIds.some(
+      (item) => item == selectedProject
+    );
+      if(projectExist){
+        cacheData("hasReceived",false)
+      }
+    },
+    [fetchData]
+  );
+
+  useEffect(() => {
+    eventBus.on("assign_project_one", handler);
+    return () => eventBus.off("assign_project_one", handler);
+  }, [handler]);
   return (
     <nav
       className="layout-navbar container-xxl navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"

src/components/Project/ProjectCard.jsx

@@ -25,6 +25,7 @@ const ProjectCard = ({ projectData, recall }) => {
   useEffect(()=>{
     setProjectInfo(projectData);
   },[projectData])
+  // console.log("in card view",projectInfo);
   const handleShow = async () => {
     try {
       setMdifyProjectLoading(true);

src/hooks/useProfile.js

@@ -1,9 +1,11 @@
-import {useState,useEffect} from "react";
+import {useState,useEffect, useCallback} from "react";
 import AuthRepository from "../repositories/AuthRepository";
-import {cacheProfileData, getCachedProfileData} from "../slices/apiDataManager";
+import {cacheData, cacheProfileData, getCachedData, getCachedProfileData} from "../slices/apiDataManager";
 import {useSelector} from "react-redux";
+import eventBus from "../services/eventBus";
 
 let hasFetched = false;
+let hasReceived = false;
 
 export const useProfile = () => {
   const loggedUser = useSelector( ( store ) => store.globalVariables.loginUser );
@@ -24,7 +26,7 @@ export const useProfile = () => {
     }
   };
 
-  useEffect(() => {
+  const validation = () => {
     if (!hasFetched) {
       hasFetched = true;
       if (!loggedUser) {
@@ -35,8 +37,26 @@ export const useProfile = () => {
     }
   
       setProfile(loggedUser);
-  
+  }
+
+  useEffect(() => {
+    validation();
   }, [loggedUser]);
 
+  const handler = useCallback(
+    (data) => {
+      if(!getCachedData("hasReceived")){
+        cacheData("hasReceived", true);
+      hasFetched = false;
+      validation();
+      }
+    },[]
+  );
+
+  useEffect(() => {
+    eventBus.on("assign_project_one", handler);
+    return () => eventBus.off("assign_project_one", handler);
+  }, [handler]);
+
   return { profile, loading, error };
 };

src/hooks/useProjects.js

@@ -1,10 +1,11 @@
-import { useEffect, useState } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { cacheData, getCachedData } from "../slices/apiDataManager";
 import ProjectRepository from "../repositories/ProjectRepository";
 import { useProfile } from "./useProfile";
 import { useDispatch, useSelector } from "react-redux";
 import { setProjectId } from "../slices/localVariablesSlice";
 import EmployeeList from "../components/Directory/EmployeeList";
+import eventBus from "../services/eventBus";
 
 export const useProjects = () => {
   const loggedUser = useSelector((store) => store.globalVariables.loginUser);
@@ -190,5 +191,5 @@ export const useProjectName = () => {
     fetchData();
   }, []);
 
-  return { projectNames, loading, Error };
+  return { projectNames, loading, Error, fetchData };
 };

src/pages/project/ProjectList.jsx

@@ -6,7 +6,7 @@ import ProjectRepository from "../../repositories/ProjectRepository";
 import { useProjects } from "../../hooks/useProjects";
 import { useDispatch } from "react-redux";
 import showToast from "../../services/toastService";
-import { getCachedData, cacheData } from "../../slices/apiDataManager";
+import { getCachedData, cacheData, clearCacheKey } from "../../slices/apiDataManager";
 import { useHasUserPermission } from "../../hooks/useHasUserPermission";
 import { useProfile } from "../../hooks/useProfile";
 import { ITEMS_PER_PAGE, MANAGE_PROJECT } from "../../utils/constants";
@@ -55,7 +55,6 @@ const ProjectList = () => {
             a.name.toLowerCase().localeCompare(b.name.toLowerCase())
           )
         );
-
       setProjectList(sortedGrouped);
     }
   };
@@ -157,6 +156,21 @@ const ProjectList = () => {
     return () => eventBus.off("project", handler);
   }, [handler]);
 
+  const assignProjectHandler = useCallback(
+    async (data) => {
+      clearCacheKey("projectslist");
+      await refetch();
+      
+        sortingProject(projects);
+    },
+    [refetch]
+  );
+
+  useEffect(() => {
+    eventBus.on("assign_project_one", assignProjectHandler);
+    return () => eventBus.off("assign_project_one", assignProjectHandler);
+  }, [handler]);
+
   return (
     <>
       <div

src/services/signalRService.js

@@ -1,5 +1,5 @@
 import * as signalR from "@microsoft/signalr";
-import { clearCacheKey, getCachedData } from "../slices/apiDataManager";
+import { cacheData, clearCacheKey, getCachedData } from "../slices/apiDataManager";
 import showToast from "./toastService";
 import eventBus from "./eventBus";
 import { useSelector } from "react-redux";
@@ -48,17 +48,23 @@ export function startSignalR(loggedUser) {
         eventBus.emit("attendance_log", data);
       }
     }
-        // if create or update project
+    // if create or update project
     if (data.keyword == "Create_Project" || data.keyword == "Update_Project") {
       clearCacheKey("projectslist");
       eventBus.emit("project", data);
     }
     // if assign or deassign employee to any project
     if (data.keyword == "Assign_Project") {
-      
-      if(data.employeeList.some((item) => item === loggedUser?.employeeInfo.id)){
-        console.log("in one employee")
-        eventBus.emit("assign_project_one", data);
+      if (
+        data.employeeList.some((item) => item === loggedUser?.employeeInfo.id)
+      ) {
+        try {
+          cacheData("hasReceived", false);
+          eventBus.emit("assign_project_one", data);
+        } catch (e) {
+          console.error("Error in cacheData:", e);
+        }
+        
       }
       eventBus.emit("assign_project_all", data);
     }