From c98dcd868129a20be4bae428bf105c0255d48790 Mon Sep 17 00:00:00 2001
From: manisha <manisha_kanyal.scsebtech@galgotiasuniversity.edu.in>
Date: Aug 16 2021 11:57:04 +0000
Subject: [PATCH 1/2] data is being fetched every 5 minutes


---

diff --git a/src/constants/ProjectConstants.js b/src/constants/ProjectConstants.js
index 546ab63..ab1f647 100644
--- a/src/constants/ProjectConstants.js
+++ b/src/constants/ProjectConstants.js
@@ -8,3 +8,4 @@ export const API_CALL_STATUS_VALUES = {
 
 export const MAX_RETRY_LIMIT = 5
 export const FIRST_RETRY_GAP = 5 //in seconds
+export const RELOAD_LANDING_PAGE_DATA_DURATION = 500000 //in ms
\ No newline at end of file
diff --git a/src/landingpage/LandingPage.js b/src/landingpage/LandingPage.js
index 7f2b89f..ee0b217 100644
--- a/src/landingpage/LandingPage.js
+++ b/src/landingpage/LandingPage.js
@@ -19,6 +19,7 @@ import * as R from "ramda"
 import { shallowEqual, useDispatch, useSelector } from "react-redux"
 import { loadData, toggleLandingPageModal } from "../actions/reduxActions"
 import Cookies from "universal-cookie"
+import { RELOAD_LANDING_PAGE_DATA_DURATION } from "../constants/ProjectConstants"
 
 const LandingPage = () => {
   const cookies = new Cookies()
@@ -51,6 +52,8 @@ const LandingPage = () => {
 
   useEffect(() => {
     dispatch(loadData())
+    const reloadTimeout = setInterval(() => dispatch(loadData()), RELOAD_LANDING_PAGE_DATA_DURATION)
+    return () => clearInterval(reloadTimeout)
   }, [dispatch])
 
   const handleVisibilityChange = (e, item) => {

From 427e84af232b3010fd26c55d833cacf669e9d886 Mon Sep 17 00:00:00 2001
From: manisha <manisha_kanyal.scsebtech@galgotiasuniversity.edu.in>
Date: Aug 24 2021 06:50:00 +0000
Subject: [PATCH 2/2] added custom useInterval


---

diff --git a/src/hooks/useInterval.js b/src/hooks/useInterval.js
new file mode 100644
index 0000000..8f9608e
--- /dev/null
+++ b/src/hooks/useInterval.js
@@ -0,0 +1,21 @@
+import { useEffect, useRef } from "react"
+
+export const useInterval = (callback, delay) => {
+  const savedCallback = useRef()
+
+  // Remember the latest function.
+  useEffect(() => {
+    savedCallback.current = callback
+  }, [callback])
+
+  // Set up the interval.
+  useEffect(() => {
+    function tick() {
+      savedCallback.current()
+    }
+    if (delay !== null) {
+      let id = setInterval(tick, delay)
+      return () => clearInterval(id)
+    }
+  }, [delay])
+}
\ No newline at end of file
diff --git a/src/landingpage/LandingPage.js b/src/landingpage/LandingPage.js
index ee0b217..de9a715 100644
--- a/src/landingpage/LandingPage.js
+++ b/src/landingpage/LandingPage.js
@@ -8,6 +8,10 @@ import {
   ModalFooter,
   Button,
   Col,
+  DropdownMenu,
+  DropdownToggle,
+  ButtonDropdown,
+  DropdownItem
 } from "reactstrap"
 import { Link } from "react-router-dom"
 import Layout from "../layout/Layout"
@@ -19,7 +23,8 @@ import * as R from "ramda"
 import { shallowEqual, useDispatch, useSelector } from "react-redux"
 import { loadData, toggleLandingPageModal } from "../actions/reduxActions"
 import Cookies from "universal-cookie"
-import { RELOAD_LANDING_PAGE_DATA_DURATION } from "../constants/ProjectConstants"
+import { useInterval } from "../hooks/useInterval"
+
 
 const LandingPage = () => {
   const cookies = new Cookies()
@@ -42,6 +47,18 @@ const LandingPage = () => {
     config_mode: false,
     enabled_components: enabled_components,
   })
+  
+
+  const interval = [1,2,3,4,5]
+
+  const [reload, setReload] = useState(5)
+  const [check, setCheck] = useState(true)
+
+  const [reloadOnActive, setReloadOnActive] = useState(false)
+  const [inactiveTab, setInactiveTab] = useState(false)
+  const [dropdownOpen, setDropdownOpen] = useState(false)
+
+  const toggle = () => setDropdownOpen((prevState) => !prevState)
 
   const selectAction = (state) => state.landing_page.api_call_status
   const api_call_status = useSelector(selectAction, shallowEqual)
@@ -52,10 +69,41 @@ const LandingPage = () => {
 
   useEffect(() => {
     dispatch(loadData())
-    const reloadTimeout = setInterval(() => dispatch(loadData()), RELOAD_LANDING_PAGE_DATA_DURATION)
-    return () => clearInterval(reloadTimeout)
   }, [dispatch])
 
+  useInterval(() => {
+    autoRefreshHandler()
+  }, reload*100000)
+
+  useEffect(() => {
+    setReload(localStorage.getItem("fetch_interval")|| 1)
+    const getDataIfNotRefreshed = () => {
+      if (!inactiveTab && reloadOnActive && check) {
+        setReloadOnActive(false)
+        dispatch(loadData())
+      }
+    }
+    getDataIfNotRefreshed()
+
+  }, [inactiveTab, check, dispatch, reloadOnActive])
+
+  useEffect(() => {
+    window.addEventListener("visibilitychange", handlePageActivity)
+    return () => window.removeEventListener("visibilitychange", handlePageActivity)
+  }, [])
+
+  const handlePageActivity = (visibility) => {
+    setInactiveTab(visibility.target.hidden)
+  }
+
+  const autoRefreshHandler = () => {
+    if (inactiveTab) {
+      setReloadOnActive(true)
+    } else {
+      dispatch(loadData())
+    }
+  }
+
   const handleVisibilityChange = (e, item) => {
     let enabled_components = [...state.enabled_components]
     if (enabled_components.includes(item)) {
@@ -75,6 +123,11 @@ const LandingPage = () => {
     dispatch(toggleLandingPageModal(modalState))
   }
 
+  const intervalMinute = (time) => {
+    localStorage.setItem("fetch_interval", time)
+    setReload(time)
+  }
+
   const available_components_mapper = {
     events: <Events data={landingPageData.meetings} />,
     blockers: <Blockers data={landingPageData.blockerbugs} release={landingPageData.devel} />,
@@ -136,6 +189,34 @@ const LandingPage = () => {
                         </Col>
                       </React.Fragment>
                     ))}
+                    <Col sm="12">
+                      <div className="custom-control custom-switch">
+                        <input
+                          type="checkbox"
+                          className="custom-control-input"
+                          id="customSwitches"
+                          checked={check}
+                          onChange={() => setCheck(!check)}  
+                          readOnly
+                        />
+                        <label className="custom-control-label" htmlFor="customSwitches">
+                          Reload Page
+                        </label>
+                        {" "}
+                        {check && 
+                         <ButtonDropdown  size="sm" isOpen={dropdownOpen}  toggle={toggle}>
+                         <DropdownToggle caret>{reload} min</DropdownToggle>
+                         <DropdownMenu>
+                          {interval.map((item) => (
+                            <DropdownItem key={item} onClick={() => intervalMinute(item)}>
+                              {item} min
+                            </DropdownItem>
+                          ))} 
+                         </DropdownMenu>
+                         </ButtonDropdown>
+                        }
+                      </div>
+                    </Col>
                   </ModalBody>
                   <ModalFooter>
                     <Button color="primary" onClick={toggleModal}>