From 08d67723924abe914ebccfd0e89e7d97eb196341 Mon Sep 17 00:00:00 2001
From: Ciaran Ainsworth <ciaranainsworth@outlook.com>
Date: Mon, 21 Feb 2022 17:27:00 +0100
Subject: [PATCH] Fix broken imports

---
 front/src/audio/volume.js                     |  4 ++--
 front/src/components/Footer.vue               |  2 +-
 front/src/components/Queue.vue                |  2 +-
 front/src/components/admin/SettingsGroup.vue  |  2 +-
 .../components/admin/SignupFormBuilder.vue    |  2 +-
 front/src/components/audio/ChannelCard.vue    |  4 ++--
 front/src/components/audio/ChannelEntries.vue |  4 ++--
 .../src/components/audio/ChannelEntryCard.vue |  4 ++--
 front/src/components/audio/ChannelForm.vue    |  4 ++--
 .../src/components/audio/ChannelSerieCard.vue |  2 +-
 front/src/components/audio/ChannelSeries.vue  |  4 ++--
 front/src/components/audio/ChannelsWidget.vue |  2 +-
 front/src/components/audio/PlayButton.vue     |  4 ++--
 front/src/components/audio/Search.vue         |  4 ++--
 front/src/components/audio/SearchBar.vue      |  2 +-
 front/src/components/audio/album/Card.vue     |  2 +-
 front/src/components/audio/artist/Card.vue    |  4 ++--
 front/src/components/audio/artist/Widget.vue  |  2 +-
 .../components/audio/podcast/MobileRow.vue    |  6 +++---
 front/src/components/audio/podcast/Modal.vue  |  6 +++---
 front/src/components/audio/podcast/Row.vue    |  4 ++--
 front/src/components/audio/podcast/Table.vue  |  6 +++---
 .../src/components/audio/track/MobileRow.vue  |  6 +++---
 front/src/components/audio/track/Modal.vue    |  6 +++---
 front/src/components/audio/track/Row.vue      |  8 ++++----
 front/src/components/audio/track/Table.vue    |  6 +++---
 front/src/components/audio/track/Widget.vue   |  4 ++--
 front/src/components/auth/ApplicationEdit.vue |  2 +-
 front/src/components/auth/ApplicationForm.vue |  2 +-
 front/src/components/auth/ApplicationNew.vue  |  2 +-
 front/src/components/auth/Authorize.vue       |  2 +-
 front/src/components/auth/Settings.vue        |  8 ++++----
 front/src/components/auth/SignupForm.vue      |  4 ++--
 .../src/components/auth/SubsonicTokenForm.vue |  2 +-
 front/src/components/channels/AlbumModal.vue  |  4 ++--
 .../components/channels/SubscribeButton.vue   |  2 +-
 front/src/components/channels/UploadForm.vue  |  8 ++++----
 .../channels/UploadMetadataForm.vue           |  4 ++--
 .../src/components/common/DangerousButton.vue |  2 +-
 front/src/components/common/LoginModal.vue    |  2 +-
 front/src/components/common/UserMenu.vue      |  2 +-
 front/src/components/common/UserModal.vue     |  4 ++--
 front/src/components/favorites/List.vue       | 12 +++++------
 .../src/components/federation/FetchButton.vue |  2 +-
 .../components/federation/LibraryWidget.vue   |  2 +-
 front/src/components/library/AlbumDetail.vue  |  2 +-
 .../src/components/library/AlbumDropdown.vue  |  6 +++---
 front/src/components/library/AlbumEdit.vue    |  2 +-
 front/src/components/library/ArtistBase.vue   | 16 +++++++--------
 front/src/components/library/ArtistDetail.vue |  6 +++---
 front/src/components/library/ArtistEdit.vue   |  2 +-
 front/src/components/library/Artists.vue      |  2 +-
 front/src/components/library/EditCard.vue     |  2 +-
 front/src/components/library/EditDetail.vue   |  4 ++--
 front/src/components/library/EditForm.vue     | 12 +++++------
 front/src/components/library/EditList.vue     |  4 ++--
 front/src/components/library/FileUpload.vue   | 10 +++++-----
 .../components/library/FileUploadWidget.vue   |  2 +-
 front/src/components/library/Home.vue         | 10 +++++-----
 .../components/library/ImportStatusModal.vue  |  2 +-
 front/src/components/library/Podcasts.vue     |  2 +-
 front/src/components/library/Radios.vue       |  2 +-
 front/src/components/library/TagDetail.vue    | 10 +++++-----
 front/src/components/library/TagsSelector.vue |  2 +-
 front/src/components/library/TrackBase.vue    | 20 +++++++++----------
 front/src/components/library/TrackDetail.vue  |  6 +++---
 front/src/components/library/TrackEdit.vue    |  2 +-
 front/src/components/manage/ChannelsTable.vue | 12 +++++------
 .../components/manage/library/AlbumsTable.vue | 12 +++++------
 .../manage/library/ArtistsTable.vue           | 12 +++++------
 .../manage/library/EditsCardList.vue          | 12 +++++------
 .../manage/library/LibrariesTable.vue         | 12 +++++------
 .../components/manage/library/TagsTable.vue   | 14 ++++++-------
 .../components/manage/library/TracksTable.vue | 12 +++++------
 .../manage/library/UploadsTable.vue           | 14 ++++++-------
 .../manage/moderation/AccountsTable.vue       | 12 +++++------
 .../manage/moderation/DomainsTable.vue        | 10 +++++-----
 .../manage/moderation/InstancePolicyModal.vue |  6 +++---
 .../manage/moderation/ReportCard.vue          |  8 ++++----
 .../manage/moderation/UserRequestCard.vue     |  4 ++--
 .../manage/users/InvitationsTable.vue         |  8 ++++----
 .../components/manage/users/UsersTable.vue    | 10 +++++-----
 .../moderation/ReportCategoryDropdown.vue     |  2 +-
 front/src/components/playlists/Card.vue       |  2 +-
 front/src/components/playlists/CardList.vue   |  2 +-
 front/src/components/playlists/Editor.vue     |  2 +-
 front/src/components/playlists/Form.vue       |  2 +-
 front/src/components/radios/Card.vue          |  2 +-
 front/src/views/Notifications.vue             |  2 +-
 front/src/views/Search.vue                    | 16 +++++++--------
 front/src/views/admin/ChannelDetail.vue       |  4 ++--
 front/src/views/admin/ChannelsList.vue        |  2 +-
 front/src/views/admin/Settings.vue            |  2 +-
 front/src/views/admin/library/AlbumDetail.vue |  4 ++--
 front/src/views/admin/library/AlbumsList.vue  |  2 +-
 .../src/views/admin/library/ArtistDetail.vue  |  4 ++--
 front/src/views/admin/library/ArtistsList.vue |  2 +-
 front/src/views/admin/library/EditsList.vue   |  2 +-
 .../src/views/admin/library/LibrariesList.vue |  2 +-
 .../src/views/admin/library/LibraryDetail.vue |  2 +-
 front/src/views/admin/library/TagsList.vue    |  2 +-
 front/src/views/admin/library/TrackDetail.vue |  4 ++--
 front/src/views/admin/library/TracksList.vue  |  2 +-
 .../src/views/admin/library/UploadDetail.vue  |  6 +++---
 front/src/views/admin/library/UploadsList.vue |  2 +-
 .../views/admin/moderation/AccountsDetail.vue |  4 ++--
 .../views/admin/moderation/AccountsList.vue   |  2 +-
 .../views/admin/moderation/DomainsDetail.vue  |  4 ++--
 .../views/admin/moderation/DomainsList.vue    |  2 +-
 .../views/admin/moderation/ReportDetail.vue   |  2 +-
 .../views/admin/moderation/ReportsList.vue    | 14 ++++++-------
 .../views/admin/moderation/RequestDetail.vue  |  2 +-
 .../views/admin/moderation/RequestsList.vue   | 12 +++++------
 .../src/views/admin/users/InvitationsList.vue |  4 ++--
 front/src/views/admin/users/UsersList.vue     |  2 +-
 front/src/views/auth/PasswordResetConfirm.vue |  2 +-
 front/src/views/auth/Plugins.vue              |  2 +-
 front/src/views/auth/ProfileActivity.vue      |  6 +++---
 front/src/views/auth/ProfileBase.vue          |  2 +-
 front/src/views/auth/ProfileOverview.vue      |  8 ++++----
 front/src/views/auth/Signup.vue               |  2 +-
 front/src/views/channels/DetailBase.vue       | 14 ++++++-------
 front/src/views/channels/DetailEpisodes.vue   |  2 +-
 front/src/views/channels/DetailOverview.vue   |  6 +++---
 .../src/views/channels/SubscriptionsList.vue  |  6 +++---
 front/src/views/content/libraries/Card.vue    |  2 +-
 .../views/content/libraries/FilesTable.vue    | 14 ++++++-------
 front/src/views/content/remote/Card.vue       |  4 ++--
 front/src/views/library/DetailAlbums.vue      |  2 +-
 front/src/views/library/DetailBase.vue        |  6 +++---
 front/src/views/library/DetailOverview.vue    |  2 +-
 front/src/views/library/DetailTracks.vue      |  2 +-
 front/src/views/library/Edit.vue              |  4 ++--
 front/src/views/library/Upload.vue            |  2 +-
 front/src/views/playlists/Detail.vue          | 10 +++++-----
 front/src/views/playlists/List.vue            | 10 +++++-----
 front/src/views/radios/Detail.vue             |  6 +++---
 137 files changed, 345 insertions(+), 345 deletions(-)

diff --git a/front/src/audio/volume.js b/front/src/audio/volume.js
index 1b7e2bc62f..5a9ad05f6e 100644
--- a/front/src/audio/volume.js
+++ b/front/src/audio/volume.js
@@ -1,6 +1,6 @@
 const DYNAMIC_RANGE = 40 // dB
 
-function toLinearVolumeScale (v) {
+export function toLinearVolumeScale (v) {
   if (v <= 0.0) {
     return 0.0
   }
@@ -11,7 +11,7 @@ function toLinearVolumeScale (v) {
   return Math.pow(10, dB / 20)
 }
 
-function toLogarithmicVolumeScale (v) {
+export function toLogarithmicVolumeScale (v) {
   if (v <= 0.0) {
     return 0.0
   }
diff --git a/front/src/components/Footer.vue b/front/src/components/Footer.vue
index 3f9641e187..b78d4844b8 100644
--- a/front/src/components/Footer.vue
+++ b/front/src/components/Footer.vue
@@ -212,7 +212,7 @@
 
 <script>
 import { mapState } from 'vuex'
-import ThemesMixin from '@/components/mixins/Themes'
+import ThemesMixin from '@/components/mixins/Themes.vue'
 import _ from '@/lodash'
 
 export default {
diff --git a/front/src/components/Queue.vue b/front/src/components/Queue.vue
index b823deee50..921927f9e6 100644
--- a/front/src/components/Queue.vue
+++ b/front/src/components/Queue.vue
@@ -346,7 +346,7 @@ import { mapState, mapGetters, mapActions } from 'vuex'
 import $ from 'jquery'
 import moment from 'moment'
 import lodash from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { createFocusTrap } from 'focus-trap'
 
 export default {
diff --git a/front/src/components/admin/SettingsGroup.vue b/front/src/components/admin/SettingsGroup.vue
index 94e7620e87..4ee4603cde 100644
--- a/front/src/components/admin/SettingsGroup.vue
+++ b/front/src/components/admin/SettingsGroup.vue
@@ -162,7 +162,7 @@ import lodash from '@/lodash'
 
 export default {
   components: {
-    SignupFormBuilder: () => import(/* webpackChunkName: "signup-form-builder" */ '@/components/admin/SignupFormBuilder')
+    SignupFormBuilder: () => import(/* webpackChunkName: "signup-form-builder" */ '@/components/admin/SignupFormBuilder.vue')
   },
   props: {
     group: { type: Object, required: true },
diff --git a/front/src/components/admin/SignupFormBuilder.vue b/front/src/components/admin/SignupFormBuilder.vue
index 1eb29f632f..90c0a87bb9 100644
--- a/front/src/components/admin/SignupFormBuilder.vue
+++ b/front/src/components/admin/SignupFormBuilder.vue
@@ -163,7 +163,7 @@
 <script>
 import lodash from '@/lodash'
 
-import SignupForm from '@/components/auth/SignupForm'
+import SignupForm from '@/components/auth/SignupForm.vue'
 
 function arrayMove (arr, oldIndex, newIndex) {
   if (newIndex >= arr.length) {
diff --git a/front/src/components/audio/ChannelCard.vue b/front/src/components/audio/ChannelCard.vue
index 8578e69ffb..382928b193 100644
--- a/front/src/components/audio/ChannelCard.vue
+++ b/front/src/components/audio/ChannelCard.vue
@@ -75,8 +75,8 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
-import TagsList from '@/components/tags/List'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import TagsList from '@/components/tags/List.vue'
 
 import { momentFormat } from '@/filters'
 import moment from 'moment'
diff --git a/front/src/components/audio/ChannelEntries.vue b/front/src/components/audio/ChannelEntries.vue
index 21c4dc1c85..ff9e1ea7d4 100644
--- a/front/src/components/audio/ChannelEntries.vue
+++ b/front/src/components/audio/ChannelEntries.vue
@@ -56,8 +56,8 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import PodcastTable from '@/components/audio/podcast/Table'
-import TrackTable from '@/components/audio/track/Table'
+import PodcastTable from '@/components/audio/podcast/Table.vue'
+import TrackTable from '@/components/audio/track/Table.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/ChannelEntryCard.vue b/front/src/components/audio/ChannelEntryCard.vue
index 2ca1f93e0a..b190f75190 100644
--- a/front/src/components/audio/ChannelEntryCard.vue
+++ b/front/src/components/audio/ChannelEntryCard.vue
@@ -77,8 +77,8 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
-import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon.vue'
 import { mapGetters } from 'vuex'
 
 export default {
diff --git a/front/src/components/audio/ChannelForm.vue b/front/src/components/audio/ChannelForm.vue
index 3c96a93197..8426a86463 100644
--- a/front/src/components/audio/ChannelForm.vue
+++ b/front/src/components/audio/ChannelForm.vue
@@ -249,8 +249,8 @@
 <script>
 import axios from 'axios'
 
-import AttachmentInput from '@/components/common/AttachmentInput'
-import TagsSelector from '@/components/library/TagsSelector'
+import AttachmentInput from '@/components/common/AttachmentInput.vue'
+import TagsSelector from '@/components/library/TagsSelector.vue'
 
 function slugify (text) {
   return text.toString().toLowerCase()
diff --git a/front/src/components/audio/ChannelSerieCard.vue b/front/src/components/audio/ChannelSerieCard.vue
index ab5542f752..269cc41079 100644
--- a/front/src/components/audio/ChannelSerieCard.vue
+++ b/front/src/components/audio/ChannelSerieCard.vue
@@ -62,7 +62,7 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
+import PlayButton from '@/components/audio/PlayButton.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/ChannelSeries.vue b/front/src/components/audio/ChannelSeries.vue
index 26b0aa0bee..ed20b5e3ab 100644
--- a/front/src/components/audio/ChannelSeries.vue
+++ b/front/src/components/audio/ChannelSeries.vue
@@ -55,8 +55,8 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import ChannelSerieCard from '@/components/audio/ChannelSerieCard'
-import AlbumCard from '@/components/audio/album/Card'
+import ChannelSerieCard from '@/components/audio/ChannelSerieCard.vue'
+import AlbumCard from '@/components/audio/album/Card.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/ChannelsWidget.vue b/front/src/components/audio/ChannelsWidget.vue
index 68b26feaa0..5974c5e757 100644
--- a/front/src/components/audio/ChannelsWidget.vue
+++ b/front/src/components/audio/ChannelsWidget.vue
@@ -39,7 +39,7 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import ChannelCard from '@/components/audio/ChannelCard'
+import ChannelCard from '@/components/audio/ChannelCard.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/PlayButton.vue b/front/src/components/audio/PlayButton.vue
index 079faafc64..f7165d8402 100644
--- a/front/src/components/audio/PlayButton.vue
+++ b/front/src/components/audio/PlayButton.vue
@@ -126,8 +126,8 @@
 <script>
 import jQuery from 'jquery'
 
-import ReportMixin from '@/components/mixins/Report'
-import PlayOptionsMixin from '@/components/mixins/PlayOptions'
+import ReportMixin from '@/components/mixins/Report.vue'
+import PlayOptionsMixin from '@/components/mixins/PlayOptions.vue'
 
 export default {
   mixins: [ReportMixin, PlayOptionsMixin],
diff --git a/front/src/components/audio/Search.vue b/front/src/components/audio/Search.vue
index a27018da5e..0fd5fe1e2f 100644
--- a/front/src/components/audio/Search.vue
+++ b/front/src/components/audio/Search.vue
@@ -72,8 +72,8 @@
 import _ from '@/lodash'
 import axios from 'axios'
 import logger from '@/logging'
-import AlbumCard from '@/components/audio/album/Card'
-import ArtistCard from '@/components/audio/artist/Card'
+import AlbumCard from '@/components/audio/album/Card.vue'
+import ArtistCard from '@/components/audio/artist/Card.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/SearchBar.vue b/front/src/components/audio/SearchBar.vue
index 5690aa742c..f3a153b22b 100644
--- a/front/src/components/audio/SearchBar.vue
+++ b/front/src/components/audio/SearchBar.vue
@@ -24,7 +24,7 @@
 import jQuery from 'jquery'
 import router from '@/router'
 import lodash from '@/lodash'
-import GlobalEvents from '@/components/utils/global-events'
+import GlobalEvents from '@/components/utils/global-events.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/album/Card.vue b/front/src/components/audio/album/Card.vue
index 7f5afac635..381d39613c 100644
--- a/front/src/components/audio/album/Card.vue
+++ b/front/src/components/audio/album/Card.vue
@@ -54,7 +54,7 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
+import PlayButton from '@/components/audio/PlayButton.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/artist/Card.vue b/front/src/components/audio/artist/Card.vue
index c02d825f76..bfff6a684a 100644
--- a/front/src/components/audio/artist/Card.vue
+++ b/front/src/components/audio/artist/Card.vue
@@ -61,8 +61,8 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
-import TagsList from '@/components/tags/List'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import TagsList from '@/components/tags/List.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/artist/Widget.vue b/front/src/components/audio/artist/Widget.vue
index 9cf3ae0cc5..f12c960c04 100644
--- a/front/src/components/audio/artist/Widget.vue
+++ b/front/src/components/audio/artist/Widget.vue
@@ -52,7 +52,7 @@
 
 <script>
 import axios from 'axios'
-import ArtistCard from '@/components/audio/artist/Card'
+import ArtistCard from '@/components/audio/artist/Card.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/podcast/MobileRow.vue b/front/src/components/audio/podcast/MobileRow.vue
index e4f0db9805..40bf88389d 100644
--- a/front/src/components/audio/podcast/MobileRow.vue
+++ b/front/src/components/audio/podcast/MobileRow.vue
@@ -139,9 +139,9 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
-import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
-import TrackModal from '@/components/audio/track/Modal'
-import PlayOptionsMixin from '@/components/mixins/PlayOptions'
+import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon.vue'
+import TrackModal from '@/components/audio/track/Modal.vue'
+import PlayOptionsMixin from '@/components/mixins/PlayOptions.vue'
 
 export default {
 
diff --git a/front/src/components/audio/podcast/Modal.vue b/front/src/components/audio/podcast/Modal.vue
index e1de0cdb10..0a5e396fa4 100644
--- a/front/src/components/audio/podcast/Modal.vue
+++ b/front/src/components/audio/podcast/Modal.vue
@@ -226,9 +226,9 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
-import ReportMixin from '@/components/mixins/Report'
-import PlayOptionsMixin from '@/components/mixins/PlayOptions'
+import Modal from '@/components/semantic/Modal.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
+import PlayOptionsMixin from '@/components/mixins/PlayOptions.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/podcast/Row.vue b/front/src/components/audio/podcast/Row.vue
index 06bec4855f..1f9eb60c12 100644
--- a/front/src/components/audio/podcast/Row.vue
+++ b/front/src/components/audio/podcast/Row.vue
@@ -83,8 +83,8 @@
 <script>
 import axios from 'axios'
 import { mapActions, mapGetters } from 'vuex'
-import PlayButton from '@/components/audio/PlayButton'
-import PlayOptions from '@/components/mixins/PlayOptions'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import PlayOptions from '@/components/mixins/PlayOptions.vue'
 
 export default {
 
diff --git a/front/src/components/audio/podcast/Table.vue b/front/src/components/audio/podcast/Table.vue
index a2407801f4..df737da8ae 100644
--- a/front/src/components/audio/podcast/Table.vue
+++ b/front/src/components/audio/podcast/Table.vue
@@ -77,9 +77,9 @@
 </template>
 
 <script>
-import PodcastRow from '@/components/audio/podcast/Row'
-import TrackMobileRow from '@/components/audio/track/MobileRow'
-import Pagination from '@/components/Pagination'
+import PodcastRow from '@/components/audio/podcast/Row.vue'
+import TrackMobileRow from '@/components/audio/track/MobileRow.vue'
+import Pagination from '@/components/Pagination.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/track/MobileRow.vue b/front/src/components/audio/track/MobileRow.vue
index 98005ff9d1..bf1f552afe 100644
--- a/front/src/components/audio/track/MobileRow.vue
+++ b/front/src/components/audio/track/MobileRow.vue
@@ -122,9 +122,9 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
-import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
-import TrackModal from '@/components/audio/track/Modal'
-import PlayOptionsMixin from '@/components/mixins/PlayOptions'
+import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon.vue'
+import TrackModal from '@/components/audio/track/Modal.vue'
+import PlayOptionsMixin from '@/components/mixins/PlayOptions.vue'
 
 export default {
 
diff --git a/front/src/components/audio/track/Modal.vue b/front/src/components/audio/track/Modal.vue
index e1de0cdb10..0a5e396fa4 100644
--- a/front/src/components/audio/track/Modal.vue
+++ b/front/src/components/audio/track/Modal.vue
@@ -226,9 +226,9 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
-import ReportMixin from '@/components/mixins/Report'
-import PlayOptionsMixin from '@/components/mixins/PlayOptions'
+import Modal from '@/components/semantic/Modal.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
+import PlayOptionsMixin from '@/components/mixins/PlayOptions.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/track/Row.vue b/front/src/components/audio/track/Row.vue
index 12c69f955e..64f9d7f2f9 100644
--- a/front/src/components/audio/track/Row.vue
+++ b/front/src/components/audio/track/Row.vue
@@ -180,11 +180,11 @@
 </template>
 
 <script>
-import PlayIndicator from '@/components/audio/track/PlayIndicator'
+import PlayIndicator from '@/components/audio/track/PlayIndicator.vue'
 import { mapActions, mapGetters } from 'vuex'
-import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
-import PlayButton from '@/components/audio/PlayButton'
-import PlayOptions from '@/components/mixins/PlayOptions'
+import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon.vue'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import PlayOptions from '@/components/mixins/PlayOptions.vue'
 
 export default {
 
diff --git a/front/src/components/audio/track/Table.vue b/front/src/components/audio/track/Table.vue
index 038371de85..e0f5c9a21c 100644
--- a/front/src/components/audio/track/Table.vue
+++ b/front/src/components/audio/track/Table.vue
@@ -160,9 +160,9 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import TrackRow from '@/components/audio/track/Row'
-import TrackMobileRow from '@/components/audio/track/MobileRow'
-import Pagination from '@/components/Pagination'
+import TrackRow from '@/components/audio/track/Row.vue'
+import TrackMobileRow from '@/components/audio/track/MobileRow.vue'
+import Pagination from '@/components/Pagination.vue'
 
 export default {
   components: {
diff --git a/front/src/components/audio/track/Widget.vue b/front/src/components/audio/track/Widget.vue
index 85b7c6104c..8caf5bd50f 100644
--- a/front/src/components/audio/track/Widget.vue
+++ b/front/src/components/audio/track/Widget.vue
@@ -137,8 +137,8 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import PlayButton from '@/components/audio/PlayButton'
-import TagsList from '@/components/tags/List'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import TagsList from '@/components/tags/List.vue'
 
 export default {
   components: {
diff --git a/front/src/components/auth/ApplicationEdit.vue b/front/src/components/auth/ApplicationEdit.vue
index 4d04f9cdbe..2e86ba2850 100644
--- a/front/src/components/auth/ApplicationEdit.vue
+++ b/front/src/components/auth/ApplicationEdit.vue
@@ -78,7 +78,7 @@
 <script>
 import axios from 'axios'
 
-import ApplicationForm from '@/components/auth/ApplicationForm'
+import ApplicationForm from '@/components/auth/ApplicationForm.vue'
 
 export default {
   components: {
diff --git a/front/src/components/auth/ApplicationForm.vue b/front/src/components/auth/ApplicationForm.vue
index bfbcd58084..3233a3068c 100644
--- a/front/src/components/auth/ApplicationForm.vue
+++ b/front/src/components/auth/ApplicationForm.vue
@@ -121,7 +121,7 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   mixins: [TranslationsMixin],
diff --git a/front/src/components/auth/ApplicationNew.vue b/front/src/components/auth/ApplicationNew.vue
index 8ffa13fe3a..ec95ddcd4e 100644
--- a/front/src/components/auth/ApplicationNew.vue
+++ b/front/src/components/auth/ApplicationNew.vue
@@ -25,7 +25,7 @@
 </template>
 
 <script>
-import ApplicationForm from '@/components/auth/ApplicationForm'
+import ApplicationForm from '@/components/auth/ApplicationForm.vue'
 
 export default {
   components: {
diff --git a/front/src/components/auth/Authorize.vue b/front/src/components/auth/Authorize.vue
index d862520099..004dbc6808 100644
--- a/front/src/components/auth/Authorize.vue
+++ b/front/src/components/auth/Authorize.vue
@@ -142,7 +142,7 @@
 </template>
 
 <script>
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 import axios from 'axios'
 
diff --git a/front/src/components/auth/Settings.vue b/front/src/components/auth/Settings.vue
index d614cf4b3f..92b3e724aa 100644
--- a/front/src/components/auth/Settings.vue
+++ b/front/src/components/auth/Settings.vue
@@ -699,10 +699,10 @@
 import $ from 'jquery'
 import axios from 'axios'
 import logger from '@/logging'
-import PasswordInput from '@/components/forms/PasswordInput'
-import SubsonicTokenForm from '@/components/auth/SubsonicTokenForm'
-import TranslationsMixin from '@/components/mixins/Translations'
-import AttachmentInput from '@/components/common/AttachmentInput'
+import PasswordInput from '@/components/forms/PasswordInput.vue'
+import SubsonicTokenForm from '@/components/auth/SubsonicTokenForm.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import AttachmentInput from '@/components/common/AttachmentInput.vue'
 
 export default {
   components: {
diff --git a/front/src/components/auth/SignupForm.vue b/front/src/components/auth/SignupForm.vue
index 0711178ae7..a21f1c88a1 100644
--- a/front/src/components/auth/SignupForm.vue
+++ b/front/src/components/auth/SignupForm.vue
@@ -156,8 +156,8 @@
 import axios from 'axios'
 import logger from '@/logging'
 
-import LoginForm from '@/components/auth/LoginForm'
-import PasswordInput from '@/components/forms/PasswordInput'
+import LoginForm from '@/components/auth/LoginForm.vue'
+import PasswordInput from '@/components/forms/PasswordInput.vue'
 
 export default {
   components: {
diff --git a/front/src/components/auth/SubsonicTokenForm.vue b/front/src/components/auth/SubsonicTokenForm.vue
index fce8632494..a5e56913cf 100644
--- a/front/src/components/auth/SubsonicTokenForm.vue
+++ b/front/src/components/auth/SubsonicTokenForm.vue
@@ -145,7 +145,7 @@
 
 <script>
 import axios from 'axios'
-import PasswordInput from '@/components/forms/PasswordInput'
+import PasswordInput from '@/components/forms/PasswordInput.vue'
 
 export default {
   components: {
diff --git a/front/src/components/channels/AlbumModal.vue b/front/src/components/channels/AlbumModal.vue
index cf50cc0314..586bcba85e 100644
--- a/front/src/components/channels/AlbumModal.vue
+++ b/front/src/components/channels/AlbumModal.vue
@@ -48,8 +48,8 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
-import ChannelAlbumForm from '@/components/channels/AlbumForm'
+import Modal from '@/components/semantic/Modal.vue'
+import ChannelAlbumForm from '@/components/channels/AlbumForm.vue'
 
 export default {
   components: {
diff --git a/front/src/components/channels/SubscribeButton.vue b/front/src/components/channels/SubscribeButton.vue
index 3d95305d8a..3d371e97a9 100644
--- a/front/src/components/channels/SubscribeButton.vue
+++ b/front/src/components/channels/SubscribeButton.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script>
-import LoginModal from '@/components/common/LoginModal'
+import LoginModal from '@/components/common/LoginModal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/channels/UploadForm.vue b/front/src/components/channels/UploadForm.vue
index 712e9627ba..79fc49dbf3 100644
--- a/front/src/components/channels/UploadForm.vue
+++ b/front/src/components/channels/UploadForm.vue
@@ -239,10 +239,10 @@
 import axios from 'axios'
 import $ from 'jquery'
 
-import LicenseSelect from '@/components/channels/LicenseSelect'
-import AlbumSelect from '@/components/channels/AlbumSelect'
-import FileUploadWidget from '@/components/library/FileUploadWidget'
-import UploadMetadataForm from '@/components/channels/UploadMetadataForm'
+import LicenseSelect from '@/components/channels/LicenseSelect.vue'
+import AlbumSelect from '@/components/channels/AlbumSelect.vue'
+import FileUploadWidget from '@/components/library/FileUploadWidget.vue'
+import UploadMetadataForm from '@/components/channels/UploadMetadataForm.vue'
 
 function setIfEmpty (obj, k, v) {
   if (obj[k] !== undefined) {
diff --git a/front/src/components/channels/UploadMetadataForm.vue b/front/src/components/channels/UploadMetadataForm.vue
index f7535883ce..127a275e63 100644
--- a/front/src/components/channels/UploadMetadataForm.vue
+++ b/front/src/components/channels/UploadMetadataForm.vue
@@ -58,8 +58,8 @@
 </template>
 
 <script>
-import TagsSelector from '@/components/library/TagsSelector'
-import AttachmentInput from '@/components/common/AttachmentInput'
+import TagsSelector from '@/components/library/TagsSelector.vue'
+import AttachmentInput from '@/components/common/AttachmentInput.vue'
 
 export default {
   components: {
diff --git a/front/src/components/common/DangerousButton.vue b/front/src/components/common/DangerousButton.vue
index 25a25d2fc0..b15890da20 100644
--- a/front/src/components/common/DangerousButton.vue
+++ b/front/src/components/common/DangerousButton.vue
@@ -43,7 +43,7 @@
   </button>
 </template>
 <script>
-import Modal from '@/components/semantic/Modal'
+import Modal from '@/components/semantic/Modal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/common/LoginModal.vue b/front/src/components/common/LoginModal.vue
index 5f2d5b7c20..5f51b32836 100644
--- a/front/src/components/common/LoginModal.vue
+++ b/front/src/components/common/LoginModal.vue
@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
+import Modal from '@/components/semantic/Modal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/common/UserMenu.vue b/front/src/components/common/UserMenu.vue
index da17440045..e5c7a05373 100644
--- a/front/src/components/common/UserMenu.vue
+++ b/front/src/components/common/UserMenu.vue
@@ -155,7 +155,7 @@
 
 import { mapGetters } from 'vuex'
 
-import ThemesMixin from '@/components/mixins/Themes'
+import ThemesMixin from '@/components/mixins/Themes.vue'
 
 export default {
   mixins: [ThemesMixin],
diff --git a/front/src/components/common/UserModal.vue b/front/src/components/common/UserModal.vue
index 3d7c249a59..7b7cf377e4 100644
--- a/front/src/components/common/UserModal.vue
+++ b/front/src/components/common/UserModal.vue
@@ -174,8 +174,8 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
-import ThemesMixin from '@/components/mixins/Themes'
+import Modal from '@/components/semantic/Modal.vue'
+import ThemesMixin from '@/components/mixins/Themes.vue'
 import { mapGetters } from 'vuex'
 
 export default {
diff --git a/front/src/components/favorites/List.vue b/front/src/components/favorites/List.vue
index 5b143c4f0b..7a4ea9acbe 100644
--- a/front/src/components/favorites/List.vue
+++ b/front/src/components/favorites/List.vue
@@ -136,13 +136,13 @@
 import axios from 'axios'
 import $ from 'jquery'
 import logger from '@/logging'
-import RadioButton from '@/components/radios/Button'
-import Pagination from '@/components/Pagination'
-import OrderingMixin from '@/components/mixins/Ordering'
-import PaginationMixin from '@/components/mixins/Pagination'
-import TranslationsMixin from '@/components/mixins/Translations'
+import RadioButton from '@/components/radios/Button.vue'
+import Pagination from '@/components/Pagination.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import PaginationMixin from '@/components/mixins/Pagination.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 import { checkRedirectToLogin } from '@/utils'
-import TrackTable from '@/components/audio/track/Table'
+import TrackTable from '@/components/audio/track/Table.vue'
 const FAVORITES_URL = 'tracks/'
 
 export default {
diff --git a/front/src/components/federation/FetchButton.vue b/front/src/components/federation/FetchButton.vue
index 699def21ba..bb909a7035 100644
--- a/front/src/components/federation/FetchButton.vue
+++ b/front/src/components/federation/FetchButton.vue
@@ -213,7 +213,7 @@
 
 <script>
 import axios from 'axios'
-import Modal from '@/components/semantic/Modal'
+import Modal from '@/components/semantic/Modal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/federation/LibraryWidget.vue b/front/src/components/federation/LibraryWidget.vue
index 62683996af..7f2941ff93 100644
--- a/front/src/components/federation/LibraryWidget.vue
+++ b/front/src/components/federation/LibraryWidget.vue
@@ -55,7 +55,7 @@
 <script>
 import _ from '@/lodash'
 import axios from 'axios'
-import LibraryCard from '@/views/content/remote/Card'
+import LibraryCard from '@/views/content/remote/Card.vue'
 
 export default {
   components: {
diff --git a/front/src/components/library/AlbumDetail.vue b/front/src/components/library/AlbumDetail.vue
index 24ce4eca67..c8bb360ccb 100644
--- a/front/src/components/library/AlbumDetail.vue
+++ b/front/src/components/library/AlbumDetail.vue
@@ -92,7 +92,7 @@
 
 <script>
 
-import time from '@/utils/time.vue'
+import time from '@/utils/time.js'
 import LibraryWidget from '@/components/federation/LibraryWidget.vue'
 import ChannelEntries from '@/components/audio/ChannelEntries.vue'
 import TrackTable from '@/components/audio/track/Table.vue'
diff --git a/front/src/components/library/AlbumDropdown.vue b/front/src/components/library/AlbumDropdown.vue
index a7f12e1552..a5591bc4e3 100644
--- a/front/src/components/library/AlbumDropdown.vue
+++ b/front/src/components/library/AlbumDropdown.vue
@@ -127,9 +127,9 @@
   </span>
 </template>
 <script>
-import EmbedWizard from '@/components/audio/EmbedWizard'
-import Modal from '@/components/semantic/Modal'
-import ReportMixin from '@/components/mixins/Report'
+import EmbedWizard from '@/components/audio/EmbedWizard.vue'
+import Modal from '@/components/semantic/Modal.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
 
 import { getDomain } from '@/utils'
 
diff --git a/front/src/components/library/AlbumEdit.vue b/front/src/components/library/AlbumEdit.vue
index d4d9559c38..b5b8007436 100644
--- a/front/src/components/library/AlbumEdit.vue
+++ b/front/src/components/library/AlbumEdit.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import EditForm from '@/components/library/EditForm'
+import EditForm from '@/components/library/EditForm.vue'
 export default {
   components: {
     EditForm
diff --git a/front/src/components/library/ArtistBase.vue b/front/src/components/library/ArtistBase.vue
index 95462c09da..5ec8f3efbd 100644
--- a/front/src/components/library/ArtistBase.vue
+++ b/front/src/components/library/ArtistBase.vue
@@ -215,15 +215,15 @@
 
 <script>
 import axios from 'axios'
-import logger from '@/logging'
-import PlayButton from '@/components/audio/PlayButton'
-import EmbedWizard from '@/components/audio/EmbedWizard'
-import Modal from '@/components/semantic/Modal'
-import RadioButton from '@/components/radios/Button'
-import TagsList from '@/components/tags/List'
-import ReportMixin from '@/components/mixins/Report'
+import logger from '@/logging.js'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import EmbedWizard from '@/components/audio/EmbedWizard.vue'
+import Modal from '@/components/semantic/Modal.vue'
+import RadioButton from '@/components/radios/Button.vue'
+import TagsList from '@/components/tags/List.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
 
-import { getDomain } from '@/utils'
+import { getDomain } from '@/utils.js'
 
 export default {
   components: {
diff --git a/front/src/components/library/ArtistDetail.vue b/front/src/components/library/ArtistDetail.vue
index 7f8248925a..98f0ad8d1b 100644
--- a/front/src/components/library/ArtistDetail.vue
+++ b/front/src/components/library/ArtistDetail.vue
@@ -105,9 +105,9 @@
 
 <script>
 import axios from 'axios'
-import AlbumCard from '@/components/audio/album/Card'
-import TrackTable from '@/components/audio/track/Table'
-import LibraryWidget from '@/components/federation/LibraryWidget'
+import AlbumCard from '@/components/audio/album/Card.vue'
+import TrackTable from '@/components/audio/track/Table.vue'
+import LibraryWidget from '@/components/federation/LibraryWidget.vue'
 
 export default {
   components: {
diff --git a/front/src/components/library/ArtistEdit.vue b/front/src/components/library/ArtistEdit.vue
index 976918ab30..b1d0e54008 100644
--- a/front/src/components/library/ArtistEdit.vue
+++ b/front/src/components/library/ArtistEdit.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import EditForm from '@/components/library/EditForm'
+import EditForm from '@/components/library/EditForm.vue'
 export default {
   components: {
     EditForm
diff --git a/front/src/components/library/Artists.vue b/front/src/components/library/Artists.vue
index 24a7b09a01..56afd95a01 100644
--- a/front/src/components/library/Artists.vue
+++ b/front/src/components/library/Artists.vue
@@ -167,7 +167,7 @@ import qs from 'qs'
 import axios from 'axios'
 import $ from 'jquery'
 
-import logger from '@/logging'
+import logger from '@/logging.js'
 
 import OrderingMixin from '@/components/mixins/Ordering.vue'
 import PaginationMixin from '@/components/mixins/Pagination.vue'
diff --git a/front/src/components/library/EditCard.vue b/front/src/components/library/EditCard.vue
index a5e329414d..21cdc71a91 100644
--- a/front/src/components/library/EditCard.vue
+++ b/front/src/components/library/EditCard.vue
@@ -215,7 +215,7 @@
 import axios from 'axios'
 import { diffWordsWithSpace } from 'diff'
 
-import edits from '@/edits'
+import edits from '@/edits.js'
 
 function castValue (value) {
   if (value === null || value === undefined) {
diff --git a/front/src/components/library/EditDetail.vue b/front/src/components/library/EditDetail.vue
index dd617e21e0..375e6cbe12 100644
--- a/front/src/components/library/EditDetail.vue
+++ b/front/src/components/library/EditDetail.vue
@@ -12,8 +12,8 @@
 
 <script>
 import axios from 'axios'
-import edits from '@/edits'
-import EditCard from '@/components/library/EditCard'
+import edits from '@/edits.js'
+import EditCard from '@/components/library/EditCard.vue'
 export default {
   components: {
     EditCard
diff --git a/front/src/components/library/EditForm.vue b/front/src/components/library/EditForm.vue
index 90c6b22b68..d86fb1f23a 100644
--- a/front/src/components/library/EditForm.vue
+++ b/front/src/components/library/EditForm.vue
@@ -240,13 +240,13 @@
 
 <script>
 import $ from 'jquery'
-import _ from '@/lodash'
+import _ from '@/lodash.js'
 import axios from 'axios'
-import AttachmentInput from '@/components/common/AttachmentInput'
-import EditList from '@/components/library/EditList'
-import EditCard from '@/components/library/EditCard'
-import TagsSelector from '@/components/library/TagsSelector'
-import edits from '@/edits'
+import AttachmentInput from '@/components/common/AttachmentInput.vue'
+import EditList from '@/components/library/EditList.vue'
+import EditCard from '@/components/library/EditCard.vue'
+import TagsSelector from '@/components/library/TagsSelector.vue'
+import edits from '@/edits.js'
 
 export default {
   components: {
diff --git a/front/src/components/library/EditList.vue b/front/src/components/library/EditList.vue
index e3efd0be31..9ca8aeb7e2 100644
--- a/front/src/components/library/EditList.vue
+++ b/front/src/components/library/EditList.vue
@@ -42,10 +42,10 @@
 </template>
 
 <script>
-import _ from '@/lodash'
+import _ from '@/lodash.js'
 import axios from 'axios'
 
-import EditCard from '@/components/library/EditCard'
+import EditCard from '@/components/library/EditCard.vue'
 
 export default {
   components: {
diff --git a/front/src/components/library/FileUpload.vue b/front/src/components/library/FileUpload.vue
index ca171c65d0..aaa602f0f1 100644
--- a/front/src/components/library/FileUpload.vue
+++ b/front/src/components/library/FileUpload.vue
@@ -311,12 +311,12 @@
 </template>
 
 <script>
-import _ from '@/lodash'
+import _ from '@/lodash.js'
 import axios from 'axios'
-import FileUploadWidget from './FileUploadWidget'
-import FsBrowser from './FsBrowser'
-import FsLogs from './FsLogs'
-import LibraryFilesTable from '@/views/content/libraries/FilesTable'
+import FileUploadWidget from './FileUploadWidget.vue'
+import FsBrowser from './FsBrowser.vue'
+import FsLogs from './FsLogs.vue'
+import LibraryFilesTable from '@/views/content/libraries/FilesTable.vue'
 import moment from 'moment'
 
 export default {
diff --git a/front/src/components/library/FileUploadWidget.vue b/front/src/components/library/FileUploadWidget.vue
index 3f5077257c..082e7adf41 100644
--- a/front/src/components/library/FileUploadWidget.vue
+++ b/front/src/components/library/FileUploadWidget.vue
@@ -1,6 +1,6 @@
 <script>
 import FileUpload from 'vue-upload-component'
-import { setCsrf } from '@/utils'
+import { setCsrf } from '@/utils.js'
 
 export default {
   extends: FileUpload,
diff --git a/front/src/components/library/Home.vue b/front/src/components/library/Home.vue
index e70eaebb82..a9482ed24c 100644
--- a/front/src/components/library/Home.vue
+++ b/front/src/components/library/Home.vue
@@ -72,11 +72,11 @@
 
 <script>
 import axios from 'axios'
-import logger from '@/logging'
-import ChannelsWidget from '@/components/audio/ChannelsWidget'
-import TrackWidget from '@/components/audio/track/Widget'
-import AlbumWidget from '@/components/audio/album/Widget'
-import PlaylistWidget from '@/components/playlists/Widget'
+import logger from '@/logging.js'
+import ChannelsWidget from '@/components/audio/ChannelsWidget.vue'
+import TrackWidget from '@/components/audio/track/Widget.vue'
+import AlbumWidget from '@/components/audio/album/Widget.vue'
+import PlaylistWidget from '@/components/playlists/Widget.vue'
 
 const ARTISTS_URL = 'artists/'
 
diff --git a/front/src/components/library/ImportStatusModal.vue b/front/src/components/library/ImportStatusModal.vue
index 839c7fa3da..50e83b5d34 100644
--- a/front/src/components/library/ImportStatusModal.vue
+++ b/front/src/components/library/ImportStatusModal.vue
@@ -132,7 +132,7 @@
   </modal>
 </template>
 <script>
-import Modal from '@/components/semantic/Modal'
+import Modal from '@/components/semantic/Modal.vue'
 
 function getErrors (payload) {
   const errors = []
diff --git a/front/src/components/library/Podcasts.vue b/front/src/components/library/Podcasts.vue
index e6c01b6b69..c0730477ba 100644
--- a/front/src/components/library/Podcasts.vue
+++ b/front/src/components/library/Podcasts.vue
@@ -199,7 +199,7 @@ import qs from 'qs'
 import axios from 'axios'
 import $ from 'jquery'
 
-import logger from '@/logging'
+import logger from '@/logging.js'
 
 import OrderingMixin from '@/components/mixins/Ordering.vue'
 import PaginationMixin from '@/components/mixins/Pagination.vue'
diff --git a/front/src/components/library/Radios.vue b/front/src/components/library/Radios.vue
index e81c25f58e..c618cc0dc7 100644
--- a/front/src/components/library/Radios.vue
+++ b/front/src/components/library/Radios.vue
@@ -177,7 +177,7 @@
 import axios from 'axios'
 import $ from 'jquery'
 
-import logger from '@/logging'
+import logger from '@/logging.js'
 
 import OrderingMixin from '@/components/mixins/Ordering.vue'
 import PaginationMixin from '@/components/mixins/Pagination.vue'
diff --git a/front/src/components/library/TagDetail.vue b/front/src/components/library/TagDetail.vue
index 60c557b939..0506b989db 100644
--- a/front/src/components/library/TagDetail.vue
+++ b/front/src/components/library/TagDetail.vue
@@ -89,11 +89,11 @@
 </template>
 
 <script>
-import ChannelsWidget from '@/components/audio/ChannelsWidget'
-import TrackWidget from '@/components/audio/track/Widget'
-import AlbumWidget from '@/components/audio/album/Widget'
-import ArtistWidget from '@/components/audio/artist/Widget'
-import RadioButton from '@/components/radios/Button'
+import ChannelsWidget from '@/components/audio/ChannelsWidget.vue'
+import TrackWidget from '@/components/audio/track/Widget.vue'
+import AlbumWidget from '@/components/audio/album/Widget.vue'
+import ArtistWidget from '@/components/audio/artist/Widget.vue'
+import RadioButton from '@/components/radios/Button.vue'
 
 export default {
   components: {
diff --git a/front/src/components/library/TagsSelector.vue b/front/src/components/library/TagsSelector.vue
index bdff58ee82..98a1e339e8 100644
--- a/front/src/components/library/TagsSelector.vue
+++ b/front/src/components/library/TagsSelector.vue
@@ -20,7 +20,7 @@
 <script>
 import $ from 'jquery'
 
-import lodash from '@/lodash'
+import lodash from '@/lodash.js'
 export default {
   props: { value: { type: Array, required: true } },
   watch: {
diff --git a/front/src/components/library/TrackBase.vue b/front/src/components/library/TrackBase.vue
index fd809c74ee..452632e500 100644
--- a/front/src/components/library/TrackBase.vue
+++ b/front/src/components/library/TrackBase.vue
@@ -219,17 +219,17 @@
 </template>
 
 <script>
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import axios from 'axios'
-import url from '@/utils/url'
-import { getDomain } from '@/utils'
-import logger from '@/logging'
-import PlayButton from '@/components/audio/PlayButton'
-import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
-import TrackPlaylistIcon from '@/components/playlists/TrackPlaylistIcon'
-import Modal from '@/components/semantic/Modal'
-import EmbedWizard from '@/components/audio/EmbedWizard'
-import ReportMixin from '@/components/mixins/Report'
+import url from '@/utils/url.js'
+import { getDomain } from '@/utils.js'
+import logger from '@/logging.js'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon.vue'
+import TrackPlaylistIcon from '@/components/playlists/TrackPlaylistIcon.vue'
+import Modal from '@/components/semantic/Modal.vue'
+import EmbedWizard from '@/components/audio/EmbedWizard.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
 import { momentFormat } from '@/filters'
 
 const FETCH_URL = 'tracks/'
diff --git a/front/src/components/library/TrackDetail.vue b/front/src/components/library/TrackDetail.vue
index 276edcba9f..aa89b30ec6 100644
--- a/front/src/components/library/TrackDetail.vue
+++ b/front/src/components/library/TrackDetail.vue
@@ -289,9 +289,9 @@
 
 <script>
 import axios from 'axios'
-import LibraryWidget from '@/components/federation/LibraryWidget'
-import TagsList from '@/components/tags/List'
-import PlaylistWidget from '@/components/playlists/Widget'
+import LibraryWidget from '@/components/federation/LibraryWidget.vue'
+import TagsList from '@/components/tags/List.vue'
+import PlaylistWidget from '@/components/playlists/Widget.vue'
 
 export default {
   components: {
diff --git a/front/src/components/library/TrackEdit.vue b/front/src/components/library/TrackEdit.vue
index ce5422796b..6b28755d18 100644
--- a/front/src/components/library/TrackEdit.vue
+++ b/front/src/components/library/TrackEdit.vue
@@ -45,7 +45,7 @@
 <script>
 import axios from 'axios'
 
-import EditForm from '@/components/library/EditForm'
+import EditForm from '@/components/library/EditForm.vue'
 export default {
   components: {
     EditForm
diff --git a/front/src/components/manage/ChannelsTable.vue b/front/src/components/manage/ChannelsTable.vue
index 9399240be3..5fb40c9c90 100644
--- a/front/src/components/manage/ChannelsTable.vue
+++ b/front/src/components/manage/ChannelsTable.vue
@@ -202,13 +202,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/AlbumsTable.vue b/front/src/components/manage/library/AlbumsTable.vue
index 8ccc63d5e7..d88d2d8741 100644
--- a/front/src/components/manage/library/AlbumsTable.vue
+++ b/front/src/components/manage/library/AlbumsTable.vue
@@ -187,13 +187,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/ArtistsTable.vue b/front/src/components/manage/library/ArtistsTable.vue
index ba21182879..6006920737 100644
--- a/front/src/components/manage/library/ArtistsTable.vue
+++ b/front/src/components/manage/library/ArtistsTable.vue
@@ -186,13 +186,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/EditsCardList.vue b/front/src/components/manage/library/EditsCardList.vue
index 7a19df986e..f379d5d417 100644
--- a/front/src/components/manage/library/EditsCardList.vue
+++ b/front/src/components/manage/library/EditsCardList.vue
@@ -132,13 +132,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
-import Pagination from '@/components/Pagination'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import EditCard from '@/components/library/EditCard'
+import time from '@/utils/time.js'
+import Pagination from '@/components/Pagination.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import EditCard from '@/components/library/EditCard.vue'
 import { normalizeQuery, parseTokens } from '@/search'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 import edits from '@/edits'
 
diff --git a/front/src/components/manage/library/LibrariesTable.vue b/front/src/components/manage/library/LibrariesTable.vue
index 0700a5782f..75b0cfd394 100644
--- a/front/src/components/manage/library/LibrariesTable.vue
+++ b/front/src/components/manage/library/LibrariesTable.vue
@@ -217,13 +217,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/TagsTable.vue b/front/src/components/manage/library/TagsTable.vue
index 8a5bd87eab..5213a0529f 100644
--- a/front/src/components/manage/library/TagsTable.vue
+++ b/front/src/components/manage/library/TagsTable.vue
@@ -148,14 +148,14 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
-import ImportStatusModal from '@/components/library/ImportStatusModal'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
+import ImportStatusModal from '@/components/library/ImportStatusModal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/TracksTable.vue b/front/src/components/manage/library/TracksTable.vue
index 3989015b30..09410eb160 100644
--- a/front/src/components/manage/library/TracksTable.vue
+++ b/front/src/components/manage/library/TracksTable.vue
@@ -200,13 +200,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/library/UploadsTable.vue b/front/src/components/manage/library/UploadsTable.vue
index f0d08794f5..4881d89c56 100644
--- a/front/src/components/manage/library/UploadsTable.vue
+++ b/front/src/components/manage/library/UploadsTable.vue
@@ -309,14 +309,14 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
-import ImportStatusModal from '@/components/library/ImportStatusModal'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
+import ImportStatusModal from '@/components/library/ImportStatusModal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/moderation/AccountsTable.vue b/front/src/components/manage/moderation/AccountsTable.vue
index 076689bb49..edcac3dc12 100644
--- a/front/src/components/manage/moderation/AccountsTable.vue
+++ b/front/src/components/manage/moderation/AccountsTable.vue
@@ -173,13 +173,13 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/moderation/DomainsTable.vue b/front/src/components/manage/moderation/DomainsTable.vue
index a4c9c7d255..b680495751 100644
--- a/front/src/components/manage/moderation/DomainsTable.vue
+++ b/front/src/components/manage/moderation/DomainsTable.vue
@@ -184,11 +184,11 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
+import time from '@/utils/time.js'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/moderation/InstancePolicyModal.vue b/front/src/components/manage/moderation/InstancePolicyModal.vue
index 555c0df645..fb10b91431 100644
--- a/front/src/components/manage/moderation/InstancePolicyModal.vue
+++ b/front/src/components/manage/moderation/InstancePolicyModal.vue
@@ -66,9 +66,9 @@
 
 <script>
 import axios from 'axios'
-import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm'
-import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard'
-import Modal from '@/components/semantic/Modal'
+import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm.vue'
+import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard.vue'
+import Modal from '@/components/semantic/Modal.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/moderation/ReportCard.vue b/front/src/components/manage/moderation/ReportCard.vue
index d2dd0a54ca..d90bf46824 100644
--- a/front/src/components/manage/moderation/ReportCard.vue
+++ b/front/src/components/manage/moderation/ReportCard.vue
@@ -390,10 +390,10 @@
 
 <script>
 import axios from 'axios'
-import NoteForm from '@/components/manage/moderation/NoteForm'
-import NotesThread from '@/components/manage/moderation/NotesThread'
-import ReportCategoryDropdown from '@/components/moderation/ReportCategoryDropdown'
-import InstancePolicyModal from '@/components/manage/moderation/InstancePolicyModal'
+import NoteForm from '@/components/manage/moderation/NoteForm.vue'
+import NotesThread from '@/components/manage/moderation/NotesThread.vue'
+import ReportCategoryDropdown from '@/components/moderation/ReportCategoryDropdown.vue'
+import InstancePolicyModal from '@/components/manage/moderation/InstancePolicyModal.vue'
 import entities from '@/entities'
 import { setUpdate } from '@/utils'
 import showdown from 'showdown'
diff --git a/front/src/components/manage/moderation/UserRequestCard.vue b/front/src/components/manage/moderation/UserRequestCard.vue
index 8cf93a53b6..8439d35547 100644
--- a/front/src/components/manage/moderation/UserRequestCard.vue
+++ b/front/src/components/manage/moderation/UserRequestCard.vue
@@ -225,8 +225,8 @@
 
 <script>
 import axios from 'axios'
-import NoteForm from '@/components/manage/moderation/NoteForm'
-import NotesThread from '@/components/manage/moderation/NotesThread'
+import NoteForm from '@/components/manage/moderation/NoteForm.vue'
+import NotesThread from '@/components/manage/moderation/NotesThread.vue'
 import showdown from 'showdown'
 
 export default {
diff --git a/front/src/components/manage/users/InvitationsTable.vue b/front/src/components/manage/users/InvitationsTable.vue
index b3b64cabc7..53992c898b 100644
--- a/front/src/components/manage/users/InvitationsTable.vue
+++ b/front/src/components/manage/users/InvitationsTable.vue
@@ -159,10 +159,10 @@
 import axios from 'axios'
 import moment from 'moment'
 import _ from '@/lodash'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   components: {
diff --git a/front/src/components/manage/users/UsersTable.vue b/front/src/components/manage/users/UsersTable.vue
index 4d81684287..a638c3e336 100644
--- a/front/src/components/manage/users/UsersTable.vue
+++ b/front/src/components/manage/users/UsersTable.vue
@@ -201,11 +201,11 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
+import time from '@/utils/time.js'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   components: {
diff --git a/front/src/components/moderation/ReportCategoryDropdown.vue b/front/src/components/moderation/ReportCategoryDropdown.vue
index c3fcc552c5..f9a5eceb3f 100644
--- a/front/src/components/moderation/ReportCategoryDropdown.vue
+++ b/front/src/components/moderation/ReportCategoryDropdown.vue
@@ -25,7 +25,7 @@
 </template>
 
 <script>
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 import lodash from '@/lodash'
 export default {
   mixins: [TranslationsMixin],
diff --git a/front/src/components/playlists/Card.vue b/front/src/components/playlists/Card.vue
index d02aac56b7..0097948568 100644
--- a/front/src/components/playlists/Card.vue
+++ b/front/src/components/playlists/Card.vue
@@ -55,7 +55,7 @@
 </template>
 
 <script>
-import PlayButton from '@/components/audio/PlayButton'
+import PlayButton from '@/components/audio/PlayButton.vue'
 
 export default {
   components: {
diff --git a/front/src/components/playlists/CardList.vue b/front/src/components/playlists/CardList.vue
index e3c17e6366..f88cf5f74e 100644
--- a/front/src/components/playlists/CardList.vue
+++ b/front/src/components/playlists/CardList.vue
@@ -12,7 +12,7 @@
 
 <script>
 
-import PlaylistCard from '@/components/playlists/Card'
+import PlaylistCard from '@/components/playlists/Card.vue'
 
 export default {
   components: {
diff --git a/front/src/components/playlists/Editor.vue b/front/src/components/playlists/Editor.vue
index 68ce6a10c9..dc74406b7d 100644
--- a/front/src/components/playlists/Editor.vue
+++ b/front/src/components/playlists/Editor.vue
@@ -176,7 +176,7 @@
 <script>
 import { mapState } from 'vuex'
 import axios from 'axios'
-import PlaylistForm from '@/components/playlists/Form'
+import PlaylistForm from '@/components/playlists/Form.vue'
 
 import draggable from 'vuedraggable'
 
diff --git a/front/src/components/playlists/Form.vue b/front/src/components/playlists/Form.vue
index 9d53013883..1703bce91e 100644
--- a/front/src/components/playlists/Form.vue
+++ b/front/src/components/playlists/Form.vue
@@ -100,7 +100,7 @@
 <script>
 import $ from 'jquery'
 import axios from 'axios'
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 import logger from '@/logging'
 
diff --git a/front/src/components/radios/Card.vue b/front/src/components/radios/Card.vue
index e280a91a94..5ec3515455 100644
--- a/front/src/components/radios/Card.vue
+++ b/front/src/components/radios/Card.vue
@@ -48,7 +48,7 @@
 </template>
 
 <script>
-import RadioButton from './Button'
+import RadioButton from './Button.vue'
 
 export default {
   components: {
diff --git a/front/src/views/Notifications.vue b/front/src/views/Notifications.vue
index 26bc12c397..1555a5d243 100644
--- a/front/src/views/Notifications.vue
+++ b/front/src/views/Notifications.vue
@@ -217,7 +217,7 @@ import axios from 'axios'
 import showdown from 'showdown'
 import moment from 'moment'
 
-import NotificationRow from '@/components/notifications/NotificationRow'
+import NotificationRow from '@/components/notifications/NotificationRow.vue'
 
 export default {
   components: {
diff --git a/front/src/views/Search.vue b/front/src/views/Search.vue
index 5fb6820eda..3ac5152d2e 100644
--- a/front/src/views/Search.vue
+++ b/front/src/views/Search.vue
@@ -137,14 +137,14 @@
 </template>
 
 <script>
-import RemoteSearchForm from '@/components/RemoteSearchForm'
-import ArtistCard from '@/components/audio/artist/Card'
-import AlbumCard from '@/components/audio/album/Card'
-import TrackTable from '@/components/audio/track/Table'
-import Pagination from '@/components/Pagination'
-import PlaylistCardList from '@/components/playlists/CardList'
-import RadioCard from '@/components/radios/Card'
-import TagsList from '@/components/tags/List'
+import RemoteSearchForm from '@/components/RemoteSearchForm.vue'
+import ArtistCard from '@/components/audio/artist/Card.vue'
+import AlbumCard from '@/components/audio/album/Card.vue'
+import TrackTable from '@/components/audio/track/Table.vue'
+import Pagination from '@/components/Pagination.vue'
+import PlaylistCardList from '@/components/playlists/CardList.vue'
+import RadioCard from '@/components/radios/Card.vue'
+import TagsList from '@/components/tags/List.vue'
 
 import axios from 'axios'
 
diff --git a/front/src/views/admin/ChannelDetail.vue b/front/src/views/admin/ChannelDetail.vue
index 4f83947fe1..da8f5d6fcb 100644
--- a/front/src/views/admin/ChannelDetail.vue
+++ b/front/src/views/admin/ChannelDetail.vue
@@ -416,8 +416,8 @@
 <script>
 import axios from 'axios'
 
-import TagsList from '@/components/tags/List'
-import FetchButton from '@/components/federation/FetchButton'
+import TagsList from '@/components/tags/List.vue'
+import FetchButton from '@/components/federation/FetchButton.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/ChannelsList.vue b/front/src/views/admin/ChannelsList.vue
index 2a86598efd..3ab794dd7a 100644
--- a/front/src/views/admin/ChannelsList.vue
+++ b/front/src/views/admin/ChannelsList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import ChannelsTable from '@/components/manage/ChannelsTable'
+import ChannelsTable from '@/components/manage/ChannelsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/Settings.vue b/front/src/views/admin/Settings.vue
index ade695e93f..d1848c7a73 100644
--- a/front/src/views/admin/Settings.vue
+++ b/front/src/views/admin/Settings.vue
@@ -45,7 +45,7 @@
 import axios from 'axios'
 import $ from 'jquery'
 
-import SettingsGroup from '@/components/admin/SettingsGroup'
+import SettingsGroup from '@/components/admin/SettingsGroup.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/AlbumDetail.vue b/front/src/views/admin/library/AlbumDetail.vue
index 50cba8da70..cb4c68261d 100644
--- a/front/src/views/admin/library/AlbumDetail.vue
+++ b/front/src/views/admin/library/AlbumDetail.vue
@@ -399,8 +399,8 @@
 
 <script>
 import axios from 'axios'
-import FetchButton from '@/components/federation/FetchButton'
-import TagsList from '@/components/tags/List'
+import FetchButton from '@/components/federation/FetchButton.vue'
+import TagsList from '@/components/tags/List.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/AlbumsList.vue b/front/src/views/admin/library/AlbumsList.vue
index 419449959b..82ceca196b 100644
--- a/front/src/views/admin/library/AlbumsList.vue
+++ b/front/src/views/admin/library/AlbumsList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import AlbumsTable from '@/components/manage/library/AlbumsTable'
+import AlbumsTable from '@/components/manage/library/AlbumsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/ArtistDetail.vue b/front/src/views/admin/library/ArtistDetail.vue
index 8da0906cc0..875082bbbe 100644
--- a/front/src/views/admin/library/ArtistDetail.vue
+++ b/front/src/views/admin/library/ArtistDetail.vue
@@ -411,8 +411,8 @@
 <script>
 import axios from 'axios'
 
-import TagsList from '@/components/tags/List'
-import FetchButton from '@/components/federation/FetchButton'
+import TagsList from '@/components/tags/List.vue'
+import FetchButton from '@/components/federation/FetchButton.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/ArtistsList.vue b/front/src/views/admin/library/ArtistsList.vue
index 7e07353e01..fcbca0f977 100644
--- a/front/src/views/admin/library/ArtistsList.vue
+++ b/front/src/views/admin/library/ArtistsList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import ArtistsTable from '@/components/manage/library/ArtistsTable'
+import ArtistsTable from '@/components/manage/library/ArtistsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/EditsList.vue b/front/src/views/admin/library/EditsList.vue
index 2b67c69b61..9ce83dcd69 100644
--- a/front/src/views/admin/library/EditsList.vue
+++ b/front/src/views/admin/library/EditsList.vue
@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import EditsCardList from '@/components/manage/library/EditsCardList'
+import EditsCardList from '@/components/manage/library/EditsCardList.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/LibrariesList.vue b/front/src/views/admin/library/LibrariesList.vue
index 7e06cf21cd..7a9b034468 100644
--- a/front/src/views/admin/library/LibrariesList.vue
+++ b/front/src/views/admin/library/LibrariesList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import LibrariesTable from '@/components/manage/library/LibrariesTable'
+import LibrariesTable from '@/components/manage/library/LibrariesTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/LibraryDetail.vue b/front/src/views/admin/library/LibraryDetail.vue
index ee58f13fad..d7c56ab4a1 100644
--- a/front/src/views/admin/library/LibraryDetail.vue
+++ b/front/src/views/admin/library/LibraryDetail.vue
@@ -360,7 +360,7 @@
 <script>
 import axios from 'axios'
 import logger from '@/logging'
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   mixins: [
diff --git a/front/src/views/admin/library/TagsList.vue b/front/src/views/admin/library/TagsList.vue
index 8f388cdf05..5ca37165ae 100644
--- a/front/src/views/admin/library/TagsList.vue
+++ b/front/src/views/admin/library/TagsList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import TagsTable from '@/components/manage/library/TagsTable'
+import TagsTable from '@/components/manage/library/TagsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/TrackDetail.vue b/front/src/views/admin/library/TrackDetail.vue
index 4a7789387b..de8074cdf5 100644
--- a/front/src/views/admin/library/TrackDetail.vue
+++ b/front/src/views/admin/library/TrackDetail.vue
@@ -452,8 +452,8 @@
 
 <script>
 import axios from 'axios'
-import FetchButton from '@/components/federation/FetchButton'
-import TagsList from '@/components/tags/List'
+import FetchButton from '@/components/federation/FetchButton.vue'
+import TagsList from '@/components/tags/List.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/TracksList.vue b/front/src/views/admin/library/TracksList.vue
index 4588a4e5b9..e171e8b01f 100644
--- a/front/src/views/admin/library/TracksList.vue
+++ b/front/src/views/admin/library/TracksList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import TracksTable from '@/components/manage/library/TracksTable'
+import TracksTable from '@/components/manage/library/TracksTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/UploadDetail.vue b/front/src/views/admin/library/UploadDetail.vue
index 3c701c32ab..6c5e41ca49 100644
--- a/front/src/views/admin/library/UploadDetail.vue
+++ b/front/src/views/admin/library/UploadDetail.vue
@@ -377,9 +377,9 @@
 
 <script>
 import axios from 'axios'
-import TranslationsMixin from '@/components/mixins/Translations'
-import ImportStatusModal from '@/components/library/ImportStatusModal'
-import time from '@/utils/time'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import ImportStatusModal from '@/components/library/ImportStatusModal.vue'
+import time from '@/utils/time.js'
 
 export default {
   components: {
diff --git a/front/src/views/admin/library/UploadsList.vue b/front/src/views/admin/library/UploadsList.vue
index 2e2a5d7781..247e9fd4e7 100644
--- a/front/src/views/admin/library/UploadsList.vue
+++ b/front/src/views/admin/library/UploadsList.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import UploadsTable from '@/components/manage/library/UploadsTable'
+import UploadsTable from '@/components/manage/library/UploadsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/AccountsDetail.vue b/front/src/views/admin/moderation/AccountsDetail.vue
index 03d6d8ec04..7e2b7f28a8 100644
--- a/front/src/views/admin/moderation/AccountsDetail.vue
+++ b/front/src/views/admin/moderation/AccountsDetail.vue
@@ -571,8 +571,8 @@ import logger from '@/logging'
 import lodash from '@/lodash'
 import $ from 'jquery'
 
-import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm'
-import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard'
+import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm.vue'
+import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/AccountsList.vue b/front/src/views/admin/moderation/AccountsList.vue
index 5596944645..fa53798915 100644
--- a/front/src/views/admin/moderation/AccountsList.vue
+++ b/front/src/views/admin/moderation/AccountsList.vue
@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import AccountsTable from '@/components/manage/moderation/AccountsTable'
+import AccountsTable from '@/components/manage/moderation/AccountsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/DomainsDetail.vue b/front/src/views/admin/moderation/DomainsDetail.vue
index 17293512d3..1802149e0f 100644
--- a/front/src/views/admin/moderation/DomainsDetail.vue
+++ b/front/src/views/admin/moderation/DomainsDetail.vue
@@ -460,8 +460,8 @@
 import axios from 'axios'
 import lodash from '@/lodash'
 
-import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm'
-import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard'
+import InstancePolicyForm from '@/components/manage/moderation/InstancePolicyForm.vue'
+import InstancePolicyCard from '@/components/manage/moderation/InstancePolicyCard.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/DomainsList.vue b/front/src/views/admin/moderation/DomainsList.vue
index 0182961e9a..3095817a25 100644
--- a/front/src/views/admin/moderation/DomainsList.vue
+++ b/front/src/views/admin/moderation/DomainsList.vue
@@ -73,7 +73,7 @@
 <script>
 import axios from 'axios'
 
-import DomainsTable from '@/components/manage/moderation/DomainsTable'
+import DomainsTable from '@/components/manage/moderation/DomainsTable.vue'
 export default {
   components: {
     DomainsTable
diff --git a/front/src/views/admin/moderation/ReportDetail.vue b/front/src/views/admin/moderation/ReportDetail.vue
index 37bdbbac7a..b59192d75b 100644
--- a/front/src/views/admin/moderation/ReportDetail.vue
+++ b/front/src/views/admin/moderation/ReportDetail.vue
@@ -17,7 +17,7 @@
 <script>
 import axios from 'axios'
 
-import ReportCard from '@/components/manage/moderation/ReportCard'
+import ReportCard from '@/components/manage/moderation/ReportCard.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/ReportsList.vue b/front/src/views/admin/moderation/ReportsList.vue
index bf9bdca45e..05721de74d 100644
--- a/front/src/views/admin/moderation/ReportsList.vue
+++ b/front/src/views/admin/moderation/ReportsList.vue
@@ -128,14 +128,14 @@
 
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
-import Pagination from '@/components/Pagination'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import ReportCard from '@/components/manage/moderation/ReportCard'
-import ReportCategoryDropdown from '@/components/moderation/ReportCategoryDropdown'
+import time from '@/utils/time.js'
+import Pagination from '@/components/Pagination.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import ReportCard from '@/components/manage/moderation/ReportCard.vue'
+import ReportCategoryDropdown from '@/components/moderation/ReportCategoryDropdown.vue'
 import { normalizeQuery, parseTokens } from '@/search'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/RequestDetail.vue b/front/src/views/admin/moderation/RequestDetail.vue
index ca089ad8f0..e25fb8360b 100644
--- a/front/src/views/admin/moderation/RequestDetail.vue
+++ b/front/src/views/admin/moderation/RequestDetail.vue
@@ -17,7 +17,7 @@
 <script>
 import axios from 'axios'
 
-import UserRequestCard from '@/components/manage/moderation/UserRequestCard'
+import UserRequestCard from '@/components/manage/moderation/UserRequestCard.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/moderation/RequestsList.vue b/front/src/views/admin/moderation/RequestsList.vue
index 0e88c2c1af..8fa8057b12 100644
--- a/front/src/views/admin/moderation/RequestsList.vue
+++ b/front/src/views/admin/moderation/RequestsList.vue
@@ -126,13 +126,13 @@
 
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
-import Pagination from '@/components/Pagination'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import UserRequestCard from '@/components/manage/moderation/UserRequestCard'
+import time from '@/utils/time.js'
+import Pagination from '@/components/Pagination.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import UserRequestCard from '@/components/manage/moderation/UserRequestCard.vue'
 import { normalizeQuery, parseTokens } from '@/search'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/users/InvitationsList.vue b/front/src/views/admin/users/InvitationsList.vue
index d95b387da4..dd4cb4d63c 100644
--- a/front/src/views/admin/users/InvitationsList.vue
+++ b/front/src/views/admin/users/InvitationsList.vue
@@ -12,8 +12,8 @@
 </template>
 
 <script>
-import InvitationForm from '@/components/manage/users/InvitationForm'
-import InvitationsTable from '@/components/manage/users/InvitationsTable'
+import InvitationForm from '@/components/manage/users/InvitationForm.vue'
+import InvitationsTable from '@/components/manage/users/InvitationsTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/admin/users/UsersList.vue b/front/src/views/admin/users/UsersList.vue
index 29141850f1..42efc38fb4 100644
--- a/front/src/views/admin/users/UsersList.vue
+++ b/front/src/views/admin/users/UsersList.vue
@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import UsersTable from '@/components/manage/users/UsersTable'
+import UsersTable from '@/components/manage/users/UsersTable.vue'
 
 export default {
   components: {
diff --git a/front/src/views/auth/PasswordResetConfirm.vue b/front/src/views/auth/PasswordResetConfirm.vue
index 3653135a0b..bbc01870f5 100644
--- a/front/src/views/auth/PasswordResetConfirm.vue
+++ b/front/src/views/auth/PasswordResetConfirm.vue
@@ -87,7 +87,7 @@
 
 <script>
 import axios from 'axios'
-import PasswordInput from '@/components/forms/PasswordInput'
+import PasswordInput from '@/components/forms/PasswordInput.vue'
 
 export default {
   components: {
diff --git a/front/src/views/auth/Plugins.vue b/front/src/views/auth/Plugins.vue
index 6e6400ffd0..501a0377da 100644
--- a/front/src/views/auth/Plugins.vue
+++ b/front/src/views/auth/Plugins.vue
@@ -29,7 +29,7 @@
 
 <script>
 import axios from 'axios'
-import PluginForm from '@/components/auth/Plugin'
+import PluginForm from '@/components/auth/Plugin.vue'
 
 export default {
   components: {
diff --git a/front/src/views/auth/ProfileActivity.vue b/front/src/views/auth/ProfileActivity.vue
index 433bd65705..ca7f8dc64c 100644
--- a/front/src/views/auth/ProfileActivity.vue
+++ b/front/src/views/auth/ProfileActivity.vue
@@ -50,9 +50,9 @@
 </template>
 
 <script>
-import TrackWidget from '@/components/audio/track/Widget'
-import PlaylistWidget from '@/components/playlists/Widget'
-import RadioButton from '@/components/radios/Button'
+import TrackWidget from '@/components/audio/track/Widget.vue'
+import PlaylistWidget from '@/components/playlists/Widget.vue'
+import RadioButton from '@/components/radios/Button.vue'
 
 export default {
   components: { TrackWidget, PlaylistWidget, RadioButton },
diff --git a/front/src/views/auth/ProfileBase.vue b/front/src/views/auth/ProfileBase.vue
index bf525640c2..7650f8ab5a 100644
--- a/front/src/views/auth/ProfileBase.vue
+++ b/front/src/views/auth/ProfileBase.vue
@@ -139,7 +139,7 @@
 <script>
 import axios from 'axios'
 
-import ReportMixin from '@/components/mixins/Report'
+import ReportMixin from '@/components/mixins/Report.vue'
 
 export default {
   mixins: [ReportMixin],
diff --git a/front/src/views/auth/ProfileOverview.vue b/front/src/views/auth/ProfileOverview.vue
index 43c1428f2e..d71f45cecb 100644
--- a/front/src/views/auth/ProfileOverview.vue
+++ b/front/src/views/auth/ProfileOverview.vue
@@ -139,10 +139,10 @@
 </template>
 
 <script>
-import Modal from '@/components/semantic/Modal'
-import LibraryWidget from '@/components/federation/LibraryWidget'
-import ChannelsWidget from '@/components/audio/ChannelsWidget'
-import ChannelForm from '@/components/audio/ChannelForm'
+import Modal from '@/components/semantic/Modal.vue'
+import LibraryWidget from '@/components/federation/LibraryWidget.vue'
+import ChannelsWidget from '@/components/audio/ChannelsWidget.vue'
+import ChannelForm from '@/components/audio/ChannelForm.vue'
 
 export default {
   components: { ChannelsWidget, LibraryWidget, ChannelForm, Modal },
diff --git a/front/src/views/auth/Signup.vue b/front/src/views/auth/Signup.vue
index 605658727f..7a4353b737 100644
--- a/front/src/views/auth/Signup.vue
+++ b/front/src/views/auth/Signup.vue
@@ -21,7 +21,7 @@
 
 <script>
 
-import SignupForm from '@/components/auth/SignupForm'
+import SignupForm from '@/components/auth/SignupForm.vue'
 
 export default {
   components: {
diff --git a/front/src/views/channels/DetailBase.vue b/front/src/views/channels/DetailBase.vue
index 5e53474ed1..d2e70d5689 100644
--- a/front/src/views/channels/DetailBase.vue
+++ b/front/src/views/channels/DetailBase.vue
@@ -436,14 +436,14 @@
 
 <script>
 import axios from 'axios'
-import PlayButton from '@/components/audio/PlayButton'
-import EmbedWizard from '@/components/audio/EmbedWizard'
-import Modal from '@/components/semantic/Modal'
-import TagsList from '@/components/tags/List'
-import ReportMixin from '@/components/mixins/Report'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import EmbedWizard from '@/components/audio/EmbedWizard.vue'
+import Modal from '@/components/semantic/Modal.vue'
+import TagsList from '@/components/tags/List.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
 
-import SubscribeButton from '@/components/channels/SubscribeButton'
-import ChannelForm from '@/components/audio/ChannelForm'
+import SubscribeButton from '@/components/channels/SubscribeButton.vue'
+import ChannelForm from '@/components/audio/ChannelForm.vue'
 
 export default {
   components: {
diff --git a/front/src/views/channels/DetailEpisodes.vue b/front/src/views/channels/DetailEpisodes.vue
index 6d01f8736e..6aafda2fce 100644
--- a/front/src/views/channels/DetailEpisodes.vue
+++ b/front/src/views/channels/DetailEpisodes.vue
@@ -10,7 +10,7 @@
 </template>
 
 <script>
-import ChannelEntries from '@/components/audio/ChannelEntries'
+import ChannelEntries from '@/components/audio/ChannelEntries.vue'
 
 export default {
   components: {
diff --git a/front/src/views/channels/DetailOverview.vue b/front/src/views/channels/DetailOverview.vue
index cca63ded17..6e12a74cb9 100644
--- a/front/src/views/channels/DetailOverview.vue
+++ b/front/src/views/channels/DetailOverview.vue
@@ -143,9 +143,9 @@
 import axios from 'axios'
 import qs from 'qs'
 
-import ChannelEntries from '@/components/audio/ChannelEntries'
-import ChannelSeries from '@/components/audio/ChannelSeries'
-import AlbumModal from '@/components/channels/AlbumModal'
+import ChannelEntries from '@/components/audio/ChannelEntries.vue'
+import ChannelSeries from '@/components/audio/ChannelSeries.vue'
+import AlbumModal from '@/components/channels/AlbumModal.vue'
 
 export default {
   components: {
diff --git a/front/src/views/channels/SubscriptionsList.vue b/front/src/views/channels/SubscriptionsList.vue
index 30fff8f273..c2f86df32f 100644
--- a/front/src/views/channels/SubscriptionsList.vue
+++ b/front/src/views/channels/SubscriptionsList.vue
@@ -71,10 +71,10 @@
 
 <script>
 import axios from 'axios'
-import Modal from '@/components/semantic/Modal'
+import Modal from '@/components/semantic/Modal.vue'
 
-import ChannelsWidget from '@/components/audio/ChannelsWidget'
-import RemoteSearchForm from '@/components/RemoteSearchForm'
+import ChannelsWidget from '@/components/audio/ChannelsWidget.vue'
+import RemoteSearchForm from '@/components/RemoteSearchForm.vue'
 
 export default {
   components: {
diff --git a/front/src/views/content/libraries/Card.vue b/front/src/views/content/libraries/Card.vue
index d7cb065d69..837d0889c2 100644
--- a/front/src/views/content/libraries/Card.vue
+++ b/front/src/views/content/libraries/Card.vue
@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import TranslationsMixin from '@/components/mixins/Translations'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
 
 export default {
   mixins: [TranslationsMixin],
diff --git a/front/src/views/content/libraries/FilesTable.vue b/front/src/views/content/libraries/FilesTable.vue
index e38e61344b..4d1091cc6b 100644
--- a/front/src/views/content/libraries/FilesTable.vue
+++ b/front/src/views/content/libraries/FilesTable.vue
@@ -268,15 +268,15 @@
 <script>
 import axios from 'axios'
 import _ from '@/lodash'
-import time from '@/utils/time'
+import time from '@/utils/time.js'
 import { normalizeQuery, parseTokens } from '@/search'
 
-import Pagination from '@/components/Pagination'
-import ActionTable from '@/components/common/ActionTable'
-import OrderingMixin from '@/components/mixins/Ordering'
-import TranslationsMixin from '@/components/mixins/Translations'
-import SmartSearchMixin from '@/components/mixins/SmartSearch'
-import ImportStatusModal from '@/components/library/ImportStatusModal'
+import Pagination from '@/components/Pagination.vue'
+import ActionTable from '@/components/common/ActionTable.vue'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import SmartSearchMixin from '@/components/mixins/SmartSearch.vue'
+import ImportStatusModal from '@/components/library/ImportStatusModal.vue'
 
 export default {
   components: {
diff --git a/front/src/views/content/remote/Card.vue b/front/src/views/content/remote/Card.vue
index 813ed48c0d..ca890ba5f2 100644
--- a/front/src/views/content/remote/Card.vue
+++ b/front/src/views/content/remote/Card.vue
@@ -224,8 +224,8 @@
 </template>
 <script>
 import axios from 'axios'
-import ReportMixin from '@/components/mixins/Report'
-import RadioButton from '@/components/radios/Button'
+import ReportMixin from '@/components/mixins/Report.vue'
+import RadioButton from '@/components/radios/Button.vue'
 
 export default {
   components: {
diff --git a/front/src/views/library/DetailAlbums.vue b/front/src/views/library/DetailAlbums.vue
index dcac36832e..ac0e2f06b3 100644
--- a/front/src/views/library/DetailAlbums.vue
+++ b/front/src/views/library/DetailAlbums.vue
@@ -30,7 +30,7 @@
 </template>
 
 <script>
-import AlbumWidget from '@/components/audio/album/Widget'
+import AlbumWidget from '@/components/audio/album/Widget.vue'
 
 export default {
   components: {
diff --git a/front/src/views/library/DetailBase.vue b/front/src/views/library/DetailBase.vue
index 88b5cbc3be..e0068f8e27 100644
--- a/front/src/views/library/DetailBase.vue
+++ b/front/src/views/library/DetailBase.vue
@@ -227,9 +227,9 @@
 
 <script>
 import axios from 'axios'
-import LibraryFollowButton from '@/components/audio/LibraryFollowButton'
-import ReportMixin from '@/components/mixins/Report'
-import RadioButton from '@/components/radios/Button'
+import LibraryFollowButton from '@/components/audio/LibraryFollowButton.vue'
+import ReportMixin from '@/components/mixins/Report.vue'
+import RadioButton from '@/components/radios/Button.vue'
 
 export default {
   components: {
diff --git a/front/src/views/library/DetailOverview.vue b/front/src/views/library/DetailOverview.vue
index d669848144..5743515891 100644
--- a/front/src/views/library/DetailOverview.vue
+++ b/front/src/views/library/DetailOverview.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script>
-import ArtistWidget from '@/components/audio/artist/Widget'
+import ArtistWidget from '@/components/audio/artist/Widget.vue'
 
 export default {
   components: {
diff --git a/front/src/views/library/DetailTracks.vue b/front/src/views/library/DetailTracks.vue
index 45f55addd5..4271019a51 100644
--- a/front/src/views/library/DetailTracks.vue
+++ b/front/src/views/library/DetailTracks.vue
@@ -29,7 +29,7 @@
 </template>
 
 <script>
-import TrackTable from '@/components/audio/track/Table'
+import TrackTable from '@/components/audio/track/Table.vue'
 
 export default {
   components: {
diff --git a/front/src/views/library/Edit.vue b/front/src/views/library/Edit.vue
index 00ba50c71e..55d1bf2c34 100644
--- a/front/src/views/library/Edit.vue
+++ b/front/src/views/library/Edit.vue
@@ -114,8 +114,8 @@
 </template>
 
 <script>
-import LibraryFilesTable from '@/views/content/libraries/FilesTable'
-import LibraryForm from '@/views/content/libraries/Form'
+import LibraryFilesTable from '@/views/content/libraries/FilesTable.vue'
+import LibraryForm from '@/views/content/libraries/Form.vue'
 import axios from 'axios'
 
 export default {
diff --git a/front/src/views/library/Upload.vue b/front/src/views/library/Upload.vue
index 48dda7e291..08813503a1 100644
--- a/front/src/views/library/Upload.vue
+++ b/front/src/views/library/Upload.vue
@@ -11,7 +11,7 @@
 
 <script>
 
-import FileUpload from '@/components/library/FileUpload'
+import FileUpload from '@/components/library/FileUpload.vue'
 
 export default {
   components: {
diff --git a/front/src/views/playlists/Detail.vue b/front/src/views/playlists/Detail.vue
index 8cc6fa6d20..b1ac122384 100644
--- a/front/src/views/playlists/Detail.vue
+++ b/front/src/views/playlists/Detail.vue
@@ -174,11 +174,11 @@
 </template>
 <script>
 import axios from 'axios'
-import TrackTable from '@/components/audio/track/Table'
-import PlayButton from '@/components/audio/PlayButton'
-import PlaylistEditor from '@/components/playlists/Editor'
-import EmbedWizard from '@/components/audio/EmbedWizard'
-import Modal from '@/components/semantic/Modal'
+import TrackTable from '@/components/audio/track/Table.vue'
+import PlayButton from '@/components/audio/PlayButton.vue'
+import PlaylistEditor from '@/components/playlists/Editor.vue'
+import EmbedWizard from '@/components/audio/EmbedWizard.vue'
+import Modal from '@/components/semantic/Modal.vue'
 
 export default {
   components: {
diff --git a/front/src/views/playlists/List.vue b/front/src/views/playlists/List.vue
index 4ad0cdb126..177775e321 100644
--- a/front/src/views/playlists/List.vue
+++ b/front/src/views/playlists/List.vue
@@ -140,11 +140,11 @@
 import axios from 'axios'
 import $ from 'jquery'
 
-import OrderingMixin from '@/components/mixins/Ordering'
-import PaginationMixin from '@/components/mixins/Pagination'
-import TranslationsMixin from '@/components/mixins/Translations'
-import PlaylistCardList from '@/components/playlists/CardList'
-import Pagination from '@/components/Pagination'
+import OrderingMixin from '@/components/mixins/Ordering.vue'
+import PaginationMixin from '@/components/mixins/Pagination.vue'
+import TranslationsMixin from '@/components/mixins/Translations.vue'
+import PlaylistCardList from '@/components/playlists/CardList.vue'
+import Pagination from '@/components/Pagination.vue'
 
 const FETCH_URL = 'playlists/'
 
diff --git a/front/src/views/radios/Detail.vue b/front/src/views/radios/Detail.vue
index 7c72ff87b2..0fb038512f 100644
--- a/front/src/views/radios/Detail.vue
+++ b/front/src/views/radios/Detail.vue
@@ -111,9 +111,9 @@
 
 <script>
 import axios from 'axios'
-import TrackTable from '@/components/audio/track/Table'
-import RadioButton from '@/components/radios/Button'
-import Pagination from '@/components/Pagination'
+import TrackTable from '@/components/audio/track/Table.vue'
+import RadioButton from '@/components/radios/Button.vue'
+import Pagination from '@/components/Pagination.vue'
 
 export default {
   components: {
-- 
GitLab