error msg modified

src/components/leftSidebar/index.jsx

@@ -15,19 +15,19 @@ function LeftSidebar() {
 
 
   useEffect(() => {
-   if(inputValue!==null){
-    const debounceTimeout = setTimeout(() => {
-      const data = {
-        reportees: userDetails.user.reportees,
-        page: (inputValue==="")?currPage:1,
-        perPage: 10,
-        searchText:inputValue
-      };
-      dispatch(fetchReportees(data));
-    }, 1000);
-    return () => clearTimeout(debounceTimeout);
-  }
- 
+    if (inputValue !== null) {
+      const debounceTimeout = setTimeout(() => {
+        const data = {
+          reportees: userDetails.user.reportees,
+          page: (inputValue === "") ? currPage : 1,
+          perPage: 10,
+          searchText: inputValue
+        };
+        dispatch(fetchReportees(data));
+      }, 1000);
+      return () => clearTimeout(debounceTimeout);
+    }
+
   }, [inputValue]);
 
   const handleChange = (event) => {
@@ -53,46 +53,49 @@ function LeftSidebar() {
     <div className=" w-[33%] flex flex-col px-[5px]">
       <div className="  flex mt-3 items-center justify-between">
         <p className="text-xl text-blue-400 font-semibold pl-4">
-        Reportees
+          Reportees
         </p>
-        <input 
+        <input
           placeholder="Search"
-          type="text" 
+          type="text"
           className="p-2  border rounded w-[160px] placeholder:text-[14px]"
-          value={inputValue} 
-          onChange={handleChange} 
+          value={inputValue}
+          onChange={handleChange}
         />
       </div>
       {
         (loading) ? <Loading /> :
           <div className="p-2 bg-[#E9EDEE] mt-4 max-h-[70vh] overflow-auto">
-            {reportees?.map(({ empName, score, empId }) => (
+            {(reportees.length) ? reportees?.map(({ empName, score, empId }) => (
               <button onClick={() => dispatch(setViewReportee(empId))}
                 // to={`/viewreportee`}
                 className={`flex items-center hover:bg-blue-400 hover:text-white  bg-${viewReportee?.empId == empId ? "blue-400 text-white" : "white"
                   } p-2 justify-between mb-1 w-full`}
                 key={empId}
               >
-                
-                  <p className="w-[80%] text-left">{empName}</p>
-                  <p className={`w-[30px] h-[30px] rounded-full flex items-center text-white justify-center ${scoreColor(score)}`}>
-                    {score}
-                  </p>
-                </button>
-              
-            ))}
+
+                <p className="w-[80%] text-left">{empName}</p>
+                <p className={`w-[30px] h-[30px] rounded-full flex items-center text-white justify-center ${scoreColor(score)}`}>
+                  {score}
+                </p>
+              </button>
+
+            )) : <div className="w-full h-full">
+              <p className="text-center align-middle  text-blue-500  font-bold">No Records Found</p>
+            </div>
+            }
           </div>
       }
       <div>
-       {
-        reportees.length>0 && pagesCount>1 && (
-          <PaginationComponent 
-          currentPage={currPage}
-          totalPages={pagesCount}
-          onPageChange={handlePageChange}
-        />
-        )
-       }
+        {
+          reportees.length > 0 && pagesCount > 1 && (
+            <PaginationComponent
+              currentPage={currPage}
+              totalPages={pagesCount}
+              onPageChange={handlePageChange}
+            />
+          )
+        }
       </div>
     </div>
   );

src/components/table/index.jsx

@@ -75,15 +75,11 @@ function Table({headers, data,loading, maxHeight}) {
       </table>
       {
         (!data?.length)?<div className="w-full h-full">
-        <p className="text-center align-middle pt-14 pb-14 text-blue-500  font-bold">No records to display</p>
+        <p className="text-center align-middle pt-14 pb-14 text-blue-500  font-bold">No Records Found</p>
      </div>:null
       }
     </div>
   );
-  // else
-//   return <div className="w-full h-full">
-//      <p className="text-center align-middle pt-14 pb-14 text-blue-500  font-bold">No records to display</p>
-//   </div>
 }
 
 export default Table;

src/pages/viewReportee/index.jsx

@@ -88,7 +88,7 @@ function Viewreportee() {
     }
   }, []);
 
-  if ( reportees.length && viewReportee!==null)
+  if (viewReportee!==null)
     return (
       <div className="p-4" >
         <div className="bg-white p-3 rounded-md">