feat: remove useRouteQuery (#2751)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: #2751
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>

package.json

@@ -31,7 +31,6 @@
     "@types/lodash.clonedeep": "4.5.7",
     "@types/sortablejs": "1.15.0",
     "@vueuse/core": "9.6.0",
-    "@vueuse/router": "9.6.0",
     "axios": "0.27.2",
     "blurhash": "2.0.4",
     "bulma-css-variables": "0.9.33",

pnpm-lock.yaml

@@ -33,7 +33,6 @@ specifiers:
   '@vue/test-utils': 2.2.4
   '@vue/tsconfig': 0.1.3
   '@vueuse/core': 9.6.0
-  '@vueuse/router': 9.6.0
   autoprefixer: 10.4.13
   axios: 0.27.2
   blurhash: 2.0.4
@@ -104,7 +103,6 @@ dependencies:
   '@types/lodash.clonedeep': 4.5.7
   '@types/sortablejs': 1.15.0
   '@vueuse/core': 9.6.0_vue@3.2.45
-  '@vueuse/router': 9.6.0_xsxatmlnmmg5bcuv3xdnj6fj7y
   axios: 0.27.2
   blurhash: 2.0.4
   bulma-css-variables: 0.9.33
@@ -3668,19 +3666,6 @@ packages:
     resolution: {integrity: sha512-sIC8R+kWkIdpi5X2z2Gk8TRYzmczDwHRhEFfCu2P+XW2JdPoXrziqsGpDDsN7ykBx4ilwieS7JUIweVGhvZ93w==}
     dev: false
 
-  /@vueuse/router/9.6.0_xsxatmlnmmg5bcuv3xdnj6fj7y:
-    resolution: {integrity: sha512-3TIZPX5smlimSNlTm+K3ESRTkA2VBHnwMintNrw4Z+WK5bh1UAh7lcBQluiGg3LJjkrMXYfuO7IPdU+a8NRnFA==}
-    peerDependencies:
-      vue-router: '>=4.0.0-rc.1'
-    dependencies:
-      '@vueuse/shared': 9.6.0_vue@3.2.45
-      vue-demi: 0.12.1_vue@3.2.45
-      vue-router: 4.1.6_vue@3.2.45
-    transitivePeerDependencies:
-      - '@vue/composition-api'
-      - vue
-    dev: false
-
   /@vueuse/shared/9.6.0_vue@3.2.45:
     resolution: {integrity: sha512-/eDchxYYhkHnFyrb00t90UfjCx94kRHxc7J1GtBCqCG4HyPMX+krV9XJgVtWIsAMaxKVU4fC8NSUviG1JkwhUQ==}
     dependencies:

src/App.vue

@@ -15,9 +15,8 @@
 </template>
 
 <script lang="ts" setup>
-import {computed, watch, type Ref} from 'vue'
-import {useRouter} from 'vue-router'
-import {useRouteQuery} from '@vueuse/router'
+import {computed, watch} from 'vue'
+import {useRoute, useRouter} from 'vue-router'
 import {useI18n} from 'vue-i18n'
 import isTouchDevice from 'is-touch-device'
 import {success} from '@/message'
@@ -41,6 +40,7 @@ import {useAuthStore} from './stores/auth'
 const baseStore = useBaseStore()
 const authStore = useAuthStore()
 const router = useRouter()
+const route = useRoute()
 
 useBodyClass('is-touch', isTouchDevice())
 const keyboardShortcutsActive = computed(() => baseStore.keyboardShortcutsActive)
@@ -51,9 +51,9 @@ const authLinkShare = computed(() => authStore.authLinkShare)
 const {t} = useI18n({useScope: 'global'})
 
 // setup account deletion verification
-const accountDeletionConfirm = useRouteQuery('accountDeletionConfirm') as Ref<null | string>
+const accountDeletionConfirm = computed(() => route.query?.accountDeletionConfirm as (string | undefined))
 watch(accountDeletionConfirm, async (accountDeletionConfirm) => {
-	if (accountDeletionConfirm === null) {
+	if (accountDeletionConfirm === undefined) {
 		return
 	}
 
@@ -64,9 +64,9 @@ watch(accountDeletionConfirm, async (accountDeletionConfirm) => {
 }, { immediate: true })
 
 // setup password reset redirect
-const userPasswordReset = useRouteQuery('userPasswordReset') as Ref<null | string>
+const userPasswordReset = computed(() => route.query?.userPasswordReset as (string | undefined))
 watch(userPasswordReset, (userPasswordReset) => {
-	if (userPasswordReset === null) {
+	if (userPasswordReset === undefined) {
 		return
 	}
 
@@ -75,9 +75,9 @@ watch(userPasswordReset, (userPasswordReset) => {
 }, { immediate: true })
 
 // setup email verification redirect
-const userEmailConfirm = useRouteQuery('userEmailConfirm') as Ref<null | string>
+const userEmailConfirm = computed(() => route.query?.userEmailConfirm as (string | undefined))
 watch(userEmailConfirm, (userEmailConfirm) => {
-	if (userEmailConfirm === null) {
+	if (userEmailConfirm === undefined) {
 		return
 	}