chore: convert update available component to ts and script setup

src/components/home/TheNavigation.vue

@@ -92,7 +92,7 @@
 	</header>
 </template>
 
-<script setup langs="ts">
+<script setup lang="ts">
 import {ref, computed, onMounted, nextTick} from 'vue'
 import {useStore} from 'vuex'
 import {useRouter} from 'vue-router'

src/components/home/update.vue

@@ -7,47 +7,38 @@
 	</div>
 </template>
 
-<script lang="ts">
+<script lang="ts" setup>
-import {defineComponent} from 'vue'
+import {ref} from 'vue'
 
-export default defineComponent({
+const updateAvailable = ref(false)
-	name: 'update',
+const registration = ref(null)
-	data() {
+const refreshing = ref(false)
-		return {
-			updateAvailable: false,
-			registration: null,
-			refreshing: false,
-		}
-	},
-	created() {
-		document.addEventListener('swUpdated', this.showRefreshUI, {once: true})
 
-		if (navigator && navigator.serviceWorker) {
+document.addEventListener('swUpdated', showRefreshUI, {once: true})
-			navigator.serviceWorker.addEventListener(
+
-				'controllerchange', () => {
+if (navigator && navigator.serviceWorker) {
-					if (this.refreshing) return
+	navigator.serviceWorker.addEventListener(
-					this.refreshing = true
+		'controllerchange', () => {
-					window.location.reload()
+			if (refreshing.value) return
-				},
+			refreshing.value = true
-			)
+			window.location.reload()
-		}
-	},
-	methods: {
-		showRefreshUI(e) {
-			console.log('recieved refresh event', e)
-			this.registration = e.detail
-			this.updateAvailable = true
 		},
-		refreshApp() {
+	)
-			this.updateExists = false
+}
-			if (!this.registration || !this.registration.waiting) {
+
-				return
+function showRefreshUI(e) {
-			}
+	console.log('recieved refresh event', e)
-			// Notify the service worker to actually do the update
+	registration.value = e.detail
-			this.registration.waiting.postMessage('skipWaiting')
+	updateAvailable.value = true
-		},
+}
-	},
+
-})
+function refreshApp() {
+	if (!registration.value || !registration.value.waiting) {
+		return
+	}
+	// Notify the service worker to actually do the update
+	registration.value.waiting.postMessage('skipWaiting')
+}
 </script>
 
 <style lang="scss" scoped>