feat: use defineComponent wrapper

src/views/404.vue

@@ -5,11 +5,8 @@
 	</div>
 </template>
 
-<script lang="ts">
-export default {
-	name: '404',
-	mounted() {
-		this.setTitle('404')
-	},
-}
+<script setup lang="ts">
+import {useTitle} from '@/composables/useTitle'
+
+useTitle(() => '404')
 </script>

src/views/labels/ListLabels.vue

@@ -97,6 +97,7 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import {mapState} from 'vuex'
 
 import LabelModel from '../../models/label'
@@ -105,7 +106,7 @@ import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
 import AsyncEditor from '@/components/input/AsyncEditor'
 import ColorPicker from '@/components/input/colorPicker'
 
-export default {
+export default defineComponent({
 	name: 'ListLabels',
 	components: {
 		ColorPicker,
@@ -160,5 +161,5 @@ export default {
 			this.$nextTick(() => this.editorActive = true)
 		},
 	},
-}
+})
 </script>

src/views/labels/NewLabel.vue

@@ -35,13 +35,14 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import LabelModel from '../../models/label'
 import CreateEdit from '@/components/misc/create-edit.vue'
 import ColorPicker from '../../components/input/colorPicker'
 import {mapState} from 'vuex'
 import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
 
-export default {
+export default defineComponent({
 	name: 'NewLabel',
 	data() {
 		return {
@@ -75,5 +76,5 @@ export default {
 			this.$message.success({message: this.$t('label.create.success')})
 		},
 	},
-}
+})
 </script>

src/views/list/ListKanban.vue

@@ -227,6 +227,7 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import draggable from 'vuedraggable'
 import cloneDeep from 'lodash.clonedeep'
 
@@ -252,7 +253,7 @@ const DRAG_OPTIONS = {
 
 const MIN_SCROLL_HEIGHT_PERCENT = 0.25
 
-export default {
+export default defineComponent({
 	name: 'Kanban',
 	components: {
 		ListWrapper,
@@ -602,7 +603,7 @@ export default {
 			saveCollapsedBucketState(this.listId, this.collapsedBuckets)
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss">

src/views/list/NewList.vue

@@ -32,12 +32,13 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import ListService from '../../services/list'
 import ListModel from '../../models/list'
 import CreateEdit from '@/components/misc/create-edit.vue'
 import ColorPicker from '../../components/input/colorPicker'
 
-export default {
+export default defineComponent({
 	name: 'NewList',
 	data() {
 		return {
@@ -70,5 +71,5 @@ export default {
 			})
 		},
 	},
-}
+})
 </script>

src/views/list/settings/archive.vue

@@ -12,9 +12,10 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import ListService from '@/services/list'
 
-export default {
+export default defineComponent({
 	name: 'list-setting-archive',
 	data() {
 		return {
@@ -46,5 +47,5 @@ export default {
 			}
 		},
 	},
-}
+})
 </script>

src/views/list/settings/background.vue

@@ -73,6 +73,7 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import {mapState} from 'vuex'
 import {getBlobFromBlurHash} from '../../../helpers/getBlobFromBlurHash'
 
@@ -85,7 +86,7 @@ import debounce from 'lodash.debounce'
 
 const SEARCH_DEBOUNCE = 300
 
-export default {
+export default defineComponent({
 	name: 'list-setting-background',
 	components: {CreateEdit},
 	data() {
@@ -179,7 +180,7 @@ export default {
 			this.$router.back()
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/list/settings/delete.vue

@@ -13,7 +13,9 @@
 </template>
 
 <script lang="ts">
-export default {
+import {defineComponent} from 'vue'
+
+export default defineComponent({
 	name: 'list-setting-delete',
 	created() {
 		this.setTitle(this.$t('list.delete.title', {list: this.list.title}))
@@ -30,5 +32,5 @@ export default {
 			this.$router.push({name: 'home'})
 		},
 	},
-}
+})
 </script>

src/views/list/settings/duplicate.vue

@@ -14,12 +14,14 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import ListDuplicateService from '@/services/listDuplicateService'
 import NamespaceSearch from '@/components/namespace/namespace-search.vue'
 import ListDuplicateModel from '@/models/listDuplicateModel'
 import CreateEdit from '@/components/misc/create-edit.vue'
 
-export default {
+export default defineComponent({
 	name: 'list-setting-duplicate',
 	data() {
 		return {
@@ -51,5 +53,5 @@ export default {
 			this.$router.push({name: 'list.index', params: {listId: duplicate.list.id}})
 		},
 	},
-}
+})
 </script>

src/views/list/settings/edit.vue

@@ -66,6 +66,8 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import AsyncEditor from '@/components/input/AsyncEditor'
 
 import ListModel from '@/models/list'
@@ -74,7 +76,7 @@ import ColorPicker from '@/components/input/colorPicker.vue'
 import {CURRENT_LIST} from '@/store/mutation-types'
 import CreateEdit from '@/components/misc/create-edit.vue'
 
-export default {
+export default defineComponent({
 	name: 'list-setting-edit',
 	data() {
 		return {
@@ -109,5 +111,5 @@ export default {
 			this.$router.back()
 		},
 	},
-}
+})
 </script>

src/views/list/settings/share.vue

@@ -23,9 +23,11 @@
 </template>
 
 <script lang="ts">
-export default {
+import {defineComponent} from 'vue'
+
+export default defineComponent({
 	name: 'list-setting-share',
-}
+})
 </script>
 
 <script lang="ts" setup>

src/views/migrator/Migrate.vue

@@ -21,9 +21,11 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import {MIGRATORS} from './migrators'
 
-export default {
+export default defineComponent({
 	name: 'Migrate',
 	mounted() {
 		this.setTitle(this.$t('migrate.title'))
@@ -35,7 +37,7 @@ export default {
 				.filter((item) => Boolean(item))
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/migrator/MigrateService.vue

@@ -66,6 +66,8 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import AbstractMigrationService from '@/services/migrator/abstractMigration'
 import AbstractMigrationFileService from '@/services/migrator/abstractMigrationFile'
 import Logo from '@/assets/logo.svg?component'
@@ -75,7 +77,7 @@ import {MIGRATORS} from './migrators'
 
 const PROGRESS_DOTS_COUNT = 8
 
-export default {
+export default defineComponent({
 	name: 'MigrateService',
 
 	components: {
@@ -170,7 +172,7 @@ export default {
 			}
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/namespaces/ListNamespaces.vue

@@ -69,12 +69,14 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import {mapState} from 'vuex'
 import Fancycheckbox from '../../components/input/fancycheckbox.vue'
 import {LOADING} from '@/store/mutation-types'
 import ListCard from '@/components/list/partials/list-card.vue'
 
-export default {
+export default defineComponent({
 	name: 'ListNamespaces',
 	components: {
 		ListCard,
@@ -103,7 +105,7 @@ export default {
 			localStorage.setItem('showArchived', JSON.stringify(this.showArchived))
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/namespaces/NewNamespace.vue

@@ -41,13 +41,15 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import Message from '@/components/misc/message'
 import NamespaceModel from '../../models/namespace'
 import NamespaceService from '../../services/namespace'
 import CreateEdit from '@/components/misc/create-edit.vue'
 import ColorPicker from '../../components/input/colorPicker'
 
-export default {
+export default defineComponent({
 	name: 'NewNamespace',
 	data() {
 		return {
@@ -78,5 +80,5 @@ export default {
 			this.$router.back()
 		},
 	},
-}
+})
 </script>

src/views/namespaces/settings/archive.vue

@@ -14,9 +14,11 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import NamespaceService from '@/services/namespace'
 
-export default {
+export default defineComponent({
 	name: 'namespace-setting-archive',
 	data() {
 		return {
@@ -49,5 +51,5 @@ export default {
 			}
 		},
 	},
-}
+})
 </script>

src/views/namespaces/settings/delete.vue

@@ -13,7 +13,9 @@
 </template>
 
 <script lang="ts">
-export default {
+import {defineComponent} from 'vue'
+
+export default defineComponent({
 	name: 'namespace-setting-delete',
 	computed: {
 		namespace() {
@@ -41,5 +43,5 @@ export default {
 			this.$router.push({name: 'home'})
 		},
 	},
-}
+})
 </script>

src/views/namespaces/settings/edit.vue

@@ -56,6 +56,8 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import AsyncEditor from '@/components/input/AsyncEditor'
 
 import NamespaceService from '@/services/namespace'
@@ -64,7 +66,7 @@ import Fancycheckbox from '@/components/input/fancycheckbox.vue'
 import ColorPicker from '@/components/input/colorPicker.vue'
 import CreateEdit from '@/components/misc/create-edit.vue'
 
-export default {
+export default defineComponent({
 	name: 'namespace-setting-edit',
 	data() {
 		return {
@@ -118,5 +120,5 @@ export default {
 			this.$router.back()
 		},
 	},
-}
+})
 </script>

src/views/namespaces/settings/share.vue

@@ -21,9 +21,11 @@
 </template>
 
 <script lang="ts">
-export default {
+import {defineComponent} from 'vue'
+
+export default defineComponent({
 	name: 'namespace-setting-share',
-}
+})
 </script>
 
 <script lang="ts" setup>

src/views/tasks/TaskDetailView.vue

@@ -414,6 +414,8 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import TaskService from '../../services/task'
 import TaskModel from '../../models/task'
 
@@ -444,7 +446,7 @@ import ChecklistSummary from '../../components/tasks/partials/checklist-summary'
 import CreatedUpdated from '@/components/tasks/partials/createdUpdated'
 
 
-export default {
+export default defineComponent({
 	name: 'TaskDetailView',
 	compatConfig: { ATTR_FALSE_VALUE: false },
 	components: {
@@ -685,7 +687,7 @@ export default {
 			this.$store.dispatch('namespaces/loadNamespacesIfFavoritesDontExist')
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/teams/EditTeam.vue

@@ -161,6 +161,8 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
+
 import AsyncEditor from '@/components/input/AsyncEditor'
 import {mapState} from 'vuex'
 import { i18n } from '@/i18n'
@@ -175,7 +177,7 @@ import Rights from '../../models/constants/rights.json'
 
 import Multiselect from '@/components/input/multiselect.vue'
 
-export default {
+export default defineComponent({
 	name: 'EditTeam',
 	data() {
 		return {
@@ -297,7 +299,7 @@ export default {
 			this.foundUsers = []
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/teams/ListTeams.vue

@@ -26,9 +26,10 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import TeamService from '../../services/team'
 
-export default {
+export default defineComponent({
 	name: 'ListTeams',
 	data() {
 		return {
@@ -47,7 +48,7 @@ export default {
 			this.teams = await this.teamService.getAll()
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/teams/NewTeam.vue

@@ -29,11 +29,12 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import TeamModel from '../../models/team'
 import TeamService from '../../services/team'
 import CreateEdit from '@/components/misc/create-edit.vue'
 
-export default {
+export default defineComponent({
 	name: 'NewTeam',
 	data() {
 		return {
@@ -64,5 +65,5 @@ export default {
 			this.$message.success({message: this.$t('team.create.success') })
 		},
 	},
-}
+})
 </script>

src/views/user/Login.vue

@@ -101,6 +101,7 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import {useDebounceFn} from '@vueuse/core'
 import {mapState} from 'vuex'
 
@@ -112,7 +113,7 @@ import {redirectToProvider} from '../../helpers/redirectToProvider'
 import {getLastVisited, clearLastVisited} from '../../helpers/saveLastVisited'
 import Password from '@/components/input/password'
 
-export default {
+export default defineComponent({
 	components: {
 		Password,
 		Message,
@@ -233,7 +234,7 @@ export default {
 
 		redirectToProvider,
 	},
-}
+})
 </script>
 
 <style lang="scss" scoped>

src/views/user/OpenIdAuth.vue

@@ -10,6 +10,7 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import {mapState} from 'vuex'
 
 import {LOADING} from '@/store/mutation-types'
@@ -17,7 +18,7 @@ import {getErrorText} from '@/message'
 import Message from '@/components/misc/message'
 import {clearLastVisited, getLastVisited} from '../../helpers/saveLastVisited'
 
-export default {
+export default defineComponent({
 	name: 'Auth',
 	components: {Message},
 	data() {
@@ -86,5 +87,5 @@ export default {
 			}
 		},
 	},
-}
+})
 </script>

src/views/user/settings/Avatar.vue

@@ -68,13 +68,14 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import {Cropper} from 'vue-advanced-cropper'
 import 'vue-advanced-cropper/dist/style.css'
 
 import AvatarService from '@/services/avatar'
 import AvatarModel from '@/models/avatar'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-avatar',
 	data() {
 		return {
@@ -144,7 +145,7 @@ export default {
 			reader.readAsDataURL(avatar[0])
 		},
 	},
-}
+})
 </script>
 
 <style lang="scss">

src/views/user/settings/Caldav.vue

@@ -25,11 +25,12 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import copy from 'copy-to-clipboard'
 import {mapState} from 'vuex'
 import {CALDAV_DOCS} from '@/urls'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-caldav',
 	data() {
 		return {
@@ -51,5 +52,5 @@ export default {
 	methods: {
 		copy,
 	},
-}
+})
 </script>

src/views/user/settings/DataExport.vue

@@ -39,9 +39,10 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import DataExportService from '@/services/dataExport'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-data-export',
 	data() {
 		return {
@@ -71,5 +72,5 @@ export default {
 			this.password = ''
 		},
 	},
-}
+})
 </script>

src/views/user/settings/Deletion.vue

@@ -83,11 +83,12 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import AccountDeleteService from '@/services/accountDelete'
 import {mapState} from 'vuex'
 import {parseDateOrNull} from '@/helpers/parseDateOrNull'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-deletion',
 	data() {
 		return {
@@ -129,5 +130,5 @@ export default {
 			this.password = ''
 		},
 	},
-}
+})
 </script>

src/views/user/settings/EmailUpdate.vue

@@ -37,10 +37,11 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import EmailUpdateService from '@/services/emailUpdate'
 import EmailUpdateModel from '@/models/emailUpdate'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-update-email',
 	data() {
 		return {
@@ -62,5 +63,5 @@ export default {
 			this.$message.success({message: this.$t('user.settings.updateEmailSuccess')})
 		},
 	},
-}
+})
 </script>

src/views/user/settings/General.vue

@@ -132,7 +132,7 @@
 </template>
 
 <script lang="ts">
-import {computed, watch, ref} from 'vue'
+import {defineComponent, computed, watch, ref} from 'vue'
 import {useI18n} from 'vue-i18n'
 
 import {playSoundWhenDoneKey, playPopSound} from '@/helpers/playPop'
@@ -186,7 +186,7 @@ function getPlaySoundWhenDoneSetting() {
 	return localStorage.getItem(playSoundWhenDoneKey) === 'true' || localStorage.getItem(playSoundWhenDoneKey) === null
 }
 
-export default {
+export default defineComponent({
 	name: 'user-settings-general',
 	data() {
 		return {
@@ -244,5 +244,5 @@ export default {
 			})
 		},
 	},
-}
+})
 </script>

src/views/user/settings/PasswordUpdate.vue

@@ -52,10 +52,11 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import PasswordUpdateService from '@/services/passwordUpdateService'
 import PasswordUpdateModel from '@/models/passwordUpdate'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-password-update',
 	data() {
 		return {
@@ -83,5 +84,5 @@ export default {
 			this.$message.success({message: this.$t('user.settings.passwordUpdateSuccess')})
 		},
 	},
-}
+})
 </script>

src/views/user/settings/TOTP.vue

@@ -64,11 +64,12 @@
 </template>
 
 <script lang="ts">
+import {defineComponent} from 'vue'
 import TotpService from '@/services/totp'
 import TotpModel from '@/models/totp'
 import {mapState} from 'vuex'
 
-export default {
+export default defineComponent({
 	name: 'user-settings-totp',
 	data() {
 		return {
@@ -129,5 +130,5 @@ export default {
 			this.$message.success({message: this.$t('user.settings.totp.disableSuccess')})
 		},
 	},
-}
+})
 </script>