Merge pull request #3401 from OneCommunityGlobal/Koushica_hotfix_BellNotification

Koushica - Hotfix  - bell notification

Author: one-community

src/actions/dashboardActions.js

@@ -1,4 +1,5 @@
 export const INCREMENT_DASHBOARD_TASK_COUNT = 'INCREMENT_DASHBOARD_TASK_COUNT';
+export const UPDATE_SUMMARY_BAR_DATA = 'UPDATE_SUMMARY_BAR_DATA'
 
 export const incrementDashboardTaskCount = (taskId) => {
   console.log(`Dispatching incrementDashboardTaskCount for task ID: ${taskId}`);
@@ -7,3 +8,11 @@ export const incrementDashboardTaskCount = (taskId) => {
     payload: { taskId },
   };
 };
+
+export const updateSummaryBarData = ({summaryBarData}) => {
+  console.log(summaryBarData);
+  return {
+    type: UPDATE_SUMMARY_BAR_DATA,
+    payload: { summaryBarData },
+  };
+};

src/components/Dashboard/Dashboard.jsx

@@ -15,6 +15,8 @@ import {
   DEV_ADMIN_ACCOUNT_CUSTOM_WARNING_MESSAGE_DEV_ENV_ONLY,
   PROTECTED_ACCOUNT_MODIFICATION_WARNING_MESSAGE,
 } from 'utils/constants';
+import { useDispatch } from 'react-redux';
+import { updateSummaryBarData } from 'actions/dashboardActions';
 
 export function Dashboard(props) {
   const [popup, setPopup] = useState(false);
@@ -27,6 +29,8 @@ export function Dashboard(props) {
   const isNotAllowedToEdit = cantUpdateDevAdminDetails(viewingUser?.email, authUser.email);
   const darkMode = useSelector(state => state.theme.darkMode);
 
+  const dispatch = useDispatch();
+
   const toggle = (forceOpen = null) => {
     if (isNotAllowedToEdit) {
       const warningMessage =
@@ -61,6 +65,11 @@ export function Dashboard(props) {
     };
   }, []);
 
+  useEffect(()=>{
+    console.log(summaryBarData)
+    dispatch(updateSummaryBarData({summaryBarData}));
+  },[summaryBarData])
+
   return (
     <Container fluid className={darkMode ? 'bg-oxford-blue' : ''}>
       <SummaryBar

src/components/Header/BellNotification.jsx

@@ -2,7 +2,7 @@
 import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
 import { useSelector } from 'react-redux';
 
-export default function BellNotification() {
+export default function BellNotification({userId}) {
   // State variables to manage notifications and UI state
   const [hasNotification, setHasNotification] = useState(false);
   const [isDataReady, setIsDataReady] = useState(false);
@@ -13,7 +13,13 @@ export default function BellNotification() {
   const timeEntries = useSelector(state => state.timeEntries?.weeks?.[0] || []);
   const weeklycommittedHours = useSelector(state => state.userProfile?.weeklycommittedHours || 0);
   const darkMode = useSelector(state => state.theme.darkMode);
-  const userId = useSelector(state => state.auth.user?.userid);
+  // const userId = useSelector(state => {
+  //   console.log(state.auth)
+  //   return state.auth.user?.userid});
+  // const checkSessionStorage = () => JSON.parse(sessionStorage.getItem('viewingUser')) ?? false;
+  // const [viewingUser, setViewingUser] = useState(checkSessionStorage);
+  // const [displayUserId, setDisplayUserId] = useState( viewingUser?.userId || userId);
+  
 
   /**
    * Memoized function to calculate the total effort (hours + minutes) logged by the user
@@ -127,6 +133,10 @@ export default function BellNotification() {
     };
   }, []);
 
+  useEffect(() => {
+    setIsDataReady(false);
+  },[userId])
+
   /**
    * Utility function to format time values in hours and minutes
    */

src/components/Header/Header.jsx

@@ -441,7 +441,7 @@ export function Header(props) {
                   </NavItem>
                 )}
                 <NavItem className="responsive-spacing">
-                  <BellNotification />
+                  <BellNotification userId={displayUserId}/>
                 </NavItem>
                 {(canAccessUserManagement ||
                   canAccessBadgeManagement ||

src/components/UserManagement/UserSearchPanel.jsx

@@ -76,8 +76,9 @@ function UserSearchPanel({
         {CREATE_NEW_USER}
       </button>
 
-      <div className="input-group-prepend" style={{marginRight: "5px"}}>
+      <div className="input-group-prepend">
         <span className={`input-group-text ${darkMode ? 'bg-yinmn-blue text-light' : ''}`}>{SEARCH}</span>
+      </div>
       <input
         // autoFocus
         type="text"
@@ -89,8 +90,8 @@ function UserSearchPanel({
         onChange={e => {
           onSearch(e.target.value);
         }}
+        style={{marginRight: "5px"}}
       />
-      </div>
       <div className="input-group-prepend">
         <span className={`input-group-text ${darkMode ? 'bg-yinmn-blue text-light' : ''}`}>{SHOW}</span>
         <select

src/reducers/dashboardReducer.js

@@ -1,7 +1,11 @@
-import { INCREMENT_DASHBOARD_TASK_COUNT } from '../actions/dashboardActions';
+import {
+  INCREMENT_DASHBOARD_TASK_COUNT,
+  UPDATE_SUMMARY_BAR_DATA,
+} from '../actions/dashboardActions';
 
 const initialState = {
   taskCounts: {},
+  summaryBarData: {},
 };
 
 // eslint-disable-next-line default-param-last
@@ -20,6 +24,14 @@ const dashboardReducer = (state = initialState, action) => {
         },
       };
     }
+    case UPDATE_SUMMARY_BAR_DATA: {
+      // Wrap case block in braces to avoid scoping issues
+      const { summaryBarData } = action.payload;
+      return {
+        ...state,
+        summaryBarData,
+      };
+    }
     default: {
       return state;
     }