perf: Fixed intervals (#1002)

src/App.vue

@@ -20,7 +20,7 @@ export default {
   components: { Navbar },
   mixins: [General],
   computed: {
-    ...mapState(['modals', 'webuiSettings']),
+    ...mapState(['modals', 'webuiSettings', 'authenticated']),
     ...mapGetters(['isAuthenticated']),
     onLoginPage() {
       return this.$router.currentRoute.name?.includes('login')
@@ -33,20 +33,30 @@ export default {
     this.checkAuthentication()
     this.blockContextMenu()
   },
+  watch: {
+    authenticated(newValue) {
+      if (newValue) {
+        this.$store.dispatch('INIT_INTERVALS')
+        this.$store.commit('updateMainData')
+        this.$store.dispatch('FETCH_SETTINGS')
+      } else {
+        this.$store.commit('REMOVE_INTERVALS')
+      }
+    }
+  },
   methods: {
     async checkAuthentication() {
       const authenticated = await qbit.getAuthenticationStatus()
       if (authenticated) {
         this.$store.commit('LOGIN', true)
-        this.$store.commit('updateMainData')
-        await this.$store.dispatch('FETCH_SETTINGS')
-        if (this.onLoginPage) return this.$router.push('dashboard')
-
+        this.$store.dispatch('INIT_INTERVALS')
+        this.$store.dispatch('FETCH_SETTINGS')
+        if (this.onLoginPage) this.redirectOnSuccess()
         return
       }
 
       this.$store.commit('LOGIN', false)
-      if (!this.onLoginPage) return this.$router.push('login')
+      if (!this.onLoginPage) return this.$router.push({ name: 'login', query: { redirect: this.$route.fullPath } })
     },
     blockContextMenu() {
       document.addEventListener('contextmenu', event => {
@@ -61,6 +71,11 @@ export default {
 
         return false
       })
+    },
+    redirectOnSuccess() {
+      const redirect = this.$route.query.redirect
+      if (redirect) return this.$router.push(redirect)
+      this.$router.push({ name: 'dashboard' })
     }
   }
 }

src/components/Modals/ConfirmDeleteModal.vue

@@ -36,7 +36,7 @@ import { mapGetters, mapState } from 'vuex'
 import qbit from '@/services/qbit'
 import { FullScreenModal, Modal } from '@/mixins'
 import { Torrent } from '@/models'
-import { WebUISettings } from '@/types/vuetorrent'
+import WebUISettings from '@/types/vuetorrent/WebUISettings'
 
 export default defineComponent({
   name: 'ConfirmDeleteModal',

src/components/Settings/Tabs/VueTorrent/VGeneral.vue

@@ -178,7 +178,7 @@ import { General } from '@/mixins'
 import { TitleOptions } from '@/enums/vuetorrent'
 import Ajv from 'ajv'
 import { StoreStateSchema } from '@/schemas'
-import { WebUISettings } from '@/types/vuetorrent'
+import WebUISettings from '@/types/vuetorrent/WebUISettings'
 
 export default defineComponent({
   name: 'VueTorrent-General',

src/router.ts

@@ -62,7 +62,7 @@ router.beforeEach(async (to, from, next) => {
 
   if (!isPublic && !authenticated) {
     return next({
-      path: '/login',
+      name: 'login',
       // Store the full path to redirect the user to after login
       query: { redirect: to.fullPath }
     })

src/store/actions.ts

@@ -7,9 +7,10 @@ import type { LoginPayload } from '@/types/qbit/payloads'
 
 export default {
   INIT_INTERVALS: async (store: Store<StoreState>) => {
-    store.state.intervals[0] = setInterval(() => {
+    store.commit('REMOVE_INTERVALS')
+    store.state.intervals.push(setInterval(() => {
       store.commit('updateMainData')
-    }, store.getters.getApiRefreshInterval())
+    }, store.getters.getApiRefreshInterval()))
   },
   LOGIN: async (store: Store<StoreState>, payload: LoginPayload) => {
     const res = await qbit.login(payload)

src/store/mutations.ts

@@ -13,6 +13,7 @@ export default {
   },
   REMOVE_INTERVALS: (state: StoreState) => {
     state.intervals.forEach(el => clearInterval(el))
+    state.intervals.splice(0, state.intervals.length)
   },
   ADD_MODAL(state: StoreState, modal: ModalTemplate) {
     state.modals.push(modal)
@@ -72,9 +73,9 @@ export default {
       DocumentTitle.update()
     } catch (error: any) {
       if (error?.response?.status === 403) {
-        console.error('No longer authtenticated, logging out...')
-        state.authenticated = false
-        router.push({ name: 'login' })
+        console.error('No longer authenticated, logging out...')
+        store.commit('LOGIN', false)
+        router.push({ name: 'login', query: { redirect: router.currentRoute.fullPath } })
       }
     } finally {
       state.isUpdatingMainData = false

src/types/vuetorrent/StoreState.ts

@@ -6,7 +6,7 @@ import type SortOptions from './SortOptions'
 import type { AppPreferences } from '../qbit/models'
 import type ModalTemplate from './ModalTemplate'
 import type { Status } from '@/models'
-import type WebUISettings from './WebUISettings'
+import type WebUISettings from '@/types/vuetorrent/WebUISettings'
 import type { SearchPlugin } from '@/types/qbit/models'
 import { SearchData } from "@/types/vuetorrent/search";
 

src/types/vuetorrent/index.ts

@@ -6,7 +6,7 @@ import type SortOptions from './SortOptions'
 import type StoreState from './StoreState'
 import type { PersistentStoreState } from './StoreState'
 import type { TreeNode, TreeFile, TreeFolder, TreeRoot } from './TreeObjects'
-import WebUISettings, { TorrentProperty } from './WebUISettings'
+import { TorrentProperty } from './WebUISettings'
 import type Tracker from './Tracker'
 
 export {
@@ -25,6 +25,5 @@ export {
   TreeFolder,
   TreeRoot,
   TorrentProperty,
-  Tracker,
-  WebUISettings
+  Tracker
 }

src/views/Dashboard.vue

@@ -336,7 +336,6 @@ export default {
     if (this.input) this.searchFilterEnabled = true
   },
   mounted() {
-    this.$store.dispatch('INIT_INTERVALS')
     document.addEventListener('keydown', this.handleKeyboardShortcut)
     document.addEventListener('dragenter', this.detectDragEnter)
     this.$store.state.selectMode = false
@@ -348,7 +347,6 @@ export default {
     }
   },
   beforeDestroy() {
-    this.$store.commit('REMOVE_INTERVALS')
     document.removeEventListener('keydown', this.handleKeyboardShortcut)
     document.removeEventListener('dragenter', this.detectDragEnter)
   },

src/views/Login.vue

@@ -61,7 +61,7 @@ export default {
   },
   mounted() {
     if (isAuthenticated()) {
-      this.$router.push('dashboard')
+      this.redirectOnSuccess()
     }
   },
   methods: {
@@ -72,7 +72,14 @@ export default {
       })
 
       if (authenticated) {
-        this.$router.push('dashboard')
+        this.redirectOnSuccess()
+      }
+    },
+    redirectOnSuccess() {
+      if (this.$route.query.redirect !== undefined) {
+        this.$router.push(this.$route.query.redirect)
+      } else {
+        this.$router.push({ name: 'dashboard' })
       }
     }
   }

src/views/MagnetHandler.vue

@@ -10,7 +10,7 @@ export default {
   props: ['magnet'],
   created() {
     this.createModal('AddModal', { initialMagnet: this.magnet })
-    this.$router.push('dashboard')
+    this.$router.push({ name: 'dashboard' })
   }
 }
 </script>

src/views/Settings.vue

@@ -123,8 +123,10 @@ export default defineComponent({
       return this.$vuetify.breakpoint.xsOnly
     }
   },
-  mounted() {
+  beforeMount() {
     this.$store.dispatch('FETCH_SETTINGS')
+  },
+  mounted() {
     document.addEventListener('keydown', this.handleKeyboardShortcut)
   },
   beforeDestroy() {

src/views/TorrentDetail.vue

@@ -91,11 +91,9 @@ export default defineComponent({
     }
   },
   mounted() {
-    this.$store.dispatch('INIT_INTERVALS')
     document.addEventListener('keydown', this.handleKeyboardShortcut)
   },
   beforeDestroy() {
-    this.$store.commit('REMOVE_INTERVALS')
     document.removeEventListener('keydown', this.handleKeyboardShortcut)
   },
   methods: {