refactor: move script over template

src/components/Footer.vue

@@ -1,3 +1,16 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+import { isDark } from '/~/logics'
+
+const { t, availableLocales, locale } = useI18n()
+
+const toggleLocales = () => {
+  // change to some real logic
+  const locales = availableLocales
+  locale.value = locales[(locales.indexOf(locale.value) + 1) % locales.length]
+}
+</script>
+
 <template>
   <nav class="text-xl mt-6">
     <router-link class="icon-btn mx-2" to="/" :title="t('button.home')">
@@ -22,18 +35,3 @@
     </a>
   </nav>
 </template>
-
-<script setup lang='ts'>
-import { useI18n } from 'vue-i18n'
-import { isDark } from '/~/logics'
-
-const i18n = useI18n()
-
-const toggleLocales = () => {
-  // change to some real logic
-  const locales = i18n.availableLocales
-  i18n.locale.value = locales[(locales.indexOf(i18n.locale.value) + 1) % locales.length]
-}
-
-const t = i18n.t
-</script>