feat: move update from navigation to app

src/App.vue

@@ -1,5 +1,6 @@
 <template>
 	<ready>
+		<Update/>
 		<template v-if="authUser">
 			<TheNavigation/>
 			<content-auth/>
@@ -19,23 +20,25 @@ 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'
 
 import Notification from '@/components/misc/notification.vue'
-import KeyboardShortcuts from './components/misc/keyboard-shortcuts/index.vue'
+import KeyboardShortcuts from '@/components/misc/keyboard-shortcuts/index.vue'
 import TheNavigation from '@/components/home/TheNavigation.vue'
-import ContentAuth from './components/home/contentAuth.vue'
-import ContentLinkShare from './components/home/contentLinkShare.vue'
+import ContentAuth from '@/components/home/contentAuth.vue'
+import ContentLinkShare from '@/components/home/contentLinkShare.vue'
 import NoAuthWrapper from '@/components/misc/no-auth-wrapper.vue'
 import Ready from '@/components/misc/ready.vue'
+import Update from '@/components/home/Update.vue'
 
-import {setLanguage} from './i18n'
+import {setLanguage} from '@/i18n'
 import AccountDeleteService from '@/services/accountDelete'
+import {success} from '@/message'
 
+import {useAuthStore} from '@/stores/auth'
 import {useBaseStore} from '@/stores/base'
+
 import {useColorScheme} from '@/composables/useColorScheme'
 import {useBodyClass} from '@/composables/useBodyClass'
-import {useAuthStore} from './stores/auth'
 
 const baseStore = useBaseStore()
 const authStore = useAuthStore()

src/components/home/TheNavigation.vue

@@ -25,7 +25,6 @@
 		</div>
 
 		<div class="navbar-end">
-			<update/>
 			<BaseButton
 				@click="openQuickActions"
 				class="trigger-button pr-0"
@@ -95,7 +94,6 @@ import {ref, computed, onMounted, nextTick} from 'vue'
 
 import {RIGHTS as Rights} from '@/constants/rights'
 
-import Update from '@/components/home/update.vue'
 import ListSettingsDropdown from '@/components/list/list-settings-dropdown.vue'
 import Dropdown from '@/components/misc/dropdown.vue'
 import DropdownItem from '@/components/misc/dropdown-item.vue'

src/components/home/Update.vue

@@ -16,15 +16,13 @@ const refreshing = ref(false)
 
 document.addEventListener('swUpdated', showRefreshUI, {once: true})
 
-if (navigator && navigator.serviceWorker) {
-	navigator.serviceWorker.addEventListener(
-		'controllerchange', () => {
-			if (refreshing.value) return
-			refreshing.value = true
-			window.location.reload()
-		},
-	)
-}
+navigator?.serviceWorker?.addEventListener(
+	'controllerchange', () => {
+		if (refreshing.value) return
+		refreshing.value = true
+		window.location.reload()
+	},
+)
 
 function showRefreshUI(e: Event) {
 	console.log('recieved refresh event', e)
@@ -33,6 +31,7 @@ function showRefreshUI(e: Event) {
 }
 
 function refreshApp() {
+	updateAvailable.value = false
 	if (!registration.value || !registration.value.waiting) {
 		return
 	}
@@ -75,7 +74,7 @@ function refreshApp() {
 	}
 }
 
-.dark .update-notification {
+:global(.dark) .update-notification {
 	color: var(--grey-200);
 }
 </style>