diff --git a/src/contexts/AppContext.tsx b/src/contexts/AppContext.tsx index ee3e8cd..cf744ef 100644 --- a/src/contexts/AppContext.tsx +++ b/src/contexts/AppContext.tsx @@ -10,10 +10,12 @@ import { export type AppContextStore = { isInactive: boolean, + appState: 'sleep' | 'waking' | 'woke', } -const initialData = { +const initialData: AppContextStore = { isInactive: false, + appState: 'woke', }; export const AppContext = createContext(); @@ -38,10 +40,33 @@ export const AppProvider = (props: { children: JSXElement }) => { onMount(() => { document.addEventListener('mousemove', monitorActivity); + document.addEventListener('scroll', monitorActivity); + document.addEventListener('keydown', monitorActivity); }); onCleanup(() => { document.removeEventListener('mousemove', monitorActivity); + document.removeEventListener('scroll', monitorActivity); + document.removeEventListener('keydown', monitorActivity); + }); + + let wakingTimeout = 0; + + createEffect(() => { + if (store.isInactive) { + updateStore('appState', () => 'sleep'); + clearTimeout(wakingTimeout); + } + else { + // Set this state in order to make sure that we reload page + // when user requests future notes because we didn't fetch them yet + updateStore('appState', () => 'waking'); + + // Give time for future notes fetching to fire before changing state + wakingTimeout = setTimeout(() => { + updateStore('appState', () => 'woke'); + }, 36_000); + } }); // STORES --------------------------------------- diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 7c44074..a9dc52d 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -110,7 +110,7 @@ const Home: Component = () => { }); const loadNewContent = () => { - if (newNotesCount() > 100) { + if (newNotesCount() > 100 || app?.appState === 'waking') { location.reload(); return; }