feat: formatting

- remove unneeded data props
- prepare for compiler warnings vue3; see https://v3.vuejs.org/guide/migration/v-bind.html

src/components/home/contentAuth.vue

@@ -11,9 +11,7 @@
 			<navigation/>
 			<div
 				:class="[
-					{
-						'is-menu-enabled': menuActive,
-					},
+					{ 'is-menu-enabled': menuActive },
 					$route.name,
 				]"
 				class="app-content"
@@ -58,10 +56,6 @@ export default {
 		this.loadLabels()
 	},
 	computed: mapState({
-		namespaces(state) {
-			return state.namespaces.namespaces.filter(n => !n.isArchived)
-		},
-		currentList: CURRENT_LIST,
 		background: 'background',
 		menuActive: MENU_ACTIVE,
 		userInfo: state => state.auth.info,

src/components/home/navigation.vue

@@ -83,12 +83,12 @@
 						triggered by the change needs to have access to the current namespace
 					--> 
 					<draggable
+						v-bind="dragOptions"
 						:value="activeLists[nk]"
 						@input="(lists) => updateActiveLists(n, lists)"
 						:group="`namespace-${n.id}-lists`"
 						@start="() => drag = true"
 						@end="e => saveListPosition(e, nk)"
-						v-bind="dragOptions"
 						handle=".handle"
 						:disabled="n.id < 0"
 						:class="{'dragging-disabled': n.id < 0}"

src/components/misc/user.vue

@@ -47,8 +47,6 @@ export default {
 	}
 
 	img {
-		-webkit-border-radius: 100%;
-		-moz-border-radius: 100%;
 		border-radius: 100%;
 
 		vertical-align: middle;

src/components/notifications/notifications.vue

@@ -54,6 +54,8 @@ import names from '@/models/constants/notificationNames.json'
 import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
 import {mapState} from 'vuex'
 
+const LOAD_NOTIFICATIONS_INTERVAL = 10000
+
 export default {
 	name: 'notifications',
 	components: {User},
@@ -71,7 +73,7 @@ export default {
 	mounted() {
 		this.loadNotifications()
 		document.addEventListener('click', this.hidePopup)
-		this.interval = setInterval(this.loadNotifications, 10000)
+		this.interval = setInterval(this.loadNotifications, LOAD_NOTIFICATIONS_INTERVAL)
 	},
 	beforeDestroy() {
 		document.removeEventListener('click', this.hidePopup)

src/components/sharing/linkSharing.vue

@@ -196,7 +196,6 @@ export default {
 		return {
 			linkShares: [],
 			linkShareService: LinkShareService,
-			newLinkShare: LinkShareModel,
 			rights: rights,
 			selectedRight: rights.READ,
 			name: '',
@@ -277,9 +276,7 @@ export default {
 					this.showDeleteModal = false
 				})
 		},
-		copy(text) {
-			copy(text)
-		},
+		copy,
 		getShareLink(hash) {
 			return this.frontendUrl + 'share/' + hash + '/auth'
 		},

src/components/tasks/partials/comments.vue

@@ -56,7 +56,7 @@
 							</span>
 							<span
 								class="has-text-success"
-								v-if="
+								v-else-if="
 									!taskCommentService.loading &&
 									saved === c.id
 								"

src/components/tasks/partials/description.vue

@@ -10,7 +10,7 @@
 					<span class="loader is-inline-block mr-2"></span>
 					{{ $t('misc.saving') }}
 				</span>
-				<span class="is-small has-text-success" v-if="!loading && saved">
+				<span class="is-small has-text-success" v-else-if="!loading && saved">
 					<icon icon="check"/>
 					{{ $t('misc.saved') }}
 				</span>

src/components/tasks/partials/heading.vue

@@ -1,8 +1,6 @@
 <template>
 	<div class="heading">
-		<h1 class="title task-id">
-			{{ task.getTextIdentifier && task.getTextIdentifier() ? task.getTextIdentifier() : '' }}
-		</h1>
+		<h1 class="title task-id">{{ textIdentifier }}</h1>
 		<div class="is-done" v-if="task.done">Done</div>
 		<h1
 			class="title input"
@@ -11,13 +9,16 @@
 			@keydown.enter.prevent.stop="$event.target.blur()"
 			:contenteditable="canWrite ? 'true' : 'false'"
 			spellcheck="false"
-			ref="taskTitle">{{ task.title.trim() }}</h1>
+			ref="taskTitle"
+		>
+			{{ task.title.trim() }}
+		</h1>
 		<transition name="fade">
 			<span class="is-inline-flex is-align-items-center" v-if="loading && saving">
 				<span class="loader is-inline-block mr-2"></span>
 				{{ $t('misc.saving') }}
 			</span>
-			<span class="has-text-success is-inline-flex is-align-content-center" v-if="!loading && showSavedMessage">
+			<span class="has-text-success is-inline-flex is-align-content-center" v-else-if="!loading && showSavedMessage">
 				<icon icon="check" class="mr-2"/>
 				{{ $t('misc.saved') }}
 			</span>
@@ -41,6 +42,9 @@ export default {
 		task() {
 			return this.value
 		},
+		textIdentifier() {
+			return this.task?.getTextIdentifier() || ''
+		},
 	},
 	props: {
 		value: {

src/components/tasks/partials/relatedTasks.vue

@@ -19,7 +19,7 @@
 							<span class="loader is-inline-block mr-2"></span>
 							{{ $t('misc.saving') }}
 						</span>
-						<span class="has-text-success" v-if="!taskRelationService.loading && saved">
+						<span class="has-text-success" v-else-if="!taskRelationService.loading && saved">
 							{{ $t('misc.saved') }}
 						</span>
 					</transition>

src/store/modules/kanban.js

@@ -6,7 +6,7 @@ import {filterObject} from '@/helpers/filterObject'
 import {setLoading} from '../helper'
 import TaskCollectionService from '@/services/taskCollection'
 
-const tasksPerBucket = 25
+const TASKS_PER_BUCKET = 25
 
 const addTaskToBucketAndSort = (state, task) => {
 	const bi = filterObject(state.buckets, b => b.id === task.bucketId)
@@ -174,7 +174,7 @@ export default {
 			// Clear everything to prevent having old buckets in the list if loading the buckets from this list takes a few moments
 			ctx.commit('setBuckets', [])
 
-			params.per_page = tasksPerBucket
+			params.per_page = TASKS_PER_BUCKET
 
 			const bucketService = new BucketService()
 			return bucketService.getAll({listId: listId}, params)
@@ -228,7 +228,7 @@ export default {
 				params.filter_comparator = [...(params.filter_comparator ?? []), 'equals']
 			}
 
-			params.per_page = tasksPerBucket
+			params.per_page = TASKS_PER_BUCKET
 
 			const taskService = new TaskCollectionService()
 			return taskService.getAll({listId: listId}, params, page)

src/views/labels/ListLabels.vue

@@ -132,7 +132,8 @@ export default {
 	},
 	computed: mapState({
 		userInfo: state => state.auth.info,
-		labels: state => Object.values(state.labels.labels).sort((f, s) => f.title > s.title ? 1 : -1), // Alphabetically sort the labels
+		// Alphabetically sort the labels
+		labels: state => Object.values(state.labels.labels).sort((f, s) => f.title > s.title ? 1 : -1),
 		loading: state => state[LOADING] && state[LOADING_MODULE] === 'labels',
 	}),
 	methods: {
@@ -167,10 +168,7 @@ export default {
 			// Duplicating the label to make sure it does not look like changes take effect immediatly as the label 
 			// object passed to this function here still has a reference to the store.
 			this.labelEditLabel = new LabelModel({
-				id: label.id,
-				title: label.title,
-				description: label.description,
-				hexColor: label.hexColor,
+				...label,
 			})
 			this.isLabelEdit = true
 

src/views/list/views/Kanban.vue

@@ -20,11 +20,11 @@
 			:class="{ 'is-loading': loading && !oneTaskUpdating}"
 			class="kanban kanban-bucket-container loader-container">
 			<draggable
+				v-bind="dragOptions"
 				v-model="buckets"
 				@start="() => dragBucket = true"
 				@end="updateBucketPosition"
 				group="buckets"
-				v-bind="dragOptions"
 				:disabled="!canWrite"
 				:class="{'dragging-disabled': !canWrite}"
 			>
@@ -129,11 +129,11 @@
 						</div>
 						<div :ref="`tasks-container${bucket.id}`" class="tasks">
 							<draggable
+								v-bind="dragOptions"
 								v-model="bucket.tasks"
 								@start="() => dragstart(bucket)"
 								@end="updateTaskPosition"
 								:group="{name: 'tasks', put: shouldAcceptDrop(bucket) && !dragBucket}"
-								v-bind="dragOptions"
 								:disabled="!canWrite"
 								:class="{'dragging-disabled': !canWrite}"
 								:data-bucket-index="k"

src/views/list/views/List.vue

@@ -81,11 +81,11 @@
 					v-if="tasks && tasks.length > 0"
 				>
 					<draggable
+						v-bind="dragOptions"
 						v-model="tasks"
 						group="tasks"
 						@start="() => drag = true"
 						@end="saveTaskPosition"
-						v-bind="dragOptions"
 						handle=".handle"
 						:disabled="!canWrite"
 						:class="{'dragging-disabled': !canWrite}"

src/views/teams/ListTeams.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="content loader-container is-max-width-desktop" v-bind:class="{ 'is-loading': teamService.loading}">
+	<div class="content loader-container is-max-width-desktop" :class="{ 'is-loading': teamService.loading}">
 		<x-button
 			:to="{name:'teams.create'}"
 			class="is-pulled-right"

src/views/user/Settings.vue

@@ -379,6 +379,8 @@ export default {
 		}),
 	},
 	methods: {
+		copy,
+
 		updatePassword() {
 			if (this.passwordConfirm !== this.passwordUpdate.newPassword) {
 				this.error({message: this.$t('user.settings.passwordsDontMatch')})
@@ -462,9 +464,6 @@ export default {
 				})
 				.catch(e => this.error(e))
 		},
-		copy(text) {
-			copy(text)
-		},
 		anchorHashCheck() {
 			if (window.location.hash === this.$route.hash) {
 				const el = document.getElementById(this.$route.hash.slice(1))