fix auto refresh on tab switch

src/components/dashboard/Officer_EventRequestManagement.astro

@@ -152,10 +152,13 @@ try {
 </div>
 
 <script>
-    // Refresh the page when the user navigates back to it
+    // Remove the visibilitychange event listener that causes full page refresh
+    // Instead, we'll use a more efficient approach to refresh data only when needed
     document.addEventListener("visibilitychange", () => {
         if (document.visibilityState === "visible") {
-            window.location.reload();
+            // Instead of reloading the entire page, dispatch a custom event
+            // that components can listen for to refresh their data
+            document.dispatchEvent(new CustomEvent("dashboardTabVisible"));
         }
     });
 

src/components/dashboard/Officer_EventRequestManagement/EventRequestManagementTable.tsx

@@ -303,6 +303,22 @@ const EventRequestManagementTable = ({ eventRequests: initialEventRequests }: Ev
         refreshEventRequests();
     }, []);
 
+    // Listen for tab visibility changes and refresh data when tab becomes visible
+    useEffect(() => {
+        const handleTabVisible = () => {
+            console.log("Tab became visible, refreshing event requests...");
+            refreshEventRequests();
+        };
+
+        // Add event listener for custom dashboardTabVisible event
+        document.addEventListener("dashboardTabVisible", handleTabVisible);
+
+        // Clean up event listener on component unmount
+        return () => {
+            document.removeEventListener("dashboardTabVisible", handleTabVisible);
+        };
+    }, []);
+
     if (filteredRequests.length === 0) {
         return (
             <motion.div