recalling modified

src/components/sidebar/index.jsx

@@ -24,7 +24,7 @@ function Sidebar() {
             menus.map((menu) => (
               <li>
               <Link
-                className={`flex items-center${url.includes(menu.path) && 'bg-gray-500'} gap-x-3.5 py-2 px-2.5  text-sm text-slate-700 rounded-lg hover:bg-gray-100 `}
+                className={`flex items-center ${url.includes(menu.path) && 'bg-gray-300'} gap-x-3.5 py-2 px-2.5  text-sm text-slate-700 rounded-lg hover:bg-gray-100 `}
                 to={menu.path}
               >
                 <span>{menu.icon}</span>

src/pages/dashboard/index.jsx

@@ -13,7 +13,7 @@ function Dashboard() {
   const { reportees, loading, totalCount, currPage,  pagesCount} = useSelector((state) => state.reportees);
   const userDetails = useSelector((state) => state.userDetails);
   const [reporteIds, setReporteIds] = useState([]);
-  const [inputValue, setInputValue] = useState('');
+  const [inputValue, setInputValue] = useState(null);
 
   //  userDetails.user.reportees || [];
   const handlePageChange = (currPage) => {
@@ -31,11 +31,11 @@ function Dashboard() {
     dispatch(setPagesCount(Math.ceil((totalCount) / (10))))
   }, [totalCount])
 
+
   useEffect(() => {
-    if (reporteIds.length > 0) {
+    if (reporteIds.length > 0 ) {
       const data = {
         reportees: userDetails.user.reportees,
-        // sort: { type: "empId", order: 1 },
         page: currPage,
         perPage: 10
       };
@@ -53,6 +53,7 @@ function Dashboard() {
   }, [userDetails]);
 
   useEffect(() => {
+   if(inputValue!==null){
     const debounceTimeout = setTimeout(() => {
       const data = {
         reportees: userDetails.user.reportees,
@@ -62,8 +63,10 @@ function Dashboard() {
       };
       dispatch(fetchReportees(data));
     }, 1000);
-
     return () => clearTimeout(debounceTimeout);
+   }
+
+    // return () => clearTimeout(debounceTimeout);
   }, [inputValue]);
 
   const handleChange = (event) => {
@@ -122,7 +125,7 @@ function Dashboard() {
          <Table headers={headers} data={reportees} loading={loading} maxHeight={88} />
          
       <div className="">
-        {reportees && (
+        {reportees.length>0 && (
           <div className="flex justify-center mt-2">
             {/* <div className="text-blue-500">Total Results: {pagesCount}</div> */}
             {pagesCount >= 1 && (

src/pages/viewReportee/index.jsx

@@ -12,19 +12,12 @@ import {scoreColor} from '../../utils/commonFunctions';
 function Viewreportee() {
   const dispatch = useDispatch();
   const navigate = useNavigate();
-  const {reportees, viewReportee } = useSelector((state) => state.reportees);
+  const {reportees, viewReportee,currPage } = useSelector((state) => state.reportees);
   const user = useSelector((state) => state.userDetails.user)
   const { reports, loading, error, dutiesReports, initiativeReports } = useSelector((state) => state.reports);
   const [open, setOpen] = useState({ "accordianOne": false, "accordianTwo": false });
 
 
-  /*Example post data
-{
-    "empId":41689,
-    "fromDate":"2024-03-10",
-    "toDate":"2024-03-11"
-}
-*/
   const fetchActivities = (type) => {
     const data ={
       empId:viewReportee?.empId, 
@@ -54,7 +47,7 @@ function Viewreportee() {
     if (user) {
       const data = {
         reportees: user.reportees,
-        page: 1,
+        page: currPage,
         perPage: 10,
       };
       dispatch(fetchReportees(data))
@@ -79,15 +72,15 @@ function Viewreportee() {
   }
 
   useEffect(()=>{
-    if(reportees.length>0 && viewReportee !== null)
+    if(reportees.length>0 && viewReportee !== null )
      dispatch(fetchActivitiesAvg({empId:viewReportee?.empId, types:["duties", "initiative"]}))
-  },[viewReportee])
+  },[reportees,viewReportee])
 
   useEffect(()=>{
-    if(reportees.length){
+    if(reportees.length>0  && viewReportee !== null){
       dispatch(setViewReportee(viewReportee?.empId))
     }
-  },[reportees])
+  },[reportees,viewReportee])
 
 
 
@@ -100,12 +93,11 @@ function Viewreportee() {
     }
   }, []);
 
-  if ( reportees.length && viewReportee)
+  if ( reportees.length && viewReportee!==null)
     return (
       <div className="p-4" >
         <div className="bg-white p-3 rounded-md">
           <div className="flex justify-between">
-            {/* <img src="/generic-male-avatar-rectangular.jpg" width="100px" height="100px" /> */}
             <div className="my-1">
               <p>
                 <span className="font-medium">Employee Name : </span> {viewReportee?.empName}
@@ -113,9 +105,6 @@ function Viewreportee() {
               <p>
                 <span className="font-medium">Designation : </span> {viewReportee?.designation}
               </p>
-              {/* <p>
-              <span className="font-medium">Email Id:  </span> {viewReportee?.empEmail}
-          </p> */}
             </div>
             <div className="my-1">
               <p>
@@ -124,13 +113,6 @@ function Viewreportee() {
               <p>
                 <span className="font-medium">Employee Id:  </span> {viewReportee?.empId}
               </p>
-              {/* <p>
-          <span className="font-medium">Total Score : </span> {viewReportee?.score}
-          </p> */}
-              {/* <p>
-          <span className="font-medium">Allocated To : </span> {viewReportee?.project}
-          </p> */}
-
             </div>
             <div className="flex flex-col justify-center items-center">
               <div className={`w-[40px] h-[40px] rounded-full flex items-center text-white justify-center  ${scoreColor(viewReportee?.score)}`}>
@@ -140,7 +122,6 @@ function Viewreportee() {
                 <span className="text-blue-400 font-semibold">Total Score</span>
               </div>
             </div>
-
           </div>
         </div>
         <div className="">

src/redux/reducers/reporteesSlice.js

@@ -29,7 +29,7 @@ const reporteesSlice = createSlice({
          if(!reportee){
           return {
             ...state,
-            viewReportee: null
+            viewReportee: state.viewReportee
           }
         } else {
           return {