page propagation stop added

db.js

@@ -6,7 +6,7 @@ let dbConnection
 module.exports = {
     connectToDb : (cb)=>{
         // MongoClient.connect('mongodb://localhost:27017/ecommerse')
-        MongoClient.connect('mongodb+srv://vsingamchetty:user1234@cluster0.ch8kwyt.mongodb.net/nisumscorecard')
+        MongoClient.connect('mongodb+srv://vsingamchetty:user1234@cluster0.ch8kwyt.mongodb.net/nisumscorecard?connectTimeoutMS=30000&socketTimeoutMS=30000')
         // mongodb+srv://vsingamchetty:user1234@cluster0.ch8kwyt.mongodb.net/
         .then((client)=>{
             dbConnection=client.db()

src/components/modal/index.jsx

@@ -64,12 +64,12 @@ export default function MyModal({ visible, onClose ,type,handleAddActivity}) {
   if (!visible) return null;
 
   return (
-    <div className="absolute w-full h-full inset-0 bg-black bg-opacity-25 backdrop-blur-sm   flex items-center justify-center">
+    <div className="absolute w-full h-full inset-0 bg-black bg-opacity-25 backdrop-blur-sm   flex items-center justify-center" onClick={(e) => e.stopPropagation()}>
       <div className="bg-white rounded lg:w-4/12 sm:w-100">
         <div className=" text-white py-3 pl-2 bg-blue-500 ">{activityType} Activity</div>
         <div>
           <div>
-            <form className=" p-2 max-w-sm mx-auto">
+            <form className=" p-2 max-w-sm mx-auto" onClick={(e) => e.stopPropagation()}>
               <div className="flex items-center  my-5">
               <label htmlFor="countries">Select Activity: </label>
               <select  className="bg-gray-50 ml-2 w-7/12 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" onChange={(e)=>handleActivityName(e)}>
@@ -112,8 +112,6 @@ export default function MyModal({ visible, onClose ,type,handleAddActivity}) {
           </div>
 
             </form>
-            
-
           </div>      
         </div>
       </div>

src/pages/reports/index.jsx

@@ -17,7 +17,7 @@ function Reports() {
   const user=useSelector((state)=>state.userDetails.user)
   const [empDetails, setEmpDetails] = useState(null);
   const { reports ,loading,error} = useSelector((state) => state.reports);
-  const [open, setOpen] = useState({"accordianOne":true,"accordianTwo":false});
+  const [open, setOpen] = useState({"accordianOne":false,"accordianTwo":false});
 
 
 
@@ -35,18 +35,18 @@ function Reports() {
     }
   }, [reports,id]);
 
-  const handleAccordian=(value)=>{
-    switch (value){
-        case "Default":
-            setOpen({...open,"accordianOne":!open["accordianOne"], "accordianTwo": !open["accordianTwo"]})
-            break;
-        case "Initiative":
-            setOpen({...open,"accordianOne":!open["accordianOne"], "accordianTwo": !open["accordianTwo"]})
-            break;
-        default:
-          setOpen({"accordianOne":true,"accordianTwo":false})
+  const handleAccordian = (value) => {
+    switch (value) {
+      case "Default":
+        setOpen({ ...open, "accordianOne": !open["accordianOne"], "accordianTwo": false });
+        break;
+      case "Initiative":
+        setOpen({ ...open, "accordianOne": false, "accordianTwo": !open["accordianTwo"] });
+        break;
+      default:
+        setOpen({ "accordianOne": false, "accordianTwo": false });
+    }
   }
-}
 
   const getReports = (startDate = null, endDate = null) => {
     const data = { "empId": empId, "fromDate": startDate, "toDate": endDate }
@@ -106,7 +106,7 @@ function Reports() {
     }
   }, [id]);
 
-if(reportees.length && empDetails)
+if( empDetails && reportees.length)
 return (
   <div className="p-4" >
     <div className="bg-white p-3">