From 0251789f823d84695b8f7bd8467a1941c94fdbf7 Mon Sep 17 00:00:00 2001
From: wvffle <funkwhale@wvffle.net>
Date: Mon, 4 Jul 2022 22:52:53 +0000
Subject: [PATCH] Fix a bunch of typescript errors

---
 front/src/App.vue                             |  3 +-
 .../components/admin/SignupFormBuilder.vue    |  3 +-
 front/src/components/audio/PlayButton.vue     |  6 ++-
 front/src/components/audio/album/Card.vue     |  3 +-
 .../components/audio/podcast/MobileRow.vue    |  8 ++--
 front/src/components/audio/podcast/Modal.vue  |  8 ++--
 front/src/components/audio/podcast/Row.vue    |  8 ++--
 .../src/components/audio/track/MobileRow.vue  |  8 ++--
 front/src/components/audio/track/Modal.vue    |  8 ++--
 front/src/components/audio/track/Row.vue      |  8 ++--
 front/src/components/channels/AlbumSelect.vue |  7 ++--
 .../src/components/channels/LicenseSelect.vue |  7 ++--
 front/src/components/channels/UploadForm.vue  |  2 +-
 front/src/components/channels/UploadModal.vue | 10 +++--
 front/src/components/common/ActorLink.vue     |  3 +-
 .../src/components/common/AttachmentInput.vue |  5 ++-
 front/src/components/favorites/List.vue       | 10 +++--
 front/src/components/library/AlbumBase.vue    |  3 +-
 .../src/components/library/AlbumDropdown.vue  |  3 +-
 front/src/components/library/ArtistBase.vue   |  3 +-
 front/src/components/library/FsBrowser.vue    |  3 +-
 front/src/components/library/FsLogs.vue       |  2 +-
 front/src/components/library/TrackBase.vue    |  3 +-
 .../manage/library/LibrariesTable.vue         | 13 ++++---
 .../manage/library/UploadsTable.vue           | 15 +++++---
 .../components/playlists/PlaylistModal.vue    |  7 ++--
 front/src/composables/audio/usePlayOptions.ts |  5 ++-
 front/src/composables/audio/usePlayer.ts      |  3 +-
 front/src/composables/audio/useQueue.ts       |  3 +-
 front/src/composables/audio/useSound.ts       |  3 +-
 front/src/composables/audio/useSoundCache.ts  |  3 +-
 .../src/composables/audio/useTrackSources.ts  |  3 +-
 .../src/composables/locale/useSharedLabels.ts |  3 +-
 .../composables/moderation/useEditConfigs.ts  |  3 +-
 front/src/composables/moderation/useReport.ts |  3 +-
 .../moderation/useReportConfigs.ts            |  3 +-
 front/src/composables/useLogger.ts            |  1 +
 front/src/composables/useOrdering.ts          |  6 ++-
 front/src/composables/useSmartSearch.ts       |  7 +++-
 front/src/composables/useThemeList.ts         |  1 +
 front/src/composables/useWebSocketHandler.ts  |  5 ++-
 front/src/init/axios.ts                       |  2 +-
 front/src/init/directives.ts                  |  3 +-
 front/src/init/globalComponents.ts            |  2 +-
 front/src/init/instance.ts                    |  3 +-
 front/src/init/internalLinks.ts               |  4 +-
 front/src/init/lazyLoad.ts                    |  3 +-
 front/src/init/locale.ts                      |  3 +-
 front/src/init/mediaSession.ts                |  3 +-
 front/src/init/serviceWorker.ts               |  3 +-
 front/src/init/webSocket.ts                   |  9 +----
 front/src/init/window.ts                      |  3 +-
 front/src/router/guards.ts                    |  5 ++-
 front/src/router/routes/auth.ts               |  2 +-
 front/src/router/routes/content.ts            |  2 +-
 front/src/router/routes/index.ts              |  3 +-
 front/src/router/routes/library.ts            |  2 +-
 front/src/router/routes/manage.ts             |  3 +-
 front/src/router/routes/settings.ts           |  2 +-
 front/src/router/routes/user.ts               |  3 +-
 front/src/store/auth.ts                       |  5 ++-
 front/src/store/channels.ts                   |  5 ++-
 front/src/store/favorites.ts                  |  5 ++-
 front/src/store/index.ts                      | 37 ++++++++++++-------
 front/src/store/instance.ts                   |  5 ++-
 front/src/store/libraries.ts                  |  5 ++-
 front/src/store/moderation.ts                 |  5 ++-
 front/src/store/player.ts                     |  5 ++-
 front/src/store/playlists.ts                  |  7 ++--
 front/src/store/queue.ts                      |  7 ++--
 front/src/store/radios.ts                     |  5 ++-
 front/src/store/ui.ts                         |  7 ++--
 front/src/utils/clientRadios.ts               |  9 +++--
 front/src/utils/index.ts                      |  8 ++--
 front/src/views/Search.vue                    |  3 +-
 front/src/views/auth/ProfileBase.vue          |  3 +-
 front/src/views/channels/DetailBase.vue       |  5 ++-
 .../views/content/libraries/FilesTable.vue    | 13 ++++---
 front/src/views/content/remote/Card.vue       |  3 +-
 front/src/views/library/DetailBase.vue        |  3 +-
 front/tsconfig.json                           |  1 +
 front/vite.config.ts                          |  4 +-
 82 files changed, 257 insertions(+), 164 deletions(-)

diff --git a/front/src/App.vue b/front/src/App.vue
index 4b67911b9..52691e903 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { Track } from '~/types'
+
 import AudioPlayer from '~/components/audio/Player.vue'
 import Queue from '~/components/Queue.vue'
 import PlaylistModal from '~/components/playlists/PlaylistModal.vue'
@@ -12,7 +14,6 @@ import ReportModal from '~/components/moderation/ReportModal.vue'
 import { useIntervalFn, useToggle, useWindowSize } from '@vueuse/core'
 
 import { computed, nextTick, onMounted, ref, watchEffect } from 'vue'
-import { Track } from '~/types'
 import onKeyboardShortcut from '~/composables/onKeyboardShortcut'
 import useQueue from '~/composables/audio/useQueue'
 import { useStore } from '~/store'
diff --git a/front/src/components/admin/SignupFormBuilder.vue b/front/src/components/admin/SignupFormBuilder.vue
index 6ab3a2757..33c3b301d 100644
--- a/front/src/components/admin/SignupFormBuilder.vue
+++ b/front/src/components/admin/SignupFormBuilder.vue
@@ -1,9 +1,10 @@
 <script setup lang="ts">
+import type { Form } from '~/types'
+
 import SignupForm from '~/components/auth/SignupForm.vue'
 import { useVModel } from '@vueuse/core'
 import { computed, ref } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import { Form } from '~/types'
 import { arrayMove } from '~/utils'
 
 interface Props {
diff --git a/front/src/components/audio/PlayButton.vue b/front/src/components/audio/PlayButton.vue
index c88c91d50..efec4b6fd 100644
--- a/front/src/components/audio/PlayButton.vue
+++ b/front/src/components/audio/PlayButton.vue
@@ -1,8 +1,10 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+
 import { ref, computed, watch, nextTick } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useReport from '~/composables/moderation/useReport'
 import { useCurrentElement } from '@vueuse/core'
 import jQuery from 'jquery'
diff --git a/front/src/components/audio/album/Card.vue b/front/src/components/audio/album/Card.vue
index 8ff0d5a3c..dc242d6f7 100644
--- a/front/src/components/audio/album/Card.vue
+++ b/front/src/components/audio/album/Card.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Album } from '~/types'
+import type { Album } from '~/types'
+
 import PlayButton from '~/components/audio/PlayButton.vue'
 import { momentFormat } from '~/utils/filters'
 import { computed } from 'vue'
diff --git a/front/src/components/audio/podcast/MobileRow.vue b/front/src/components/audio/podcast/MobileRow.vue
index 688a2fa3a..0ff636dea 100644
--- a/front/src/components/audio/podcast/MobileRow.vue
+++ b/front/src/components/audio/podcast/MobileRow.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-// import { Track } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+// import type { Track } from '~/types'
+
 import { ref, computed } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import TrackFavoriteIcon from '~/components/favorites/TrackFavoriteIcon.vue'
 import TrackModal from '~/components/audio/track/Modal.vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useQueue from '~/composables/audio/useQueue'
 import usePlayer from '~/composables/audio/usePlayer'
 
diff --git a/front/src/components/audio/podcast/Modal.vue b/front/src/components/audio/podcast/Modal.vue
index a6e7b6972..7533257e0 100644
--- a/front/src/components/audio/podcast/Modal.vue
+++ b/front/src/components/audio/podcast/Modal.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-// import { Track } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+// import type { Track } from '~/types'
+
 import { useStore } from '~/store'
 import { useGettext } from 'vue3-gettext'
 import SemanticModal from '~/components/semantic/Modal.vue'
 import { computed, ref } from 'vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useReport from '~/composables/moderation/useReport'
 import { useVModel } from '@vueuse/core'
 
diff --git a/front/src/components/audio/podcast/Row.vue b/front/src/components/audio/podcast/Row.vue
index 97f294b9b..15c7a1604 100644
--- a/front/src/components/audio/podcast/Row.vue
+++ b/front/src/components/audio/podcast/Row.vue
@@ -1,9 +1,11 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-import { /* Track, */ Cover } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import type { /* Track, */ Cover } from '~/types'
+
 import axios from 'axios'
 import PlayButton from '~/components/audio/PlayButton.vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import { ref } from 'vue'
 import useQueue from '~/composables/audio/useQueue'
 
diff --git a/front/src/components/audio/track/MobileRow.vue b/front/src/components/audio/track/MobileRow.vue
index e7e4e5e58..75dce7e2e 100644
--- a/front/src/components/audio/track/MobileRow.vue
+++ b/front/src/components/audio/track/MobileRow.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-// import { Track } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+// import type { Track } from '~/types'
+
 import { ref, computed } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import TrackFavoriteIcon from '~/components/favorites/TrackFavoriteIcon.vue'
 import TrackModal from '~/components/audio/track/Modal.vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useQueue from '~/composables/audio/useQueue'
 import usePlayer from '~/composables/audio/usePlayer'
 
diff --git a/front/src/components/audio/track/Modal.vue b/front/src/components/audio/track/Modal.vue
index 3b64b832e..af23d6460 100644
--- a/front/src/components/audio/track/Modal.vue
+++ b/front/src/components/audio/track/Modal.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-// import { Track } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+// import type { Track } from '~/types'
+
 import { useStore } from '~/store'
 import { useGettext } from 'vue3-gettext'
 import SemanticModal from '~/components/semantic/Modal.vue'
 import { computed, ref } from 'vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useReport from '~/composables/moderation/useReport'
 import { useVModel } from '@vueuse/core'
 
diff --git a/front/src/components/audio/track/Row.vue b/front/src/components/audio/track/Row.vue
index 7a0954ccf..ea3a425f5 100644
--- a/front/src/components/audio/track/Row.vue
+++ b/front/src/components/audio/track/Row.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
-// import { Track } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+// import type { Track } from '~/types'
+
 import PlayIndicator from '~/components/audio/track/PlayIndicator.vue'
 import TrackFavoriteIcon from '~/components/favorites/TrackFavoriteIcon.vue'
 import PlayButton from '~/components/audio/PlayButton.vue'
-import usePlayOptions, { PlayOptionsProps } from '~/composables/audio/usePlayOptions'
+import usePlayOptions from '~/composables/audio/usePlayOptions'
 import useQueue from '~/composables/audio/useQueue'
 import usePlayer from '~/composables/audio/usePlayer'
 import { ref } from 'vue'
diff --git a/front/src/components/channels/AlbumSelect.vue b/front/src/components/channels/AlbumSelect.vue
index 2e718acf2..4d24dcde1 100644
--- a/front/src/components/channels/AlbumSelect.vue
+++ b/front/src/components/channels/AlbumSelect.vue
@@ -1,16 +1,17 @@
 <script setup lang="ts">
+import type { Album, Channel } from '~/types'
+
 import axios from 'axios'
 import { useVModel } from '@vueuse/core'
 import { reactive, ref, watch } from 'vue'
-import { Album, Channel } from '~/types'
 
 interface Props {
   modelValue: number
-  channel?: Channel
+  channel: Channel | null
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  channel: () => ({ id: '' })
+  channel: null
 })
 
 const emit = defineEmits(['update:modelValue'])
diff --git a/front/src/components/channels/LicenseSelect.vue b/front/src/components/channels/LicenseSelect.vue
index 577524688..0b7a92825 100644
--- a/front/src/components/channels/LicenseSelect.vue
+++ b/front/src/components/channels/LicenseSelect.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import type { License } from '~/types'
+
+import { computed, reactive, ref } from 'vue'
 import axios from 'axios'
 import { useVModel } from '@vueuse/core'
-import { computed, reactive, ref } from 'vue'
-import { License } from '~/types'
 
 interface Props {
   modelValue: string
@@ -74,7 +75,7 @@ fetchLicenses()
     >
       <a
         v-if="value"
-        :href="currentLicense.url"
+        :href="currentLicense?.url"
         target="_blank"
         rel="noreferrer noopener"
       >
diff --git a/front/src/components/channels/UploadForm.vue b/front/src/components/channels/UploadForm.vue
index 26fc92942..547b6a714 100644
--- a/front/src/components/channels/UploadForm.vue
+++ b/front/src/components/channels/UploadForm.vue
@@ -319,7 +319,7 @@ export default {
       const self = this
       return this.availableChannels.results.filter((c) => {
         return c.uuid === self.values.channel
-      })[0]
+      })[0] ?? null
     },
     selectedUpload () {
       const self = this
diff --git a/front/src/components/channels/UploadModal.vue b/front/src/components/channels/UploadModal.vue
index 85f1c3b41..5c7ff5b64 100644
--- a/front/src/components/channels/UploadModal.vue
+++ b/front/src/components/channels/UploadModal.vue
@@ -15,6 +15,8 @@ const update = (value: boolean) => store.commit('channels/showUploadModal', { sh
 
 const { $npgettext, $gettext } = useGettext()
 
+const uploadForm = ref()
+
 const statusData = ref()
 const statusInfo = computed(() => {
   if (!statusData.value) {
@@ -112,7 +114,7 @@ const isLoading = ref(false)
       <button
         v-else-if="step < 3"
         class="ui basic button"
-        @click.stop.prevent="$refs.uploadForm.step -= 1"
+        @click.stop.prevent="uploadForm.step -= 1"
       >
         <translate translate-context="*/*/Button.Label/Verb">
           Previous step
@@ -121,7 +123,7 @@ const isLoading = ref(false)
       <button
         v-else-if="step === 3"
         class="ui basic button"
-        @click.stop.prevent="$refs.uploadForm.step -= 1"
+        @click.stop.prevent="uploadForm.step -= 1"
       >
         <translate translate-context="*/*/Button.Label/Verb">
           Update
@@ -130,7 +132,7 @@ const isLoading = ref(false)
       <button
         v-if="step === 1"
         class="ui primary button"
-        @click.stop.prevent="$refs.uploadForm.step += 1"
+        @click.stop.prevent="uploadForm.step += 1"
       >
         <translate translate-context="*/*/Button.Label">
           Next step
@@ -144,7 +146,7 @@ const isLoading = ref(false)
           :class="['ui', 'primary button', {loading: isLoading}]"
           type="submit"
           :disabled="!statusData?.canSubmit || undefined"
-          @click.prevent.stop="$refs.uploadForm.publish"
+          @click.prevent.stop="uploadForm.publish"
         >
           <translate translate-context="*/Channels/Button.Label">
             Publish
diff --git a/front/src/components/common/ActorLink.vue b/front/src/components/common/ActorLink.vue
index dfcb7ad7b..49c819744 100644
--- a/front/src/components/common/ActorLink.vue
+++ b/front/src/components/common/ActorLink.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import type { Actor } from '~/types'
+
 import { toRefs } from '@vueuse/core'
 import { computed } from 'vue'
 import { truncate } from '~/utils/filters'
-import { Actor } from '~/types'
 
 interface Props {
   actor: Actor
diff --git a/front/src/components/common/AttachmentInput.vue b/front/src/components/common/AttachmentInput.vue
index ab9c9c845..97aa84555 100644
--- a/front/src/components/common/AttachmentInput.vue
+++ b/front/src/components/common/AttachmentInput.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import type { BackendError } from '~/types'
+
 import axios from 'axios'
 import { useVModel } from '@vueuse/core'
 import { reactive, ref, watch } from 'vue'
-import { BackendError } from '~/types'
 import { useStore } from '~/store'
 import useFormData from '~/composables/useFormData'
 
@@ -26,7 +27,7 @@ const value = useVModel(props, 'modelValue', emit)
 
 const attachment = ref()
 const isLoading = ref(false)
-const errors = reactive([] as Error[])
+const errors = reactive([] as string[])
 const attachmentId = Math.random().toString(36).substring(7)
 
 const input = ref()
diff --git a/front/src/components/favorites/List.vue b/front/src/components/favorites/List.vue
index c23667798..2f7ff7102 100644
--- a/front/src/components/favorites/List.vue
+++ b/front/src/components/favorites/List.vue
@@ -1,5 +1,9 @@
 <script setup lang="ts">
-import { RouteWithPreferences } from '~/store/ui'
+import type { RouteWithPreferences } from '~/store/ui'
+import type { Track } from '~/types'
+import type { OrderingField } from '~/store/ui'
+import type { OrderingProps } from '~/composables/useOrdering'
+
 import axios from 'axios'
 import $ from 'jquery'
 import RadioButton from '~/components/radios/Button.vue'
@@ -8,13 +12,11 @@ import { checkRedirectToLogin } from '~/utils'
 import TrackTable from '~/components/audio/track/Table.vue'
 import useLogger from '~/composables/useLogger'
 import useSharedLabels from '~/composables/locale/useSharedLabels'
-import useOrdering, { OrderingProps } from '~/composables/useOrdering'
+import useOrdering from '~/composables/useOrdering'
 import { onBeforeRouteUpdate, useRouter } from 'vue-router'
 import { computed, onMounted, reactive, ref, watch } from 'vue'
 import { useStore } from '~/store'
-import { Track } from '~/types'
 import { useGettext } from 'vue3-gettext'
-import { OrderingField } from '~/store/ui'
 
 interface Props extends OrderingProps {
   defaultPage?: number
diff --git a/front/src/components/library/AlbumBase.vue b/front/src/components/library/AlbumBase.vue
index 9ecddf3e6..c36ee3421 100644
--- a/front/src/components/library/AlbumBase.vue
+++ b/front/src/components/library/AlbumBase.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Track, Album, Artist, Library } from '~/types'
+import type { Track, Album, Artist, Library } from '~/types'
+
 import axios from 'axios'
 import { sum } from 'lodash-es'
 import { useGettext } from 'vue3-gettext'
diff --git a/front/src/components/library/AlbumDropdown.vue b/front/src/components/library/AlbumDropdown.vue
index d21517bb8..deb802f6a 100644
--- a/front/src/components/library/AlbumDropdown.vue
+++ b/front/src/components/library/AlbumDropdown.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Album, Artist, Library } from '~/types'
+import type { Album, Artist, Library } from '~/types'
+
 import EmbedWizard from '~/components/audio/EmbedWizard.vue'
 import Modal from '~/components/semantic/Modal.vue'
 import useReport from '~/composables/moderation/useReport'
diff --git a/front/src/components/library/ArtistBase.vue b/front/src/components/library/ArtistBase.vue
index d184c8732..2ef1a933b 100644
--- a/front/src/components/library/ArtistBase.vue
+++ b/front/src/components/library/ArtistBase.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Track, Album, Artist, Library } from '~/types'
+import type { Track, Album, Artist, Library } from '~/types'
+
 import { useGettext } from 'vue3-gettext'
 import axios from 'axios'
 import PlayButton from '~/components/audio/PlayButton.vue'
diff --git a/front/src/components/library/FsBrowser.vue b/front/src/components/library/FsBrowser.vue
index eb4c9334f..b82d8967d 100644
--- a/front/src/components/library/FsBrowser.vue
+++ b/front/src/components/library/FsBrowser.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
+import type { FileSystem, FSEntry } from '~/types'
+
 import { useVModel } from '@vueuse/core'
-import { FileSystem, FSEntry } from '~/types'
 
 interface Props {
   data: FileSystem
diff --git a/front/src/components/library/FsLogs.vue b/front/src/components/library/FsLogs.vue
index d3a32cac5..40b556b1e 100644
--- a/front/src/components/library/FsLogs.vue
+++ b/front/src/components/library/FsLogs.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { FSLogs } from '~/types'
+import type { FSLogs } from '~/types'
 
 interface Props {
   data: FSLogs
diff --git a/front/src/components/library/TrackBase.vue b/front/src/components/library/TrackBase.vue
index efd3ac8c8..70cdf61c8 100644
--- a/front/src/components/library/TrackBase.vue
+++ b/front/src/components/library/TrackBase.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Track, Artist, Library } from '~/types'
+import type { Track, Artist, Library } from '~/types'
+
 import { useGettext } from 'vue3-gettext'
 import axios from 'axios'
 import PlayButton from '~/components/audio/PlayButton.vue'
diff --git a/front/src/components/manage/library/LibrariesTable.vue b/front/src/components/manage/library/LibrariesTable.vue
index 8083a7fe9..363759d8a 100644
--- a/front/src/components/manage/library/LibrariesTable.vue
+++ b/front/src/components/manage/library/LibrariesTable.vue
@@ -1,13 +1,16 @@
 <script setup lang="ts">
-import { PrivacyLevel } from '~/types'
-import { RouteWithPreferences } from '~/store/ui'
+import type { PrivacyLevel } from '~/types'
+import type { RouteWithPreferences } from '~/store/ui'
+import type { OrderingField } from '~/store/ui'
+import type { SmartSearchProps } from '~/composables/useSmartSearch'
+import type { OrderingProps } from '~/composables/useOrdering'
+
 import axios from 'axios'
 import Pagination from '~/components/vui/Pagination.vue'
 import ActionTable from '~/components/common/ActionTable.vue'
 import useSharedLabels from '~/composables/locale/useSharedLabels'
-import useSmartSearch, { SmartSearchProps } from '~/composables/useSmartSearch'
-import useOrdering, { OrderingProps } from '~/composables/useOrdering'
-import { OrderingField } from '~/store/ui'
+import useSmartSearch from '~/composables/useSmartSearch'
+import useOrdering from '~/composables/useOrdering'
 import { computed, ref, watch } from 'vue'
 import { useGettext } from 'vue3-gettext'
 
diff --git a/front/src/components/manage/library/UploadsTable.vue b/front/src/components/manage/library/UploadsTable.vue
index 528e530f0..c76a46164 100644
--- a/front/src/components/manage/library/UploadsTable.vue
+++ b/front/src/components/manage/library/UploadsTable.vue
@@ -1,6 +1,11 @@
 <script setup lang="ts">
-import { ImportStatus, PrivacyLevel } from '~/types'
-import { RouteWithPreferences } from '~/store/ui'
+import type { ImportStatus, PrivacyLevel } from '~/types'
+import type { RouteWithPreferences } from '~/store/ui'
+import type { OrderingField } from '~/store/ui'
+import type { Upload } from '~/types'
+import type { OrderingProps } from '~/composables/useOrdering'
+import type { SmartSearchProps } from '~/composables/useSmartSearch'
+
 import axios from 'axios'
 import Pagination from '~/components/vui/Pagination.vue'
 import ActionTable from '~/components/common/ActionTable.vue'
@@ -9,10 +14,8 @@ import { humanSize, truncate } from '~/utils/filters'
 import useSharedLabels from '~/composables/locale/useSharedLabels'
 import { ref, computed, watch } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import useOrdering, { OrderingProps } from '~/composables/useOrdering'
-import useSmartSearch, { SmartSearchProps } from '~/composables/useSmartSearch'
-import { OrderingField } from '~/store/ui'
-import { Upload } from '~/types'
+import useOrdering from '~/composables/useOrdering'
+import useSmartSearch from '~/composables/useSmartSearch'
 
 interface Props extends SmartSearchProps, OrderingProps {
   // TODO (wvffle): find object type
diff --git a/front/src/components/playlists/PlaylistModal.vue b/front/src/components/playlists/PlaylistModal.vue
index 3f023f30e..65b2e433a 100644
--- a/front/src/components/playlists/PlaylistModal.vue
+++ b/front/src/components/playlists/PlaylistModal.vue
@@ -1,15 +1,14 @@
 <script setup lang="ts">
-import { filter, sortBy, flow } from 'lodash-es'
+import type { BackendError, Playlist, APIErrorResponse } from '~/types'
 
+import { filter, sortBy, flow } from 'lodash-es'
 import axios from 'axios'
 import { useGettext } from 'vue3-gettext'
-
 import Modal from '~/components/semantic/Modal.vue'
 import PlaylistForm from '~/components/playlists/Form.vue'
 import useLogger from '~/composables/useLogger'
 import { useStore } from '~/store'
 import { ref, computed, watch } from 'vue'
-import { BackendError, Playlist, APIErrorResponse } from '~/types'
 import { useRouter } from 'vue-router'
 
 const logger = useLogger()
@@ -90,7 +89,7 @@ const addToPlaylist = async (playlistId: number, allowDuplicates: boolean) => {
             Add to playlist
           </translate>
           <div
-            v-translate="{artist: track.artist.name, title: track.title}"
+            v-translate="{artist: track.artist?.name, title: track.title}"
             class="ui sub header"
             translate-context="Popup/Playlist/Paragraph"
             :translate-params="{artist: track.artist.name, title: track.title}"
diff --git a/front/src/composables/audio/usePlayOptions.ts b/front/src/composables/audio/usePlayOptions.ts
index d93c6c2b9..9e880522e 100644
--- a/front/src/composables/audio/usePlayOptions.ts
+++ b/front/src/composables/audio/usePlayOptions.ts
@@ -1,9 +1,10 @@
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { ContentFilter } from '~/store/moderation'
+
 import { useStore } from '~/store'
 import { useGettext } from 'vue3-gettext'
 import { computed, ref } from "vue"
 import axios from 'axios'
-import { ContentFilter } from '~/store/moderation'
 import usePlayer from '~/composables/audio/usePlayer'
 import useQueue from '~/composables/audio/useQueue'
 import { useCurrentElement } from '@vueuse/core'
diff --git a/front/src/composables/audio/usePlayer.ts b/front/src/composables/audio/usePlayer.ts
index 0d27a8ed9..7b3c769d7 100644
--- a/front/src/composables/audio/usePlayer.ts
+++ b/front/src/composables/audio/usePlayer.ts
@@ -1,4 +1,5 @@
-import { Track } from '~/types'
+import type { Track } from '~/types'
+
 import { computed, watchEffect, ref, watch } from 'vue'
 import { Howler } from 'howler'
 import { useIntervalFn, useTimeoutFn } from '@vueuse/core'
diff --git a/front/src/composables/audio/useQueue.ts b/front/src/composables/audio/useQueue.ts
index ac2cc8dc0..71a5161fc 100644
--- a/front/src/composables/audio/useQueue.ts
+++ b/front/src/composables/audio/useQueue.ts
@@ -1,8 +1,9 @@
+import type { Track } from "~/types"
+
 import { useTimeoutFn, useThrottleFn, useTimeAgo, useNow, whenever } from '@vueuse/core'
 import { Howler } from 'howler'
 import { gettext } from '~/init/locale'
 import { ref, computed } from "vue"
-import { Track } from "~/types"
 import { sum } from 'lodash-es'
 import store from "~/store"
 
diff --git a/front/src/composables/audio/useSound.ts b/front/src/composables/audio/useSound.ts
index 5cc8c3de3..029d2f74e 100644
--- a/front/src/composables/audio/useSound.ts
+++ b/front/src/composables/audio/useSound.ts
@@ -1,5 +1,6 @@
+import type { Track } from '~/types'
+
 import { ref, computed } from "vue"
-import { Track } from '~/types'
 import { Howl } from 'howler'
 import useTrackSources from '~/composables/audio/useTrackSources'
 import useSoundCache from '~/composables/audio/useSoundCache'
diff --git a/front/src/composables/audio/useSoundCache.ts b/front/src/composables/audio/useSoundCache.ts
index 1ef812c47..8d88a0b4c 100644
--- a/front/src/composables/audio/useSoundCache.ts
+++ b/front/src/composables/audio/useSoundCache.ts
@@ -1,4 +1,5 @@
-import { Howl } from "howler"
+import type { Howl } from "howler"
+
 import { sortBy } from "lodash-es"
 import { reactive, watchEffect, ref } from "vue"
 
diff --git a/front/src/composables/audio/useTrackSources.ts b/front/src/composables/audio/useTrackSources.ts
index c6c1e2e2b..44e113b9a 100644
--- a/front/src/composables/audio/useTrackSources.ts
+++ b/front/src/composables/audio/useTrackSources.ts
@@ -1,4 +1,5 @@
-import { Track } from "~/types"
+import type { Track } from "~/types"
+
 import store from '~/store'
 import updateQueryString from '~/composables/updateQueryString'
 
diff --git a/front/src/composables/locale/useSharedLabels.ts b/front/src/composables/locale/useSharedLabels.ts
index 512dbc3f7..17710fd70 100644
--- a/front/src/composables/locale/useSharedLabels.ts
+++ b/front/src/composables/locale/useSharedLabels.ts
@@ -1,5 +1,6 @@
+import type { PrivacyLevel, ImportStatus } from '~/types'
+
 import { gettext } from '~/init/locale'
-import { PrivacyLevel, ImportStatus } from '~/types'
 
 const { $pgettext } = gettext
 
diff --git a/front/src/composables/moderation/useEditConfigs.ts b/front/src/composables/moderation/useEditConfigs.ts
index cf1b49613..7b7353300 100644
--- a/front/src/composables/moderation/useEditConfigs.ts
+++ b/front/src/composables/moderation/useEditConfigs.ts
@@ -1,5 +1,6 @@
+import type { Album, Artist, Content, Track } from '~/types'
+
 import { gettext } from '~/init/locale'
-import { Album, Artist, Content, Track } from '~/types'
 
 interface ConfigField {
   id: string
diff --git a/front/src/composables/moderation/useReport.ts b/front/src/composables/moderation/useReport.ts
index 1c97cf289..7d4142007 100644
--- a/front/src/composables/moderation/useReport.ts
+++ b/front/src/composables/moderation/useReport.ts
@@ -1,4 +1,5 @@
-import { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+import type { Track, Artist, Album, Playlist, Library, Channel, Actor } from '~/types'
+
 import { gettext } from '~/init/locale'
 import store from '~/store'
 const { $pgettext } = gettext
diff --git a/front/src/composables/moderation/useReportConfigs.ts b/front/src/composables/moderation/useReportConfigs.ts
index 7a94b752b..e67d60dcf 100644
--- a/front/src/composables/moderation/useReportConfigs.ts
+++ b/front/src/composables/moderation/useReportConfigs.ts
@@ -1,5 +1,6 @@
+import type { RouteLocationRaw } from 'vue-router'
+
 import { gettext } from '~/init/locale'
-import { RouteLocationRaw } from 'vue-router'
 
 interface ModeratedField {
   id: string
diff --git a/front/src/composables/useLogger.ts b/front/src/composables/useLogger.ts
index 94d005bfc..660c79385 100644
--- a/front/src/composables/useLogger.ts
+++ b/front/src/composables/useLogger.ts
@@ -1,4 +1,5 @@
 import Logger from 'js-logger'
+
 Logger.useDefaults({
   defaultLevel: import.meta.env.DEV
     ? Logger.DEBUG
diff --git a/front/src/composables/useOrdering.ts b/front/src/composables/useOrdering.ts
index d508e0788..df51bf505 100644
--- a/front/src/composables/useOrdering.ts
+++ b/front/src/composables/useOrdering.ts
@@ -1,8 +1,10 @@
-import { MaybeRef, reactiveComputed, toRefs } from '@vueuse/core'
+import type { OrderingDirection, OrderingField, RouteWithPreferences } from '~/store/ui'
+import type { MaybeRef } from '@vueuse/core'
+
+import { reactiveComputed, toRefs } from '@vueuse/core'
 import { computed, unref, watch } from 'vue'
 import { useRoute } from 'vue-router'
 import { useStore } from '~/store'
-import { OrderingDirection, OrderingField, RouteWithPreferences } from '~/store/ui'
 
 export interface OrderingProps {
   orderingConfigName: RouteWithPreferences | null
diff --git a/front/src/composables/useSmartSearch.ts b/front/src/composables/useSmartSearch.ts
index d275d0bed..892b08d56 100644
--- a/front/src/composables/useSmartSearch.ts
+++ b/front/src/composables/useSmartSearch.ts
@@ -1,7 +1,10 @@
-import { MaybeRef, refWithControl } from '@vueuse/core'
+import type { MaybeRef } from '@vueuse/core'
+import type { Token } from '~/utils/search'
+
+import { refWithControl } from '@vueuse/core'
 import { computed, ref, unref, watch } from 'vue'
 import { useRouter } from 'vue-router'
-import { compileTokens, normalizeQuery, parseTokens, Token } from '~/utils/search'
+import { compileTokens, normalizeQuery, parseTokens } from '~/utils/search'
 
 export interface SmartSearchProps {
   defaultQuery?: string
diff --git a/front/src/composables/useThemeList.ts b/front/src/composables/useThemeList.ts
index 8d6ea3b02..cb2c25c01 100644
--- a/front/src/composables/useThemeList.ts
+++ b/front/src/composables/useThemeList.ts
@@ -1,4 +1,5 @@
 import type { ThemeEntry } from '~/types'
+
 import { gettext } from '~/init/locale'
 
 const { $pgettext } = gettext
diff --git a/front/src/composables/useWebSocketHandler.ts b/front/src/composables/useWebSocketHandler.ts
index eec7305f8..18e9df9a1 100644
--- a/front/src/composables/useWebSocketHandler.ts
+++ b/front/src/composables/useWebSocketHandler.ts
@@ -1,7 +1,8 @@
+import type { WebSocketEvent } from '~/types'
+import type { WebSocketEventName } from '~/store/ui'
+
 import store from '~/store'
 import { tryOnScopeDispose } from '@vueuse/core'
-import { WebSocketEvent } from '~/types'
-import { WebSocketEventName } from '~/store/ui'
 
 export default (eventName: WebSocketEventName, handler: (event: WebSocketEvent) => void) => {
   const id = `${+new Date() + Math.random()}`
diff --git a/front/src/init/axios.ts b/front/src/init/axios.ts
index 9a3093d5d..0d8d2e6ec 100644
--- a/front/src/init/axios.ts
+++ b/front/src/init/axios.ts
@@ -1,4 +1,4 @@
-import { APIErrorResponse, BackendError, InitModule, RateLimitStatus } from '~/types'
+import type { APIErrorResponse, BackendError, InitModule, RateLimitStatus } from '~/types'
 
 import createAuthRefreshInterceptor from 'axios-auth-refresh'
 import axios, { AxiosError } from 'axios'
diff --git a/front/src/init/directives.ts b/front/src/init/directives.ts
index 1e806b2b5..0ebce0ea2 100644
--- a/front/src/init/directives.ts
+++ b/front/src/init/directives.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import jQuery from '~/jquery'
 
 export const install: InitModule = ({ app, store }) => {
diff --git a/front/src/init/globalComponents.ts b/front/src/init/globalComponents.ts
index 654f9aad7..68ea6696a 100644
--- a/front/src/init/globalComponents.ts
+++ b/front/src/init/globalComponents.ts
@@ -1,4 +1,4 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
 
 import HumanDate from '~/components/common/HumanDate.vue'
 import HumanDuration from '~/components/common/HumanDuration.vue'
diff --git a/front/src/init/instance.ts b/front/src/init/instance.ts
index 2e47d483a..2282ec60b 100644
--- a/front/src/init/instance.ts
+++ b/front/src/init/instance.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import { watch } from 'vue'
 import axios from 'axios'
 
diff --git a/front/src/init/internalLinks.ts b/front/src/init/internalLinks.ts
index 31b1db7e1..6b2b3092d 100644
--- a/front/src/init/internalLinks.ts
+++ b/front/src/init/internalLinks.ts
@@ -1,10 +1,10 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
 
 // slight hack to allow use to have internal links in <translate> tags
 // while preserving router behaviour
 export const install: InitModule = ({ router }) => {
   document.documentElement.addEventListener('click', async (event) => {
-    const target = <HTMLAnchorElement> event.target
+    const target = event.target as HTMLAnchorElement
     if (!target.matches('a.internal')) return
 
     event.preventDefault()
diff --git a/front/src/init/lazyLoad.ts b/front/src/init/lazyLoad.ts
index 56065c20c..f3b1775c1 100644
--- a/front/src/init/lazyLoad.ts
+++ b/front/src/init/lazyLoad.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import VueLazyload from 'vue3-lazyload'
 
 export const install: InitModule = ({ app }) => {
diff --git a/front/src/init/locale.ts b/front/src/init/locale.ts
index 9073a7f0a..80fbac860 100644
--- a/front/src/init/locale.ts
+++ b/front/src/init/locale.ts
@@ -1,8 +1,9 @@
+import type { InitModule } from '~/types'
+
 import { watch } from 'vue'
 import locales from '~/locales.json'
 import { usePreferredLanguages } from '@vueuse/core'
 import { createGettext } from 'vue3-gettext'
-import { InitModule } from '~/types'
 import store from '~/store'
 
 const defaultLanguage = store.state.ui.currentLanguage ?? 'en_US'
diff --git a/front/src/init/mediaSession.ts b/front/src/init/mediaSession.ts
index a3ea62148..67d74be97 100644
--- a/front/src/init/mediaSession.ts
+++ b/front/src/init/mediaSession.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import { whenever } from '@vueuse/core'
 import useQueue from '~/composables/audio/useQueue'
 import usePlayer from '~/composables/audio/usePlayer'
diff --git a/front/src/init/serviceWorker.ts b/front/src/init/serviceWorker.ts
index 9bcd49d82..f523a0cb5 100644
--- a/front/src/init/serviceWorker.ts
+++ b/front/src/init/serviceWorker.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import { registerSW } from 'virtual:pwa-register'
 import useLogger from '~/composables/useLogger'
 import { gettext } from '~/init/locale'
diff --git a/front/src/init/webSocket.ts b/front/src/init/webSocket.ts
index 3177596b6..2f1917cae 100644
--- a/front/src/init/webSocket.ts
+++ b/front/src/init/webSocket.ts
@@ -1,10 +1,5 @@
-import {
-  InitModule,
-  ListenWSEvent,
-  PendingReviewEditsWSEvent,
-  PendingReviewReportsWSEvent,
-  PendingReviewRequestsWSEvent,
-} from '~/types'
+import type { InitModule, ListenWSEvent, PendingReviewEditsWSEvent, PendingReviewReportsWSEvent, PendingReviewRequestsWSEvent } from '~/types'
+
 import { watchEffect, watch } from 'vue'
 import { useWebSocket, whenever } from '@vueuse/core'
 import useWebSocketHandler from '~/composables/useWebSocketHandler'
diff --git a/front/src/init/window.ts b/front/src/init/window.ts
index ce18e7c8f..f581dc537 100644
--- a/front/src/init/window.ts
+++ b/front/src/init/window.ts
@@ -1,4 +1,5 @@
-import { InitModule } from '~/types'
+import type { InitModule } from '~/types'
+
 import { useWindowSize } from '@vueuse/core'
 import { watchEffect } from 'vue'
 
diff --git a/front/src/router/guards.ts b/front/src/router/guards.ts
index 9b0379b3e..f0804e492 100644
--- a/front/src/router/guards.ts
+++ b/front/src/router/guards.ts
@@ -1,6 +1,7 @@
 
-import { NavigationGuardNext, RouteLocationNormalized } from 'vue-router'
-import { Permission } from '~/store/auth'
+import type { NavigationGuardNext, RouteLocationNormalized } from 'vue-router'
+import type { Permission } from '~/store/auth'
+
 import store from '~/store'
 
 export const hasPermissions = (permission: Permission) => (to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
diff --git a/front/src/router/routes/auth.ts b/front/src/router/routes/auth.ts
index ab8e8f09d..0ade5cb5d 100644
--- a/front/src/router/routes/auth.ts
+++ b/front/src/router/routes/auth.ts
@@ -1,4 +1,4 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
 
 export default [
   {
diff --git a/front/src/router/routes/content.ts b/front/src/router/routes/content.ts
index 5091c791b..f95a8dece 100644
--- a/front/src/router/routes/content.ts
+++ b/front/src/router/routes/content.ts
@@ -1,4 +1,4 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
 
 export default [
   {
diff --git a/front/src/router/routes/index.ts b/front/src/router/routes/index.ts
index eccbde829..730b23f3b 100644
--- a/front/src/router/routes/index.ts
+++ b/front/src/router/routes/index.ts
@@ -1,4 +1,5 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
+
 import settings from './settings'
 import library from './library'
 import content from './content'
diff --git a/front/src/router/routes/library.ts b/front/src/router/routes/library.ts
index d799b28eb..8b79a5c60 100644
--- a/front/src/router/routes/library.ts
+++ b/front/src/router/routes/library.ts
@@ -1,4 +1,4 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
 
 export default [
   {
diff --git a/front/src/router/routes/manage.ts b/front/src/router/routes/manage.ts
index b10eb2f0f..00e1854dd 100644
--- a/front/src/router/routes/manage.ts
+++ b/front/src/router/routes/manage.ts
@@ -1,4 +1,5 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
+
 import { hasPermissions } from '~/router/guards'
 
 export default [
diff --git a/front/src/router/routes/settings.ts b/front/src/router/routes/settings.ts
index 2d4f1185b..e5010f51b 100644
--- a/front/src/router/routes/settings.ts
+++ b/front/src/router/routes/settings.ts
@@ -1,4 +1,4 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
 
 export default [
   {
diff --git a/front/src/router/routes/user.ts b/front/src/router/routes/user.ts
index b6c44d97f..61c0721f0 100644
--- a/front/src/router/routes/user.ts
+++ b/front/src/router/routes/user.ts
@@ -1,4 +1,5 @@
-import { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
+
 import store from '~/store'
 
 export default [
diff --git a/front/src/store/auth.ts b/front/src/store/auth.ts
index f814e41e3..540a510ec 100644
--- a/front/src/store/auth.ts
+++ b/front/src/store/auth.ts
@@ -1,7 +1,8 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 import useFormData from '~/composables/useFormData'
 
 export type Permission = 'settings' | 'library' | 'moderation'
diff --git a/front/src/store/channels.ts b/front/src/store/channels.ts
index 002294446..874d547f7 100644
--- a/front/src/store/channels.ts
+++ b/front/src/store/channels.ts
@@ -1,7 +1,8 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   subscriptions: string[]
diff --git a/front/src/store/favorites.ts b/front/src/store/favorites.ts
index cfea25a88..36df21b96 100644
--- a/front/src/store/favorites.ts
+++ b/front/src/store/favorites.ts
@@ -1,7 +1,8 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   tracks: string[]
diff --git a/front/src/store/index.ts b/front/src/store/index.ts
index d66417c9e..f2f824959 100644
--- a/front/src/store/index.ts
+++ b/front/src/store/index.ts
@@ -1,18 +1,29 @@
+import type { InjectionKey } from 'vue'
+import type { State as FavoritesState } from './favorites'
+import type { State as ChannelsState } from './channels'
+import type { State as LibrariesState } from './libraries'
+import type { State as AuthState } from './auth'
+import type { State as InstanceState } from './instance'
+import type { State as ModerationState } from './moderation'
+import type { State as QueueState } from './queue'
+import type { State as RadiosState } from './radios'
+import type { State as PlayerState } from './player'
+import type { State as PlaylistsState } from './playlists'
+import type { State as UiState } from './ui'
+
 import { createStore, Store, useStore as baseUseStore } from 'vuex'
 import createPersistedState from 'vuex-persistedstate'
-
-import favorites, { State as FavoritesState } from './favorites'
-import channels, { State as ChannelsState } from './channels'
-import libraries, { State as LibrariesState } from './libraries'
-import auth, { State as AuthState } from './auth'
-import instance, { State as InstanceState } from './instance'
-import moderation, { State as ModerationState } from './moderation'
-import queue, { State as QueueState } from './queue'
-import radios, { State as RadiosState } from './radios'
-import player, { State as PlayerState } from './player'
-import playlists, { State as PlaylistsState } from './playlists'
-import ui, { State as UiState } from './ui'
-import { InjectionKey } from 'vue'
+import favorites from './favorites'
+import channels from './channels'
+import libraries from './libraries'
+import auth from './auth'
+import instance from './instance'
+import moderation from './moderation'
+import queue from './queue'
+import radios from './radios'
+import player from './player'
+import playlists from './playlists'
+import ui from './ui'
 
 export interface RootState {
   ui: UiState
diff --git a/front/src/store/instance.ts b/front/src/store/instance.ts
index 630f4ae28..7ac0da73a 100644
--- a/front/src/store/instance.ts
+++ b/front/src/store/instance.ts
@@ -1,8 +1,9 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import { merge } from 'lodash-es'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   frontSettings: FrontendSettings
diff --git a/front/src/store/libraries.ts b/front/src/store/libraries.ts
index b0229335a..679045ae4 100644
--- a/front/src/store/libraries.ts
+++ b/front/src/store/libraries.ts
@@ -1,7 +1,8 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   followsByLibrary: {
diff --git a/front/src/store/moderation.ts b/front/src/store/moderation.ts
index c73750ff0..6da3dc7f1 100644
--- a/front/src/store/moderation.ts
+++ b/front/src/store/moderation.ts
@@ -1,8 +1,9 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import { sortBy } from 'lodash-es'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   filters: ContentFilter[],
diff --git a/front/src/store/player.ts b/front/src/store/player.ts
index ea88ba018..ecd3c8a71 100644
--- a/front/src/store/player.ts
+++ b/front/src/store/player.ts
@@ -1,8 +1,9 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import time from '~/utils/time'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   maxConsecutiveErrors: number
diff --git a/front/src/store/playlists.ts b/front/src/store/playlists.ts
index 87f3fbd1d..2eb90c351 100644
--- a/front/src/store/playlists.ts
+++ b/front/src/store/playlists.ts
@@ -1,7 +1,8 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+import type { Playlist, Track } from '~/types'
+
 import axios from 'axios'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
-import { Playlist, Track } from '~/types'
 
 export interface State {
   playlists: Playlist[]
diff --git a/front/src/store/queue.ts b/front/src/store/queue.ts
index 3f603d58f..b817ab92f 100644
--- a/front/src/store/queue.ts
+++ b/front/src/store/queue.ts
@@ -1,8 +1,9 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+import type { Track } from '~/types'
+
 import { shuffle } from 'lodash-es'
 import useLogger from '~/composables/useLogger'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
-import { Track } from '~/types'
 
 export interface State {
   tracks: Track[]
diff --git a/front/src/store/radios.ts b/front/src/store/radios.ts
index 1c520c1e0..f099c0ed0 100644
--- a/front/src/store/radios.ts
+++ b/front/src/store/radios.ts
@@ -1,8 +1,9 @@
+import type { Dispatch, Module } from 'vuex'
+import type { RootState } from '~/store/index'
+
 import axios from 'axios'
 import { CLIENT_RADIOS } from '~/utils/clientRadios'
 import useLogger from '~/composables/useLogger'
-import { Dispatch, Module } from 'vuex'
-import { RootState } from '~/store/index'
 
 export interface State {
   current: null | CurrentRadio
diff --git a/front/src/store/ui.ts b/front/src/store/ui.ts
index 86d28c186..1846639ca 100644
--- a/front/src/store/ui.ts
+++ b/front/src/store/ui.ts
@@ -1,8 +1,9 @@
+import type { Module } from 'vuex'
+import type { RootState } from '~/store/index'
+import type { availableLanguages } from '~/init/locale'
+
 import axios from 'axios'
 import moment from 'moment'
-import { Module } from 'vuex'
-import { RootState } from '~/store/index'
-import { availableLanguages } from '~/init/locale'
 
 type SupportedExtension = 'flac' | 'ogg' | 'mp3' | 'opus' | 'aac' | 'm4a' | 'aiff' | 'aif'
 
diff --git a/front/src/utils/clientRadios.ts b/front/src/utils/clientRadios.ts
index 7c8be258f..51884859e 100644
--- a/front/src/utils/clientRadios.ts
+++ b/front/src/utils/clientRadios.ts
@@ -1,9 +1,10 @@
+import type { ListenWSEvent } from '~/types'
+import type { RootState } from '~/store'
+import type { Store } from 'vuex'
+import type { CurrentRadio, PopulateQueuePayload } from '~/store/radios'
+
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
-import { ListenWSEvent } from '~/types'
-import { RootState } from '~/store'
-import { Store } from 'vuex'
-import { CurrentRadio, PopulateQueuePayload } from '~/store/radios'
 
 const logger = useLogger()
 
diff --git a/front/src/utils/index.ts b/front/src/utils/index.ts
index 30374c7fc..49835de88 100644
--- a/front/src/utils/index.ts
+++ b/front/src/utils/index.ts
@@ -1,8 +1,8 @@
 import { startCase } from 'lodash-es'
-import { Store } from 'vuex'
-import { Router } from 'vue-router'
-import { APIErrorResponse } from '~/types'
-import { RootState } from '~/store'
+import type { Store } from 'vuex'
+import type { Router } from 'vue-router'
+import type { APIErrorResponse } from '~/types'
+import type { RootState } from '~/store'
 
 export function setUpdate (obj: object, statuses: Record<string, unknown>, value: unknown) {
   for (const key of Object.keys(obj)) {
diff --git a/front/src/views/Search.vue b/front/src/views/Search.vue
index 078b98121..774dbcef0 100644
--- a/front/src/views/Search.vue
+++ b/front/src/views/Search.vue
@@ -289,7 +289,8 @@ const radioConfig = computed(() => {
               v-if="results[t.id]"
               class="ui circular mini right floated label"
             >
-              {{ results[t.id].count }}</span>
+              {{ results[t.id]?.count ?? 0 }}
+            </span>
           </a>
         </div>
         <div v-if="isLoading">
diff --git a/front/src/views/auth/ProfileBase.vue b/front/src/views/auth/ProfileBase.vue
index d4ac719d0..a77e3196c 100644
--- a/front/src/views/auth/ProfileBase.vue
+++ b/front/src/views/auth/ProfileBase.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Actor } from '~/types'
+import type { Actor } from '~/types'
+
 import axios from 'axios'
 import useReport from '~/composables/moderation/useReport'
 import { onBeforeRouteUpdate } from 'vue-router'
diff --git a/front/src/views/channels/DetailBase.vue b/front/src/views/channels/DetailBase.vue
index b324a127d..41cd105b6 100644
--- a/front/src/views/channels/DetailBase.vue
+++ b/front/src/views/channels/DetailBase.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Channel } from '~/types'
+import type { Channel } from '~/types'
+
 import axios from 'axios'
 import PlayButton from '~/components/audio/PlayButton.vue'
 import EmbedWizard from '~/components/audio/EmbedWizard.vue'
@@ -445,7 +446,7 @@ const updateSubscriptionCount = (delta: number) => {
                 <div class="scrolling content">
                   <div class="description">
                     <embed-wizard
-                      :id="object.artist?.id"
+                      :id="object.artist!.id"
                       type="artist"
                     />
                   </div>
diff --git a/front/src/views/content/libraries/FilesTable.vue b/front/src/views/content/libraries/FilesTable.vue
index df7bafe9d..eacbeeec8 100644
--- a/front/src/views/content/libraries/FilesTable.vue
+++ b/front/src/views/content/libraries/FilesTable.vue
@@ -1,6 +1,10 @@
 <script setup lang="ts">
-import { ImportStatus } from '~/types'
-import { RouteWithPreferences } from '~/store/ui'
+import type { ImportStatus } from '~/types'
+import type { RouteWithPreferences } from '~/store/ui'
+import type { OrderingField } from '~/store/ui'
+import type { OrderingProps } from '~/composables/useOrdering'
+import type { SmartSearchProps } from '~/composables/useSmartSearch'
+
 import axios from 'axios'
 import time from '~/utils/time'
 import Pagination from '~/components/vui/Pagination.vue'
@@ -10,9 +14,8 @@ import { humanSize, truncate } from '~/utils/filters'
 import useSharedLabels from '~/composables/locale/useSharedLabels'
 import { computed, ref, watch } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import useOrdering, { OrderingProps } from '~/composables/useOrdering'
-import useSmartSearch, { SmartSearchProps } from '~/composables/useSmartSearch'
-import { OrderingField } from '~/store/ui'
+import useOrdering from '~/composables/useOrdering'
+import useSmartSearch from '~/composables/useSmartSearch'
 
 interface Props extends SmartSearchProps, OrderingProps {
   // TODO (wvffle): find object type
diff --git a/front/src/views/content/remote/Card.vue b/front/src/views/content/remote/Card.vue
index 94e0b9bd6..34108bad1 100644
--- a/front/src/views/content/remote/Card.vue
+++ b/front/src/views/content/remote/Card.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Library } from '~/types'
+import type { Library } from '~/types'
+
 import axios from 'axios'
 import RadioButton from '~/components/radios/Button.vue'
 import useReport from '~/composables/moderation/useReport'
diff --git a/front/src/views/library/DetailBase.vue b/front/src/views/library/DetailBase.vue
index 86d05473d..889c4d506 100644
--- a/front/src/views/library/DetailBase.vue
+++ b/front/src/views/library/DetailBase.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 // TODO (wvffle): Rename to LibraryBase
-import { Library } from '~/types'
+import type { Library } from '~/types'
+
 import axios from 'axios'
 import LibraryFollowButton from '~/components/audio/LibraryFollowButton.vue'
 import RadioButton from '~/components/radios/Button.vue'
diff --git a/front/tsconfig.json b/front/tsconfig.json
index 9ad4090ef..264fec254 100644
--- a/front/tsconfig.json
+++ b/front/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "extends": "@vue/tsconfig/tsconfig.web.json",
   "compilerOptions": {
+    "lib": ["webworker"],
     "baseUrl": ".",
     "sourceMap": true,
     "allowJs": true,
diff --git a/front/vite.config.ts b/front/vite.config.ts
index f6e4b690a..1a08ba8ef 100644
--- a/front/vite.config.ts
+++ b/front/vite.config.ts
@@ -1,4 +1,6 @@
-import { defineConfig, HmrOptions } from 'vite'
+import type { HmrOptions } from 'vite'
+
+import { defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import { VitePWA } from 'vite-plugin-pwa'
 import { resolve } from 'path'