chore(eslint): fix missing import extensions

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

41 files changed, 117 insertions, 117 deletions

diff --git a/apps/settings/src/components/AdminDelegating.vue b/apps/settings/src/components/AdminDelegating.vue
index e61b0cb74bb..f3defc88207 100644
--- a/apps/settings/src/components/AdminDelegating.vue
+++ b/apps/settings/src/components/AdminDelegating.vue
@@ -12,8 +12,8 @@
 </template>
 
 <script>
-import GroupSelect from './AdminDelegation/GroupSelect'
-import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection'
+import GroupSelect from './AdminDelegation/GroupSelect.vue'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import { loadState } from '@nextcloud/initial-state'
 
 export default {
diff --git a/apps/settings/src/components/AdminDelegation/GroupSelect.vue b/apps/settings/src/components/AdminDelegation/GroupSelect.vue
index f59a41d86e6..82b5e51fb45 100644
--- a/apps/settings/src/components/AdminDelegation/GroupSelect.vue
+++ b/apps/settings/src/components/AdminDelegation/GroupSelect.vue
@@ -14,7 +14,7 @@ import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js'
 import { generateUrl } from '@nextcloud/router'
 import axios from '@nextcloud/axios'
 import { showError } from '@nextcloud/dialogs'
-import logger from '../../logger'
+import logger from '../../logger.js'
 
 export default {
 	name: 'GroupSelect',
diff --git a/apps/settings/src/components/AdminTwoFactor.vue b/apps/settings/src/components/AdminTwoFactor.vue
index 950b857b07a..5be6eaaf512 100644
--- a/apps/settings/src/components/AdminTwoFactor.vue
+++ b/apps/settings/src/components/AdminTwoFactor.vue
@@ -65,10 +65,10 @@
 
 <script>
 import axios from '@nextcloud/axios'
-import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch'
-import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection'
+import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import { loadState } from '@nextcloud/initial-state'
 
 import _ from 'lodash'
diff --git a/apps/settings/src/components/AppDetails.vue b/apps/settings/src/components/AppDetails.vue
index f4cae83f167..0a963f1b636 100644
--- a/apps/settings/src/components/AppDetails.vue
+++ b/apps/settings/src/components/AppDetails.vue
@@ -146,11 +146,11 @@
 </template>
 
 <script>
-import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
+import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect.js'
 
-import AppManagement from '../mixins/AppManagement'
-import PrefixMixin from './PrefixMixin'
-import Markdown from './Markdown'
+import AppManagement from '../mixins/AppManagement.js'
+import PrefixMixin from './PrefixMixin.vue'
+import Markdown from './Markdown.vue'
 
 export default {
 	name: 'AppDetails',
diff --git a/apps/settings/src/components/AppList.vue b/apps/settings/src/components/AppList.vue
index bb7c932613e..234fde088e1 100644
--- a/apps/settings/src/components/AppList.vue
+++ b/apps/settings/src/components/AppList.vue
@@ -104,10 +104,10 @@
 </template>
 
 <script>
-import AppItem from './AppList/AppItem'
-import PrefixMixin from './PrefixMixin'
+import AppItem from './AppList/AppItem.vue'
+import PrefixMixin from './PrefixMixin.vue'
 import pLimit from 'p-limit'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
 export default {
 	name: 'AppList',
diff --git a/apps/settings/src/components/AuthTokenList.vue b/apps/settings/src/components/AuthTokenList.vue
index 491b672d59a..d00e0847fb8 100644
--- a/apps/settings/src/components/AuthTokenList.vue
+++ b/apps/settings/src/components/AuthTokenList.vue
@@ -42,7 +42,7 @@
 </template>
 
 <script>
-import AuthToken from './AuthToken'
+import AuthToken from './AuthToken.vue'
 
 export default {
 	name: 'AuthTokenList',
diff --git a/apps/settings/src/components/AuthTokenSection.vue b/apps/settings/src/components/AuthTokenSection.vue
index 36eb35fcf48..01a85f4ae1b 100644
--- a/apps/settings/src/components/AuthTokenSection.vue
+++ b/apps/settings/src/components/AuthTokenSection.vue
@@ -40,8 +40,8 @@ import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
 import { generateUrl } from '@nextcloud/router'
 
-import AuthTokenList from './AuthTokenList'
-import AuthTokenSetupDialogue from './AuthTokenSetupDialogue'
+import AuthTokenList from './AuthTokenList.vue'
+import AuthTokenSetupDialogue from './AuthTokenSetupDialogue.vue'
 
 const confirm = () => {
 	return new Promise(resolve => {
diff --git a/apps/settings/src/components/AuthTokenSetupDialogue.vue b/apps/settings/src/components/AuthTokenSetupDialogue.vue
index 4c92d318b6e..63836290535 100644
--- a/apps/settings/src/components/AuthTokenSetupDialogue.vue
+++ b/apps/settings/src/components/AuthTokenSetupDialogue.vue
@@ -86,7 +86,7 @@ import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
 import { showError } from '@nextcloud/dialogs'
 import { getRootUrl } from '@nextcloud/router'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
 import Check from 'vue-material-design-icons/Check.vue'
 import ContentCopy from 'vue-material-design-icons/ContentCopy.vue'
diff --git a/apps/settings/src/components/BasicSettings/ProfileSettings.vue b/apps/settings/src/components/BasicSettings/ProfileSettings.vue
index 0519e60a30b..8b63940e257 100644
--- a/apps/settings/src/components/BasicSettings/ProfileSettings.vue
+++ b/apps/settings/src/components/BasicSettings/ProfileSettings.vue
@@ -43,11 +43,11 @@
 import { loadState } from '@nextcloud/initial-state'
 import { showError } from '@nextcloud/dialogs'
 
-import { saveProfileDefault } from '../../service/ProfileService'
-import { validateBoolean } from '../../utils/validate'
-import logger from '../../logger'
+import { saveProfileDefault } from '../../service/ProfileService.js'
+import { validateBoolean } from '../../utils/validate.js'
+import logger from '../../logger.js'
 
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
 
 const profileEnabledByDefault = loadState('settings', 'profileEnabledByDefault', true)
 
diff --git a/apps/settings/src/components/Encryption.vue b/apps/settings/src/components/Encryption.vue
index cec060b32d8..db7a7907761 100644
--- a/apps/settings/src/components/Encryption.vue
+++ b/apps/settings/src/components/Encryption.vue
@@ -77,9 +77,9 @@
 
 <script>
 import axios from '@nextcloud/axios'
-import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
-import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection'
+import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 import { loadState } from '@nextcloud/initial-state'
 import { getLoggerBuilder } from '@nextcloud/logger'
 
diff --git a/apps/settings/src/components/GroupListItem.vue b/apps/settings/src/components/GroupListItem.vue
index 12bdcedcd8f..639811d1e39 100644
--- a/apps/settings/src/components/GroupListItem.vue
+++ b/apps/settings/src/components/GroupListItem.vue
@@ -53,10 +53,10 @@
 </template>
 
 <script>
-import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput'
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
-import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble'
-import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
+import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
+import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
 
 export default {
 	name: 'GroupListItem',
diff --git a/apps/settings/src/components/PersonalInfo/AvatarSection.vue b/apps/settings/src/components/PersonalInfo/AvatarSection.vue
index ce3c80d4820..0ca6c52bacf 100644
--- a/apps/settings/src/components/PersonalInfo/AvatarSection.vue
+++ b/apps/settings/src/components/PersonalInfo/AvatarSection.vue
@@ -99,15 +99,15 @@ import { getCurrentUser } from '@nextcloud/auth'
 import { getFilePickerBuilder, showError } from '@nextcloud/dialogs'
 import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
 
-import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import VueCropper from 'vue-cropperjs'
 // eslint-disable-next-line node/no-extraneous-import
 import 'cropperjs/dist/cropper.css'
 
-import Upload from 'vue-material-design-icons/Upload'
-import Folder from 'vue-material-design-icons/Folder'
-import Delete from 'vue-material-design-icons/Delete'
+import Upload from 'vue-material-design-icons/Upload.vue'
+import Folder from 'vue-material-design-icons/Folder.vue'
+import Delete from 'vue-material-design-icons/Delete.vue'
 
 import HeaderBar from './shared/HeaderBar.vue'
 import { NAME_READABLE_ENUM } from '../../constants/AccountPropertyConstants.js'
@@ -162,6 +162,12 @@ export default {
 		}
 	},
 
+	computed: {
+		inputId() {
+			return `account-property-${this.avatar.name}`
+		},
+	},
+
 	created() {
 		subscribe('settings:display-name:updated', this.handleDisplayNameUpdate)
 	},
@@ -170,12 +176,6 @@ export default {
 		unsubscribe('settings:display-name:updated', this.handleDisplayNameUpdate)
 	},
 
-	computed: {
-		inputId() {
-			return `account-property-${this.avatar.name}`
-		},
-	},
-
 	methods: {
 		activateLocalFilePicker() {
 			// Set to null so that selecting the same file will trigger the change event
diff --git a/apps/settings/src/components/PersonalInfo/DetailsSection.vue b/apps/settings/src/components/PersonalInfo/DetailsSection.vue
index 7d11e50d3bc..ebfbe51d654 100644
--- a/apps/settings/src/components/PersonalInfo/DetailsSection.vue
+++ b/apps/settings/src/components/PersonalInfo/DetailsSection.vue
@@ -47,10 +47,10 @@
 
 <script>
 import { loadState } from '@nextcloud/initial-state'
-import NcProgressBar from '@nextcloud/vue/dist/Components/NcProgressBar'
+import NcProgressBar from '@nextcloud/vue/dist/Components/NcProgressBar.js'
 
-import Account from 'vue-material-design-icons/Account'
-import CircleSlice from 'vue-material-design-icons/CircleSlice3'
+import Account from 'vue-material-design-icons/Account.vue'
+import CircleSlice from 'vue-material-design-icons/CircleSlice3.vue'
 
 import HeaderBar from './shared/HeaderBar.vue'
 
diff --git a/apps/settings/src/components/PersonalInfo/EmailSection/Email.vue b/apps/settings/src/components/PersonalInfo/EmailSection/Email.vue
index c6c4376fa10..ca83be9aafe 100644
--- a/apps/settings/src/components/PersonalInfo/EmailSection/Email.vue
+++ b/apps/settings/src/components/PersonalInfo/EmailSection/Email.vue
@@ -89,7 +89,7 @@
 import { NcActions, NcActionButton } from '@nextcloud/vue'
 import AlertCircle from 'vue-material-design-icons/AlertCircleOutline.vue'
 import AlertOctagon from 'vue-material-design-icons/AlertOctagon.vue'
-import Check from 'vue-material-design-icons/Check'
+import Check from 'vue-material-design-icons/Check.vue'
 import { showError } from '@nextcloud/dialogs'
 import debounce from 'debounce'
 
diff --git a/apps/settings/src/components/PersonalInfo/LocaleSection/Locale.vue b/apps/settings/src/components/PersonalInfo/LocaleSection/Locale.vue
index 025938c4149..f5eb6f13320 100644
--- a/apps/settings/src/components/PersonalInfo/LocaleSection/Locale.vue
+++ b/apps/settings/src/components/PersonalInfo/LocaleSection/Locale.vue
@@ -60,7 +60,7 @@
 <script>
 import { showError } from '@nextcloud/dialogs'
 import moment from '@nextcloud/moment'
-import Web from 'vue-material-design-icons/Web'
+import Web from 'vue-material-design-icons/Web.vue'
 
 import { ACCOUNT_SETTING_PROPERTY_ENUM } from '../../../constants/AccountPropertyConstants.js'
 import { savePrimaryAccountProperty } from '../../../service/PersonalInfo/PersonalInfoService.js'
diff --git a/apps/settings/src/components/PersonalInfo/ProfileSection/EditProfileAnchorLink.vue b/apps/settings/src/components/PersonalInfo/ProfileSection/EditProfileAnchorLink.vue
index 61a7bfc908d..0732486ea44 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileSection/EditProfileAnchorLink.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileSection/EditProfileAnchorLink.vue
@@ -31,7 +31,7 @@
 </template>
 
 <script>
-import ChevronDownIcon from 'vue-material-design-icons/ChevronDown'
+import ChevronDownIcon from 'vue-material-design-icons/ChevronDown.vue'
 
 export default {
 	name: 'EditProfileAnchorLink',
diff --git a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
index 522794a832d..8016fe9e459 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileSection/ProfilePreviewCard.vue
@@ -44,7 +44,7 @@
 import { getCurrentUser } from '@nextcloud/auth'
 import { generateUrl } from '@nextcloud/router'
 
-import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
+import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
 
 export default {
 	name: 'ProfilePreviewCard',
diff --git a/apps/settings/src/components/PersonalInfo/shared/AccountPropertySection.vue b/apps/settings/src/components/PersonalInfo/shared/AccountPropertySection.vue
index c80d1a36658..7ab5619ab87 100644
--- a/apps/settings/src/components/PersonalInfo/shared/AccountPropertySection.vue
+++ b/apps/settings/src/components/PersonalInfo/shared/AccountPropertySection.vue
@@ -74,8 +74,8 @@ import debounce from 'debounce'
 import { showError } from '@nextcloud/dialogs'
 
 import AlertCircle from 'vue-material-design-icons/AlertCircleOutline.vue'
-import AlertOctagon from 'vue-material-design-icons/AlertOctagon'
-import Check from 'vue-material-design-icons/Check'
+import AlertOctagon from 'vue-material-design-icons/AlertOctagon.vue'
+import Check from 'vue-material-design-icons/Check.vue'
 
 import HeaderBar from '../shared/HeaderBar.vue'
 
diff --git a/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue b/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue
index ae1392fe580..11a6beef534 100644
--- a/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue
+++ b/apps/settings/src/components/PersonalInfo/shared/FederationControl.vue
@@ -40,7 +40,7 @@
 </template>
 
 <script>
-import NcActions from '@nextcloud/vue/dist/Components/NcActions'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
 import { loadState } from '@nextcloud/initial-state'
 import { showError } from '@nextcloud/dialogs'
 
diff --git a/apps/settings/src/components/PersonalInfo/shared/FederationControlAction.vue b/apps/settings/src/components/PersonalInfo/shared/FederationControlAction.vue
index 850a9fa42f2..ad58ff282eb 100644
--- a/apps/settings/src/components/PersonalInfo/shared/FederationControlAction.vue
+++ b/apps/settings/src/components/PersonalInfo/shared/FederationControlAction.vue
@@ -34,7 +34,7 @@
 </template>
 
 <script>
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 
 export default {
 	name: 'FederationControlAction',
diff --git a/apps/settings/src/components/PersonalInfo/shared/HeaderBar.vue b/apps/settings/src/components/PersonalInfo/shared/HeaderBar.vue
index 541b46fb591..0e42005861c 100644
--- a/apps/settings/src/components/PersonalInfo/shared/HeaderBar.vue
+++ b/apps/settings/src/components/PersonalInfo/shared/HeaderBar.vue
@@ -49,8 +49,8 @@
 </template>
 
 <script>
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
-import Plus from 'vue-material-design-icons/Plus'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import Plus from 'vue-material-design-icons/Plus.vue'
 
 import FederationControl from './FederationControl.vue'
 
diff --git a/apps/settings/src/components/UserList.vue b/apps/settings/src/components/UserList.vue
index 9d737206bf4..6aa61ccf8da 100644
--- a/apps/settings/src/components/UserList.vue
+++ b/apps/settings/src/components/UserList.vue
@@ -237,11 +237,11 @@
 import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 import InfiniteLoading from 'vue-infinite-loading'
 import Vue from 'vue'
-import NcModal from '@nextcloud/vue/dist/Components/NcModal'
-import NcButton from '@nextcloud/vue/dist/Components/NcButton'
-import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
+import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
+import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
+import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect.js'
 
-import userRow from './UserList/UserRow'
+import userRow from './UserList/UserRow.vue'
 
 const unlimitedQuota = {
 	id: 'none',
diff --git a/apps/settings/src/components/UserList/UserRow.vue b/apps/settings/src/components/UserList/UserRow.vue
index 797156f1882..f840b8cdf77 100644
--- a/apps/settings/src/components/UserList/UserRow.vue
+++ b/apps/settings/src/components/UserList/UserRow.vue
@@ -244,8 +244,8 @@ import {
 	NcActions,
 	NcActionButton,
 } from '@nextcloud/vue'
-import UserRowSimple from './UserRowSimple'
-import UserRowMixin from '../../mixins/UserRowMixin'
+import UserRowSimple from './UserRowSimple.vue'
+import UserRowMixin from '../../mixins/UserRowMixin.js'
 
 export default {
 	name: 'UserRow',
diff --git a/apps/settings/src/components/UserList/UserRowSimple.vue b/apps/settings/src/components/UserList/UserRowSimple.vue
index eddc16a64a5..8f5e3ae8e84 100644
--- a/apps/settings/src/components/UserList/UserRowSimple.vue
+++ b/apps/settings/src/components/UserList/UserRowSimple.vue
@@ -83,12 +83,12 @@
 </template>
 
 <script>
-import NcPopoverMenu from '@nextcloud/vue/dist/Components/NcPopoverMenu'
-import NcActions from '@nextcloud/vue/dist/Components/NcActions'
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import NcPopoverMenu from '@nextcloud/vue/dist/Components/NcPopoverMenu.js'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import ClickOutside from 'vue-click-outside'
 import { getCurrentUser } from '@nextcloud/auth'
-import UserRowMixin from '../../mixins/UserRowMixin'
+import UserRowMixin from '../../mixins/UserRowMixin.js'
 export default {
 	name: 'UserRowSimple',
 	components: {
diff --git a/apps/settings/src/components/WebAuthn/AddDevice.vue b/apps/settings/src/components/WebAuthn/AddDevice.vue
index 3fec2d84351..947bc662418 100644
--- a/apps/settings/src/components/WebAuthn/AddDevice.vue
+++ b/apps/settings/src/components/WebAuthn/AddDevice.vue
@@ -64,11 +64,11 @@
 import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
 
-import logger from '../../logger'
+import logger from '../../logger.js'
 import {
 	startRegistration,
 	finishRegistration,
-} from '../../service/WebAuthnRegistrationSerice'
+} from '../../service/WebAuthnRegistrationSerice.js'
 
 const logAndPass = (text) => (data) => {
 	logger.debug(text)
diff --git a/apps/settings/src/components/WebAuthn/Device.vue b/apps/settings/src/components/WebAuthn/Device.vue
index d5a0623ab68..1de2661b8dc 100644
--- a/apps/settings/src/components/WebAuthn/Device.vue
+++ b/apps/settings/src/components/WebAuthn/Device.vue
@@ -32,8 +32,8 @@
 </template>
 
 <script>
-import NcActions from '@nextcloud/vue/dist/Components/NcActions'
-import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton'
+import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
+import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 
 export default {
 	name: 'Device',
diff --git a/apps/settings/src/components/WebAuthn/Section.vue b/apps/settings/src/components/WebAuthn/Section.vue
index db6cc1dafc3..9172a8ca080 100644
--- a/apps/settings/src/components/WebAuthn/Section.vue
+++ b/apps/settings/src/components/WebAuthn/Section.vue
@@ -50,12 +50,12 @@
 <script>
 import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
-import sortBy from 'lodash/fp/sortBy'
+import sortBy from 'lodash/fp/sortBy.js'
 
-import AddDevice from './AddDevice'
-import Device from './Device'
-import logger from '../../logger'
-import { removeRegistration } from '../../service/WebAuthnRegistrationSerice'
+import AddDevice from './AddDevice.vue'
+import Device from './Device.vue'
+import logger from '../../logger.js'
+import { removeRegistration } from '../../service/WebAuthnRegistrationSerice.js'
 
 const sortByName = sortBy('name')
 
diff --git a/apps/settings/src/main-admin-basic-settings.js b/apps/settings/src/main-admin-basic-settings.js
index 5ccf7da4676..46393ae4b8f 100644
--- a/apps/settings/src/main-admin-basic-settings.js
+++ b/apps/settings/src/main-admin-basic-settings.js
@@ -26,10 +26,10 @@ import { loadState } from '@nextcloud/initial-state'
 import { translate as t } from '@nextcloud/l10n'
 import '@nextcloud/dialogs/dist/index.css'
 
-import logger from './logger'
+import logger from './logger.js'
 
-import ProfileSettings from './components/BasicSettings/ProfileSettings'
-import BackgroundJob from './components/BasicSettings/BackgroundJob'
+import ProfileSettings from './components/BasicSettings/ProfileSettings.vue'
+import BackgroundJob from './components/BasicSettings/BackgroundJob.vue'
 
 __webpack_nonce__ = btoa(getRequestToken())
 
diff --git a/apps/settings/src/main-admin-security.js b/apps/settings/src/main-admin-security.js
index bd586189743..f3279f45c93 100644
--- a/apps/settings/src/main-admin-security.js
+++ b/apps/settings/src/main-admin-security.js
@@ -27,7 +27,7 @@ import Vue from 'vue'
 
 import AdminTwoFactor from './components/AdminTwoFactor.vue'
 import Encryption from './components/Encryption.vue'
-import store from './store/admin-security'
+import store from './store/admin-security.js'
 
 // eslint-disable-next-line camelcase
 __webpack_nonce__ = btoa(OC.requestToken)
diff --git a/apps/settings/src/main-apps-users-management.js b/apps/settings/src/main-apps-users-management.js
index 59b7aa3c5b7..f81670fa624 100644
--- a/apps/settings/src/main-apps-users-management.js
+++ b/apps/settings/src/main-apps-users-management.js
@@ -27,8 +27,8 @@ import VTooltip from 'v-tooltip'
 import { sync } from 'vuex-router-sync'
 
 import App from './App.vue'
-import router from './router'
-import store from './store'
+import router from './router.js'
+import store from './store/index.js'
 
 Vue.use(VTooltip, { defaultHtml: false })
 
diff --git a/apps/settings/src/main-personal-security.js b/apps/settings/src/main-personal-security.js
index 31e798d5646..634deca61b5 100644
--- a/apps/settings/src/main-personal-security.js
+++ b/apps/settings/src/main-personal-security.js
@@ -25,7 +25,7 @@ import { loadState } from '@nextcloud/initial-state'
 import Vue from 'vue'
 import VTooltip from 'v-tooltip'
 
-import AuthTokenSection from './components/AuthTokenSection'
+import AuthTokenSection from './components/AuthTokenSection.vue'
 
 // eslint-disable-next-line camelcase
 __webpack_nonce__ = btoa(OC.requestToken)
diff --git a/apps/settings/src/main-personal-webauth.js b/apps/settings/src/main-personal-webauth.js
index 650130573c9..dc11ecdbba2 100644
--- a/apps/settings/src/main-personal-webauth.js
+++ b/apps/settings/src/main-personal-webauth.js
@@ -23,7 +23,7 @@
 import Vue from 'vue'
 import { loadState } from '@nextcloud/initial-state'
 
-import WebAuthnSection from './components/WebAuthn/Section'
+import WebAuthnSection from './components/WebAuthn/Section.vue'
 
 // eslint-disable-next-line camelcase
 __webpack_nonce__ = btoa(OC.requestToken)
diff --git a/apps/settings/src/router.js b/apps/settings/src/router.js
index cf842475c5d..977cab2de96 100644
--- a/apps/settings/src/router.js
+++ b/apps/settings/src/router.js
@@ -30,8 +30,8 @@ import store from './store/index.js'
 import { setPageHeading } from '../../../core/src/OCP/accessibility.js'
 
 // Dynamic loading
-const Users = () => import(/* webpackChunkName: 'settings-users' */'./views/Users')
-const Apps = () => import(/* webpackChunkName: 'settings-apps-view' */'./views/Apps')
+const Users = () => import(/* webpackChunkName: 'settings-users' */'./views/Users.vue')
+const Apps = () => import(/* webpackChunkName: 'settings-apps-view' */'./views/Apps.vue')
 
 Vue.use(Router)
 
diff --git a/apps/settings/src/service/PersonalInfo/EmailService.js b/apps/settings/src/service/PersonalInfo/EmailService.js
index 90301715521..535bd6a2295 100644
--- a/apps/settings/src/service/PersonalInfo/EmailService.js
+++ b/apps/settings/src/service/PersonalInfo/EmailService.js
@@ -26,7 +26,7 @@ import { generateOcsUrl } from '@nextcloud/router'
 import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
 
-import { ACCOUNT_PROPERTY_ENUM, SCOPE_SUFFIX } from '../../constants/AccountPropertyConstants'
+import { ACCOUNT_PROPERTY_ENUM, SCOPE_SUFFIX } from '../../constants/AccountPropertyConstants.js'
 
 /**
  * Save the primary email of the user
diff --git a/apps/settings/src/service/PersonalInfo/PersonalInfoService.js b/apps/settings/src/service/PersonalInfo/PersonalInfoService.js
index f39d29011ba..2e386a98bec 100644
--- a/apps/settings/src/service/PersonalInfo/PersonalInfoService.js
+++ b/apps/settings/src/service/PersonalInfo/PersonalInfoService.js
@@ -26,7 +26,7 @@ import { generateOcsUrl } from '@nextcloud/router'
 import { confirmPassword } from '@nextcloud/password-confirmation'
 import '@nextcloud/password-confirmation/dist/style.css'
 
-import { SCOPE_SUFFIX } from '../../constants/AccountPropertyConstants'
+import { SCOPE_SUFFIX } from '../../constants/AccountPropertyConstants.js'
 
 /**
  * Save the primary account property value for the user
diff --git a/apps/settings/src/store/apps.js b/apps/settings/src/store/apps.js
index 29009fc65e0..6e23a012237 100644
--- a/apps/settings/src/store/apps.js
+++ b/apps/settings/src/store/apps.js
@@ -22,7 +22,7 @@
  *
  */
 
-import api from './api'
+import api from './api.js'
 import Vue from 'vue'
 import { generateUrl } from '@nextcloud/router'
 import { showError, showInfo } from '@nextcloud/dialogs'
diff --git a/apps/settings/src/store/index.js b/apps/settings/src/store/index.js
index 6689e4e5546..abb1f374691 100644
--- a/apps/settings/src/store/index.js
+++ b/apps/settings/src/store/index.js
@@ -23,10 +23,10 @@
 
 import Vue from 'vue'
 import Vuex, { Store } from 'vuex'
-import users from './users'
-import apps from './apps'
-import settings from './settings'
-import oc from './oc'
+import users from './users.js'
+import apps from './apps.js'
+import settings from './settings.js'
+import oc from './oc.js'
 import { showError } from '@nextcloud/dialogs'
 
 Vue.use(Vuex)
diff --git a/apps/settings/src/store/oc.js b/apps/settings/src/store/oc.js
index d2197701aec..1b8d6c98cad 100644
--- a/apps/settings/src/store/oc.js
+++ b/apps/settings/src/store/oc.js
@@ -21,7 +21,7 @@
  *
  */
 
-import api from './api'
+import api from './api.js'
 import { generateOcsUrl } from '@nextcloud/router'
 
 const state = {}
diff --git a/apps/settings/src/store/users.js b/apps/settings/src/store/users.js
index e89e5e968da..f1941aa6704 100644
--- a/apps/settings/src/store/users.js
+++ b/apps/settings/src/store/users.js
@@ -26,10 +26,10 @@
  *
  */
 
-import api from './api'
+import api from './api.js'
 import axios from '@nextcloud/axios'
 import { generateOcsUrl } from '@nextcloud/router'
-import logger from '../logger'
+import logger from '../logger.js'
 
 const orderGroups = function(groups, orderBy) {
 	/* const SORT_USERCOUNT = 1;
diff --git a/apps/settings/src/views/Apps.vue b/apps/settings/src/views/Apps.vue
index 1ba74c08ac5..f9f1023f928 100644
--- a/apps/settings/src/views/Apps.vue
+++ b/apps/settings/src/views/Apps.vue
@@ -139,20 +139,20 @@ import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 import Vue from 'vue'
 import VueLocalStorage from 'vue-localstorage'
 
-import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent'
-import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation'
-import NcAppNavigationCounter from '@nextcloud/vue/dist/Components/NcAppNavigationCounter'
-import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
-import NcAppNavigationSpacer from '@nextcloud/vue/dist/Components/NcAppNavigationSpacer'
-import NcAppSidebar from '@nextcloud/vue/dist/Components/NcAppSidebar'
-import NcAppSidebarTab from '@nextcloud/vue/dist/Components/NcAppSidebarTab'
-import NcContent from '@nextcloud/vue/dist/Components/NcContent'
-
-import AppList from '../components/AppList'
-import AppDetails from '../components/AppDetails'
-import AppManagement from '../mixins/AppManagement'
-import AppScore from '../components/AppList/AppScore'
-import Markdown from '../components/Markdown'
+import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
+import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
+import NcAppNavigationCounter from '@nextcloud/vue/dist/Components/NcAppNavigationCounter.js'
+import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
+import NcAppNavigationSpacer from '@nextcloud/vue/dist/Components/NcAppNavigationSpacer.js'
+import NcAppSidebar from '@nextcloud/vue/dist/Components/NcAppSidebar.js'
+import NcAppSidebarTab from '@nextcloud/vue/dist/Components/NcAppSidebarTab.js'
+import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
+
+import AppList from '../components/AppList.vue'
+import AppDetails from '../components/AppDetails.vue'
+import AppManagement from '../mixins/AppManagement.js'
+import AppScore from '../components/AppList/AppScore.vue'
+import Markdown from '../components/Markdown.vue'
 
 import { APPS_SECTION_ENUM } from './../constants/AppsConstants.js'
 
diff --git a/apps/settings/src/views/Users.vue b/apps/settings/src/views/Users.vue
index ce3ce235c31..dbff4f552a6 100644
--- a/apps/settings/src/views/Users.vue
+++ b/apps/settings/src/views/Users.vue
@@ -142,22 +142,22 @@
 </template>
 
 <script>
-import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent'
-import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation'
-import NcAppNavigationCaption from '@nextcloud/vue/dist/Components/NcAppNavigationCaption'
-import NcAppNavigationCounter from '@nextcloud/vue/dist/Components/NcAppNavigationCounter'
-import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem'
-import NcAppNavigationNew from '@nextcloud/vue/dist/Components/NcAppNavigationNew'
-import NcAppNavigationSettings from '@nextcloud/vue/dist/Components/NcAppNavigationSettings'
+import NcAppContent from '@nextcloud/vue/dist/Components/NcAppContent.js'
+import NcAppNavigation from '@nextcloud/vue/dist/Components/NcAppNavigation.js'
+import NcAppNavigationCaption from '@nextcloud/vue/dist/Components/NcAppNavigationCaption.js'
+import NcAppNavigationCounter from '@nextcloud/vue/dist/Components/NcAppNavigationCounter.js'
+import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
+import NcAppNavigationNew from '@nextcloud/vue/dist/Components/NcAppNavigationNew.js'
+import NcAppNavigationSettings from '@nextcloud/vue/dist/Components/NcAppNavigationSettings.js'
 import axios from '@nextcloud/axios'
-import NcContent from '@nextcloud/vue/dist/Components/NcContent'
+import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
 import { generateUrl } from '@nextcloud/router'
-import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
+import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect.js'
 import Vue from 'vue'
 import VueLocalStorage from 'vue-localstorage'
 
-import GroupListItem from '../components/GroupListItem'
-import UserList from '../components/UserList'
+import GroupListItem from '../components/GroupListItem.vue'
+import UserList from '../components/UserList.vue'
 
 Vue.use(VueLocalStorage)