Save clear timeouts

yral-dapp · Feb 12, 2024 · a4f5300 · a4f5300
1 parent c0308ef
commit a4f5300
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 30 deletions.
diff --git a/packages/experiments/src/routes/(feed)/up-down/+layout.svelte b/packages/experiments/src/routes/(feed)/up-down/+layout.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
 import FeedLayout from '@hnn/components/experiments/layout/FeedLayout.svelte'
 import { showOnboardingPopup } from '$lib/stores/popups'
-import { onMount } from 'svelte'
+import { onDestroy, onMount } from 'svelte'
 
 let onboarding: any
+let onboardingTimeout: ReturnType<typeof setTimeout>
 function mountOnboarding() {
-  setTimeout(
+  onboardingTimeout = setTimeout(
     () =>
       import('$lib/components/popup/Onboarding.svelte').then(
         (d) => (onboarding = d.default),
@@ -15,6 +16,7 @@ function mountOnboarding() {
 }
 
 onMount(() => mountOnboarding())
+onDestroy(() => clearTimeout(onboardingTimeout))
 </script>
 
 <svelte:head>

diff --git a/packages/experiments/src/routes/+layout.svelte b/packages/experiments/src/routes/+layout.svelte
@@ -2,7 +2,7 @@
 import '@hnn/components/tailwind.css'
 import NetworkStatus from '@hnn/components/network-status/NetworkStatus.svelte'
 import { registerEvent } from '@hnn/components/analytics/GA.utils'
-import { onMount } from 'svelte'
+import { onDestroy, onMount } from 'svelte'
 import { authState } from '$lib/stores/auth'
 import userProfile from '$lib/stores/userProfile'
 import { removeSplashScreen } from '$lib/stores/popups'
@@ -23,15 +23,15 @@ function registerServiceWorker() {
 }
 
 let GA: any
+let GATimeout: ReturnType<typeof setTimeout>
 function initializeGA() {
-  try {
-    import('@hnn/components/analytics/GA.svelte').then((d) => {
-      GA = d.default
-      console.info('loaded GA')
-    })
-  } catch (_) {
-    Log('warn', 'Could not load GA')
-  }
+  GATimeout = setTimeout(async () => {
+    try {
+      GA = (await import('@hnn/components/analytics/GA.svelte')).default
+    } catch (_) {
+      Log('warn', 'Could not load GA')
+    }
+  }, 6000)
 }
 
 function listenForUnhandledRejections() {
@@ -48,11 +48,13 @@ onMount(() => {
   initDb()
   listenForUnhandledRejections()
   registerServiceWorker()
-  setTimeout(() => {
-    initializeGA()
-  }, 6000)
+  initializeGA()
   removeSplashScreen()
 })
+
+onDestroy(() => {
+  clearTimeout(GATimeout)
+})
 </script>
 
 <svelte:window

diff --git a/packages/web-client/src/routes/(feed)/hotornot/[id=videoId]/+page.svelte b/packages/web-client/src/routes/(feed)/hotornot/[id=videoId]/+page.svelte
@@ -129,12 +129,7 @@ onMount(async () => {
     $hotOrNotFeedVideos = []
   }
   await tick()
-  setTimeout(
-    () => {
-      fetchNextVideos()
-    },
-    data.post ? 3000 : 0,
-  )
+  fetchNextVideos()
   handleParams()
 })
 

diff --git a/packages/web-client/src/routes/+layout.svelte b/packages/web-client/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 import '@hnn/components/tailwind.css'
-import { onMount } from 'svelte'
+import { onDestroy, onMount } from 'svelte'
 import { authState } from '$lib/stores/auth'
 import LoginPopup from '$lib/components/auth/LoginPopup.svelte'
 import Log from '$lib/utils/Log'
@@ -25,12 +25,15 @@ function registerServiceWorker() {
 }
 
 let GA: any
-async function initializeGA() {
-  try {
-    GA = (await import('@hnn/components/analytics/GA.svelte')).default
-  } catch (_) {
-    Log('warn', 'Could not load GA')
-  }
+let GATimeout: ReturnType<typeof setTimeout>
+function initializeGA() {
+  GATimeout = setTimeout(async () => {
+    try {
+      GA = (await import('@hnn/components/analytics/GA.svelte')).default
+    } catch (_) {
+      Log('warn', 'Could not load GA')
+    }
+  }, 6000)
 }
 
 function listenForUnhandledRejections() {
@@ -48,12 +51,12 @@ onMount(() => {
   listenForUnhandledRejections()
   initializeAuthClient()
   registerServiceWorker()
-  setTimeout(() => {
-    initializeGA()
-  }, 6000)
+  initializeGA()
   removeSplashScreen()
 })
 
+onDestroy(() => clearTimeout(GATimeout))
+
 beforeNavigate(({ from, to, type }) => {
   if (type === 'popstate') return