Check app inactivity

src/App.tsx

@@ -13,6 +13,7 @@ import { NotificationsProvider } from './contexts/NotificationsContext';
 import { SearchProvider } from './contexts/SearchContext';
 import { MessagesProvider } from './contexts/MessagesContext';
 import { MediaProvider } from './contexts/MediaContext';
+import { AppProvider } from './contexts/AppContext';
 
 
 export const APP_ID = `${Math.floor(Math.random()*10000000000)}`;
@@ -25,34 +26,36 @@ const App: Component = () => {
 
   onCleanup(() => {
     disconnect();
-  })
+  });
 
   return (
-    <TranslatorProvider>
-      <Toaster>
-        <MediaProvider>
-          <AccountProvider>
-            <SearchProvider>
-              <SettingsProvider>
-                <ProfileProvider>
-                  <MessagesProvider>
-                    <NotificationsProvider>
-                      <HomeProvider>
-                        <ExploreProvider>
-                          <ThreadProvider>
-                            <Router />
-                          </ThreadProvider>
-                        </ExploreProvider>
-                      </HomeProvider>
-                    </NotificationsProvider>
-                  </MessagesProvider>
-                </ProfileProvider>
-              </SettingsProvider>
-            </SearchProvider>
-          </AccountProvider>
-        </MediaProvider>
-      </Toaster>
-    </TranslatorProvider>
+    <AppProvider>
+      <TranslatorProvider>
+        <Toaster>
+          <MediaProvider>
+            <AccountProvider>
+              <SearchProvider>
+                <SettingsProvider>
+                  <ProfileProvider>
+                    <MessagesProvider>
+                      <NotificationsProvider>
+                        <HomeProvider>
+                          <ExploreProvider>
+                            <ThreadProvider>
+                              <Router />
+                            </ThreadProvider>
+                          </ExploreProvider>
+                        </HomeProvider>
+                      </NotificationsProvider>
+                    </MessagesProvider>
+                  </ProfileProvider>
+                </SettingsProvider>
+              </SearchProvider>
+            </AccountProvider>
+          </MediaProvider>
+        </Toaster>
+      </TranslatorProvider>
+    </AppProvider>
   );
 };
 

src/contexts/AppContext.tsx

@@ -0,0 +1,64 @@
+import { createStore } from "solid-js/store";
+import {
+  createContext,
+  createEffect,
+  JSXElement,
+  onCleanup,
+  onMount,
+  useContext
+} from "solid-js";
+
+export type AppContextStore = {
+  isInactive: boolean,
+}
+
+const initialData = {
+  isInactive: false,
+};
+
+export const AppContext = createContext<AppContextStore>();
+
+export const AppProvider = (props: { children: JSXElement }) => {
+
+  let inactivityCounter = 0;
+
+  const monitorActivity = () => {
+    clearTimeout(inactivityCounter);
+
+    if (store.isInactive) {
+      updateStore('isInactive', () => false)
+    }
+
+    inactivityCounter = setTimeout(() => {
+      updateStore('isInactive', () => true)
+    }, 30 * 60_000);
+  };
+
+// EFFECTS --------------------------------------
+
+  onMount(() => {
+    document.addEventListener('mousemove', monitorActivity);
+  });
+
+  onCleanup(() => {
+    document.removeEventListener('mousemove', monitorActivity);
+  });
+
+  createEffect(() => {
+    console.log('INACTIVE: ', store.isInactive)
+  })
+
+// STORES ---------------------------------------
+
+  const [store, updateStore] = createStore<AppContextStore>({
+    ...initialData,
+  });
+
+  return (
+      <AppContext.Provider value={store}>
+        {props.children}
+      </AppContext.Provider>
+  );
+}
+
+export const useAppContext = () => useContext(AppContext);

src/contexts/MessagesContext.tsx

@@ -44,6 +44,7 @@ import { convertToNotes } from "../stores/note";
 import { sanitize, sendEvent } from "../lib/notes";
 import { decrypt, encrypt } from "../lib/nostrAPI";
 import { loadMsgContacts, saveMsgContacts } from "../lib/localStore";
+import { useAppContext } from "./AppContext";
 
 
 export type MessagesContextStore = {
@@ -110,6 +111,7 @@ export const MessagesContext = createContext<MessagesContextStore>();
 export const MessagesProvider = (props: { children: ContextChildren }) => {
 
   const account = useAccountContext();
+  const app = useAppContext();
 
   let msgSubscribed = '|';
 
@@ -788,7 +790,7 @@ export const MessagesProvider = (props: { children: ContextChildren }) => {
 // EFFECTS --------------------------------------
 
   createEffect(() => {
-    if (isConnected() && account?.isKeyLookupDone && account?.hasPublicKey()) {
+    if (isConnected() && account?.isKeyLookupDone && account?.hasPublicKey() && !app?.isInactive) {
       subToMessagesStats();
     } else {
       unsubscribeToMessagesStats(subidMsgCount())

src/contexts/NotificationsContext.tsx

@@ -23,6 +23,7 @@ import { getLastSeen, subscribeToNotificationStats, unsubscribeToNotificationSta
 import { useAccountContext } from "./AccountContext";
 import { timeNow } from "../utils";
 import { useSettingsContext } from "./SettingsContext";
+import { useAppContext } from "./AppContext";
 
 export type NotificationsContextStore = {
   notificationCount: number,
@@ -49,6 +50,7 @@ export const NotificationsProvider = (props: { children: ContextChildren }) => {
 
   const account = useAccountContext();
   const settings = useSettingsContext();
+  const app = useAppContext();
 
   const today = () => (new Date()).getTime();
 
@@ -134,7 +136,7 @@ export const NotificationsProvider = (props: { children: ContextChildren }) => {
 // EFFECTS --------------------------------------
 
   createEffect(() => {
-    if (isConnected() && account?.isKeyLookupDone && account?.hasPublicKey()) {
+    if (isConnected() && account?.isKeyLookupDone && account?.hasPublicKey() && !app?.isInactive) {
       subToNotificationStats();
     } else {
       unsubscribeToNotificationStats(notfiStatsSubId());

src/pages/Home.tsx

@@ -31,6 +31,7 @@ import { feedNewPosts, placeholders, branding } from '../translations';
 import Search from '../components/Search/Search';
 import { setIsHome } from '../components/Layout/Layout';
 import PageTitle from '../components/PageTitle/PageTitle';
+import { useAppContext } from '../contexts/AppContext';
 
 
 const Home: Component = () => {
@@ -38,6 +39,7 @@ const Home: Component = () => {
   const context = useHomeContext();
   const account = useAccountContext();
   const intl = useIntl();
+  const app = useAppContext();
 
   const isPageLoading = () => context?.isFetching;
 
@@ -57,6 +59,11 @@ const Home: Component = () => {
   });
 
   createEffect(() => {
+    if ((context?.future.notes.length || 0) > 99 || app?.isInactive) {
+      clearInterval(checkNewNotesTimer);
+      return;
+    }
+
     const hex = context?.selectedFeed?.hex;
 
     if (checkNewNotesTimer) {
@@ -66,12 +73,11 @@ const Home: Component = () => {
       setNewPostAuthors(() => []);
     }
 
-    const timeout = 25_000 + Math.random() * 10_000;
+    const timeout = 10_000; //25_000 + Math.random() * 10_000;
 
     checkNewNotesTimer = setInterval(() => {
       context?.actions.checkForNewNotes(hex);
     }, timeout);
-
   });
 
   createEffect(() => {
@@ -104,10 +110,6 @@ const Home: Component = () => {
   });
 
   const loadNewContent = () => {
-    if (newNotesCount() > 100) {
-      location.reload();
-      return;
-    }
     context?.actions.loadFutureContent();
     scrollWindowTo(0, true);
     setHasNewPosts(false);