feat: remove createTask mixin

src/components/quick-actions/quick-actions.vue

@@ -61,7 +61,6 @@ import TeamModel from '@/models/team'
 
 import {CURRENT_LIST, LOADING, LOADING_MODULE, QUICK_ACTIONS_ACTIVE} from '@/store/mutation-types'
 import ListModel from '@/models/list'
-import createTask from '@/components/tasks/mixins/createTask'
 import QuickAddMagic from '@/components/tasks/partials/quick-add-magic.vue'
 import {getHistory} from '../../modules/listHistory'
 
@@ -97,9 +96,6 @@ export default {
 			teamService: new TeamService(),
 		}
 	},
-	mixins: [
-		createTask,
-	],
 	computed: {
 		active() {
 			const active = this.$store.state[QUICK_ACTIONS_ACTIVE]
@@ -387,7 +383,10 @@ export default {
 				return
 			}
 
-			this.createNewTask(this.query, 0, this.currentList.id)
+			this.$store.dispatch('tasks/createNewTask', {
+				title: this.query,
+				listId: this.currentList.id,
+			})
 				.then(r => {
 					this.$message.success({message: this.$t('task.createSuccess')})
 					this.$router.push({name: 'task.detail', params: {id: r.id}})

src/components/tasks/add-task.vue

@@ -38,7 +38,6 @@
 
 <script>
 import TaskService from '../../services/task'
-import createTask from '@/components/tasks/mixins/createTask'
 import QuickAddMagic from '@/components/tasks/partials/quick-add-magic.vue'
 
 const INITIAL_SCROLL_HEIGHT = 40
@@ -58,9 +57,6 @@ export default {
 			textAreaHeight: INITIAL_SCROLL_HEIGHT,
 		}
 	},
-	mixins: [
-		createTask,
-	],
 	components: {
 		QuickAddMagic,
 	},
@@ -100,7 +96,11 @@ export default {
 				}
 				
 				newTasks.push(
-					this.createNewTask(title, 0, this.$store.state.auth.settings.defaultListId, this.defaultPosition)
+					this.$store.dispatch('tasks/createNewTask', {
+						title: this.newTaskTitle,
+						listId: this.$store.state.auth.settings.defaultListId,
+						position: this.defaultPosition,
+					})
 						.then(task => {
 							this.$emit('taskAdded', task)
 							return task

src/components/tasks/mixins/createTask.js

@@ -1,141 +0,0 @@
-import {parseTaskText} from '@/modules/parseTaskText'
-import TaskModel from '@/models/task'
-import {formatISO} from 'date-fns'
-import LabelTask from '@/models/labelTask'
-import LabelModel from '@/models/label'
-import LabelTaskService from '@/services/labelTask'
-import {mapState} from 'vuex'
-import UserService from '@/services/user'
-import TaskService from '@/services/task'
-import {getQuickAddMagicMode} from '@/helpers/quickAddMagicMode'
-
-export default {
-	data() {
-		return {
-			taskService: TaskService,
-			labelTaskService: LabelTaskService,
-			userService: UserService,
-		}
-	},
-	created() {
-		this.labelTaskService = new LabelTaskService()
-		this.userService = new UserService()
-		this.taskService = new TaskService()
-	},
-	computed: mapState({
-		labels: state => state.labels.labels,
-	}),
-	methods: {
-		createNewTask(newTaskTitle, bucketId = 0, lId = 0, position = 0) {
-			const parsedTask = parseTaskText(newTaskTitle, getQuickAddMagicMode())
-			const assignees = []
-
-			// Uses the following ways to get the list id of the new task:
-			//  1. If specified in quick add magic, look in store if it exists and use it if it does
-			//  2. Else check if a list was passed as parameter
-			//  3. Otherwise use the id from the route parameter
-			//  4. If none of the above worked, reject the promise with an error.
-			let listId = null
-			if (parsedTask.list !== null) {
-				const list = this.$store.getters['lists/findListByExactname'](parsedTask.list)
-				listId = list === null ? null : list.id
-			}
-			if (lId !== 0) {
-				listId = lId
-			}
-			if (typeof this.$route.params.listId !== 'undefined') {
-				listId = parseInt(this.$route.params.listId)
-			}
-			
-			if (typeof listId === 'undefined' || listId === null) {
-				return Promise.reject('NO_LIST')
-			}
-
-			// Separate closure because we need to wait for the results of the user search if users were entered in the
-			// task create request. Because _that_ happens in a promise, we'll need something to call when it resolves.
-			const createTask = () => {
-				const task = new TaskModel({
-					title: parsedTask.text,
-					listId: listId,
-					dueDate: parsedTask.date !== null ? formatISO(parsedTask.date) : null, // I don't know why, but it all goes up in flames when I just pass in the date normally.
-					priority: parsedTask.priority,
-					assignees: assignees,
-					bucketId: bucketId,
-					position: position,
-				})
-				return this.taskService.create(task)
-					.then(task => {
-
-						if (parsedTask.labels.length > 0) {
-
-							const labelAddsToWaitFor = []
-
-							const addLabelToTask = label => {
-								const labelTask = new LabelTask({
-									taskId: task.id,
-									labelId: label.id,
-								})
-								return this.labelTaskService.create(labelTask)
-									.then(result => {
-										task.labels.push(label)
-										return Promise.resolve(result)
-									})
-									.catch(e => Promise.reject(e))
-							}
-
-							// Then do everything that is involved in finding, creating and adding the label to the task
-							parsedTask.labels.forEach(labelTitle => {
-								// Check if the label exists
-								const label = Object.values(this.labels).find(l => {
-									return l.title.toLowerCase() === labelTitle.toLowerCase()
-								})
-
-								// Label found, use it
-								if (typeof label !== 'undefined') {
-									labelAddsToWaitFor.push(addLabelToTask(label))
-								} else {
-									// label not found, create it
-									const label = new LabelModel({title: labelTitle})
-									labelAddsToWaitFor.push(this.$store.dispatch('labels/createLabel', label)
-										.then(res => {
-											return addLabelToTask(res)
-										})
-										.catch(e => Promise.reject(e)),
-									)
-								}
-							})
-
-							// This waits until all labels are created and added to the task
-							return Promise.all(labelAddsToWaitFor)
-								.then(() => {
-									return Promise.resolve(task)
-								})
-						}
-
-						return Promise.resolve(task)
-					})
-					.catch(e => Promise.reject(e))
-			}
-
-			if (parsedTask.assignees.length > 0) {
-				const searches = []
-				parsedTask.assignees.forEach(a => {
-					searches.push(this.userService.getAll({}, {s: a})
-						.then(users => {
-							const user = users.find(u => u.username.toLowerCase() === a.toLowerCase())
-							if (typeof user !== 'undefined') {
-								assignees.push(user)
-							}
-							return Promise.resolve(users)
-						}),
-					)
-				})
-
-				return Promise.all(searches)
-					.then(() => createTask())
-			}
-
-			return createTask()
-		},
-	},
-}

src/store/modules/tasks.js

@@ -1,19 +1,77 @@
-import TaskService from '../../services/task'
+import router from '@/router'
-import TaskAssigneeService from '../../services/taskAssignee'
+
+import TaskService from '@/services/task'
+import TaskAssigneeService from '@/services/taskAssignee'
 import TaskAssigneeModel from '../../models/taskAssignee'
 import LabelTaskModel from '../../models/labelTask'
-import LabelTaskService from '../../services/labelTask'
+import LabelTaskService from '@/services/labelTask'
 import {HAS_TASKS} from '../mutation-types'
 import {setLoading} from '../helper'
+import {getQuickAddMagicMode} from '@/helpers/quickAddMagicMode'
+
+import {parseTaskText} from '@/modules/parseTaskText'
+import TaskModel from '@/models/task'
+import {formatISO} from 'date-fns'
+import LabelTask from '@/models/labelTask'
+import LabelModel from '@/models/label'
+import UserService from '@/services/user'
+
+
+// IDEA: maybe use a small fuzzy search here to prevent errors
+function findPropertyByValue(object, key, value) {
+	return Object.values(object).find(
+		(l) => l[key]?.toLowerCase() === value.toLowerCase(),
+	)
+}
+
+// Check if the user exists
+function validateUsername(users, username) {
+	return findPropertyByValue(users, 'username', username)
+}
+
+// Check if the label exists
+function validateLabel(labels, label) {
+	return findPropertyByValue(labels, 'title', label)
+}
+
+function addLabelToTask(task, label) {
+	const labelTask = new LabelTask({
+		taskId: task.id,
+		labelId: label.id,
+	})
+	const labelTaskService = new LabelTaskService()
+	return labelTaskService.create(labelTask)
+		.then(result => {
+			task.labels.push(label)
+			return Promise.resolve(result)
+		})
+		.catch(e => Promise.reject(e))
+}
+
+function findAssignees(parsedTaskAssignees) {
+	if (parsedTaskAssignees.length <= 0) {
+		return Promise.resolve([])
+	}
+
+	const userService = new UserService()
+	const assignees = parsedTaskAssignees.map(a => 
+		userService.getAll({}, {s: a})
+			.then(users => validateUsername(users, a)),
+		
+	)
+
+	return Promise.all(assignees).filter((item) => Boolean(item))
+}
+
 
 export default {
 	namespaced: true,
 	state: () => ({}),
 	actions: {
 		loadTasks(ctx, params) {
-			const cancel = setLoading(ctx, 'tasks')
 			const taskService = new TaskService()
-			
+
+			const cancel = setLoading(ctx, 'tasks')
 			return taskService.getAll({}, params)
 				.then(r => {
 					ctx.commit(HAS_TASKS, r.length > 0, {root: true})
@@ -68,8 +126,8 @@ export default {
 		addAssignee(ctx, {user, taskId}) {
 
 			const taskAssignee = new TaskAssigneeModel({userId: user.id, taskId: taskId})
-			const taskAssigneeService = new TaskAssigneeService()
 
+			const taskAssigneeService = new TaskAssigneeService()
 			return taskAssigneeService.create(taskAssignee)
 				.then(r => {
 					const t = ctx.rootGetters['kanban/getTaskById'](taskId)
@@ -80,6 +138,7 @@ export default {
 						console.debug('Could not add assignee to task in kanban, task not found', t)
 						return Promise.resolve(r)
 					}
+					// FIXME: direct store manipulation (task)
 					t.task.assignees.push(user)
 					ctx.commit('kanban/setTaskInBucketByIndex', t, {root: true})
 					return Promise.resolve(r)
@@ -91,8 +150,8 @@ export default {
 		removeAssignee(ctx, {user, taskId}) {
 
 			const taskAssignee = new TaskAssigneeModel({userId: user.id, taskId: taskId})
-			const taskAssigneeService = new TaskAssigneeService()
 
+			const taskAssigneeService = new TaskAssigneeService()
 			return taskAssigneeService.delete(taskAssignee)
 				.then(r => {
 					const t = ctx.rootGetters['kanban/getTaskById'](taskId)
@@ -106,6 +165,7 @@ export default {
 
 					for (const a in t.task.assignees) {
 						if (t.task.assignees[a].id === user.id) {
+							// FIXME: direct store manipulation (task)
 							t.task.assignees.splice(a, 1)
 							break
 						}
@@ -119,11 +179,11 @@ export default {
 				})
 
 		},
-		addLabel(ctx, {label, taskId}) {
 
-			const labelTaskService = new LabelTaskService()
+		addLabel(ctx, {label, taskId}) {
 			const labelTask = new LabelTaskModel({taskId: taskId, labelId: label.id})
 
+			const labelTaskService = new LabelTaskService()
 			return labelTaskService.create(labelTask)
 				.then(r => {
 					const t = ctx.rootGetters['kanban/getTaskById'](taskId)
@@ -134,6 +194,7 @@ export default {
 						console.debug('Could not add label to task in kanban, task not found', t)
 						return Promise.resolve(r)
 					}
+					// FIXME: direct store manipulation (task)
 					t.task.labels.push(label)
 					ctx.commit('kanban/setTaskInBucketByIndex', t, {root: true})
 
@@ -143,11 +204,11 @@ export default {
 					return Promise.reject(e)
 				})
 		},
-		removeLabel(ctx, {label, taskId}) {
 
-			const labelTaskService = new LabelTaskService()
+		removeLabel(ctx, {label, taskId}) {
 			const labelTask = new LabelTaskModel({taskId: taskId, labelId: label.id})
 
+			const labelTaskService = new LabelTaskService()
 			return labelTaskService.delete(labelTask)
 				.then(r => {
 					const t = ctx.rootGetters['kanban/getTaskById'](taskId)
@@ -162,6 +223,7 @@ export default {
 					// Remove the label from the list
 					for (const l in t.task.labels) {
 						if (t.task.labels[l].id === label.id) {
+							// FIXME: direct store manipulation (task)
 							t.task.labels.splice(l, 1)
 							break
 						}
@@ -175,5 +237,96 @@ export default {
 					return Promise.reject(e)
 				})
 		},
+
+		// Do everything that is involved in finding, creating and adding the label to the task
+		async addLabelsToTask({rootState, dispatch}, { task, parsedLabels }) {
+			if (parsedLabels.length <= 0) {
+				return task
+			}
+
+			const {labels} = rootState.labels
+
+			const labelAddsToWaitFor = parsedLabels.map(labelTitle => new Promise((resolve) => {
+				let label = validateLabel(labels, labelTitle)
+				if (typeof label !== 'undefined') {
+					return resolve(label)
+				}
+
+				// label not found, create it
+				const labelModel = new LabelModel({title: labelTitle})
+				return dispatch('labels/createLabel', labelModel).then(() => resolve(label))
+			})
+				.then((label) => addLabelToTask(task, label))
+				.catch(e => Promise.reject(e)),
+			)
+
+			// This waits until all labels are created and added to the task
+			return Promise.all(labelAddsToWaitFor).then(() => task)
+		},
+
+		findListId({ rootGetters }, { list, listId }) {
+			let foundListId = null
+			
+			// Uses the following ways to get the list id of the new task:
+			//  1. If specified in quick add magic, look in store if it exists and use it if it does
+			if (list !== null) {
+				const list = rootGetters['lists/findListByExactname'](list)
+				foundListId = list === null ? null : list.id
+			}
+			
+			//  2. Else check if a list was passed as parameter
+			if (listId !== 0) {
+				foundListId = listId
+			}
+		
+			//  3. Otherwise use the id from the route parameter
+			if (typeof router.currentRoute.value.params.listId !== 'undefined') {
+				foundListId = parseInt(router.currentRoute.value.params.listId)
+			}
+			
+			//  4. If none of the above worked, reject the promise with an error.
+			if (typeof foundListId === 'undefined' || listId === null) {
+				return Promise.reject('NO_LIST')
+			}
+		
+			return foundListId
+		},
+
+		async createNewTask({dispatch}, { 
+			title,
+			bucketId,
+			listId,
+			position,
+		}) {
+			const parsedTask = parseTaskText(title, getQuickAddMagicMode())
+		
+			const foundListId = await dispatch('findListId', {
+				list: parsedTask.list,
+				listId: listId || 0,
+			})
+		
+			const assignees = await findAssignees(parsedTask.assignees)
+			
+			// I don't know why, but it all goes up in flames when I just pass in the date normally.
+			const dueDate = parsedTask.date !== null ? formatISO(parsedTask.date) : null
+		
+			const task = new TaskModel({
+				title: parsedTask.text,
+				listId: foundListId,
+				dueDate,
+				priority: parsedTask.priority,
+				assignees,
+				bucketId: bucketId || 0,
+				position,
+			})
+		
+			const taskService = new TaskService()
+			return taskService.create(task)
+				.then(task => dispatch('addLabelsToTask', {
+					task,
+					parsedLabels:parsedTask.labels,
+				}))
+				.catch(e => Promise.reject(e))
+		},
 	},
 }

src/views/list/views/Kanban.vue

@@ -242,7 +242,6 @@ import Rights from '../../../models/constants/rights.json'
 import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
 import FilterPopup from '@/components/list/partials/filter-popup.vue'
 import Dropdown from '@/components/misc/dropdown.vue'
-import createTask from '../../../components/tasks/mixins/createTask'
 import {getCollapsedBucketState, saveCollapsedBucketState} from '@/helpers/saveCollapsedBucketState'
 import {calculateItemPosition} from '../../../helpers/calculateItemPosition'
 import KanbanCard from '../../../components/tasks/partials/kanban-card'
@@ -298,9 +297,6 @@ export default {
 			filtersChanged: false, // To trigger a reload of the board
 		}
 	},
-	mixins: [
-		createTask,
-	],
 	created() {
 		this.loadBuckets()
 
@@ -426,7 +422,11 @@ export default {
 			}
 			this.newTaskError[bucketId] = false
 
-			this.createNewTask(this.newTaskText, bucketId)
+			this.$store.dispatch('tasks/createNewTask', {
+				title: this.newTaskText,
+				bucketId,
+				listId: this.$route.params.listId,
+			})
 				.then(r => {
 					this.newTaskText = ''
 					this.$store.commit('kanban/addTaskToBucket', r)

src/views/list/views/List.vue

@@ -150,7 +150,6 @@ import Rights from '../../../models/constants/rights.json'
 import FilterPopup from '@/components/list/partials/filter-popup.vue'
 import {HAS_TASKS} from '@/store/mutation-types'
 import Nothing from '@/components/misc/nothing.vue'
-import createTask from '@/components/tasks/mixins/createTask'
 import Pagination from '@/components/misc/pagination.vue'
 
 import {mapState} from 'vuex'
@@ -194,7 +193,6 @@ export default {
 	},
 	mixins: [
 		taskList,
-		createTask,
 	],
 	components: {
 		Nothing,