Merge pull request #2362 from nextcloud/fix/noid/store-router

fix: do not use the router in the store

src/components/HeaderBar.vue

@@ -50,6 +50,7 @@ License along with this library. If not, see <http://www.gnu.org/licenses/>.
 
 <script>
 import SortorderDropdown from './SortorderDropdown.vue'
+import openNewTask from '../mixins/openNewTask.js'
 
 import { translate as t } from '@nextcloud/l10n'
 import moment from '@nextcloud/moment'
@@ -69,6 +70,7 @@ export default {
 		SortorderDropdown,
 		Plus,
 	},
+	mixins: [openNewTask],
 	data() {
 		return {
 			newTaskName: '',
@@ -106,17 +108,17 @@ export default {
 			this.newTaskName = ''
 		},
 
-		addTaskWithName(task) {
-			// If the task is created in the calendar view,
-			// we set the current calendar
-			if (this.$route.params.calendarId) {
-				task.calendar = this.calendar
-			}
-
-			return this.createTask({
-				...task,
+		async addTask() {
+			const data = {
+				summary: this.newTaskName,
+				// If the task is created in the calendar view,
+				// we set the current calendar
+				...(this.$route.params.calendarId && { calendar: this.calendar }),
 				...this.getAdditionalTaskProperties(),
-			})
+			}
+			const task = await this.createTask(data)
+			this.openNewTask(task)
+			this.newTaskName = ''
 		},
 
 		getAdditionalTaskProperties() {
@@ -150,11 +152,6 @@ export default {
 			this.additionalTaskProperties = this.getAdditionalTaskProperties()
 		},
 
-		addTask() {
-			this.addTaskWithName({ summary: this.newTaskName })
-			this.newTaskName = ''
-		},
-
 		async createMultipleTasksCancelled() {
 			this.showCreateMultipleTasksModal = false
 			this.multipleTasks = { numberOfTasks: 0, tasks: {} }

src/components/TaskBody.vue

@@ -183,6 +183,7 @@ import TaskCheckbox from './TaskCheckbox.vue'
 import TaskStatusDisplay from './TaskStatusDisplay.vue'
 import TaskDragContainer from './TaskDragContainer.vue'
 import Task from '../models/task.js'
+import openNewTask from '../mixins/openNewTask.js'
 
 import { emit } from '@nextcloud/event-bus'
 import { translate as t, translatePlural as n } from '@nextcloud/l10n'
@@ -234,6 +235,7 @@ export default {
 		Star,
 		Undo,
 	},
+	mixins: [openNewTask],
 	props: {
 		task: {
 			type: Object,
@@ -647,14 +649,16 @@ export default {
 			this.openSubtaskInput()
 		},
 
-		addTask($event) {
+		async addTask($event) {
 			$event?.stopPropagation()
-			const task = { summary: this.newTaskName, calendar: this.task.calendar, related: this.task.uid }
 
-			this.createTask({
-				...task,
+			const task = await this.createTask({
+				summary: this.newTaskName,
+				calendar: this.task.calendar,
+				related: this.task.uid,
 				...this.getAdditionalTaskProperties(),
 			})
+			this.openNewTask(task)
 			this.newTaskName = ''
 			// Focus the input field again, in case we clicked on the trailing-icon-button
 			this.$refs.input.$refs.inputField.$refs.input.focus()

src/mixins/openNewTask.js

@@ -0,0 +1,46 @@
+/**
+ * Nextcloud - Tasks
+ *
+ * @author Raimund Schlüßler
+ *
+ * @copyright 2023 Raimund Schlüßler <[email protected]>
+ *
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public
+ * License along with this library. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+export default {
+	methods: {
+		openNewTask(task) {
+			// Only open the details view if there is enough space or if it is already open.
+			if (this.$route !== undefined && (document.documentElement.clientWidth >= 768 || this.$route?.params.taskId !== undefined)) {
+				// Open the details view for the new task
+				const calendarId = this.$route.params.calendarId
+				const collectionId = this.$route.params.collectionId
+				if (calendarId) {
+					this.$router.push({ name: 'calendarsTask', params: { calendarId, taskId: task.uri } })
+				} else if (collectionId) {
+					if (collectionId === 'week') {
+						this.$router.push({
+							name: 'collectionsParamTask',
+							params: { collectionId, taskId: task.uri, collectionParam: '0' },
+						})
+					} else {
+						this.$router.push({ name: 'collectionsTask', params: { collectionId, taskId: task.uri } })
+					}
+				}
+			}
+		},
+	},
+}

src/store/calendars.js

@@ -37,7 +37,6 @@ import client from '../services/cdav.js'
 import Task from '../models/task.js'
 import { isParentInList, searchSubTasks } from './storeHelper.js'
 import { findVTODObyState } from './cdav-requests.js'
-import router from '../router.js'
 import { detectColor, uidToHexColor } from '../utils/color.js'
 import { mapCDavObjectToCalendarObject } from '../models/calendarObject.js'
 
@@ -676,15 +675,13 @@ const actions = {
 	 * @param {Calendar} calendar The calendar to append
 	 * @return {Promise}
 	 */
-	async appendCalendar(context, calendar) {
-		return client.calendarHomes[0].createCalendarCollection(calendar.displayName, calendar.color, ['VTODO'])
-			.then((response) => {
-				calendar = Calendar(response, context.getters.getCurrentUserPrincipal)
-				context.commit('addCalendar', calendar)
-				// Open the calendar
-				router.push({ name: 'calendars', params: { calendarId: calendar.id } })
-			})
-			.catch((error) => { throw error })
+	async appendCalendar(context, { displayName, color }) {
+		const response = await client.calendarHomes[0].createCalendarCollection(displayName, color, ['VTODO'])
+		if (response) {
+			const calendar = Calendar(response, context.getters.getCurrentUserPrincipal)
+			context.commit('addCalendar', calendar)
+			return calendar
+		}
 	},
 
 	/**

src/store/tasks.js

@@ -26,7 +26,6 @@ import { findVTODObyUid } from './cdav-requests.js'
 import { isParentInList, momentToICALTime } from './storeHelper.js'
 import SyncStatus from '../models/syncStatus.js'
 import Task from '../models/task.js'
-import router from '../router.js'
 
 import { showError } from '@nextcloud/dialogs'
 import { emit } from '@nextcloud/event-bus'
@@ -65,6 +64,7 @@ const getters = {
 			if (calendar) {
 				return Object.values(calendar.tasks)
 			}
+			return []
 		},
 
 	/**
@@ -758,25 +758,6 @@ const actions = {
 			const parent = context.getters.getTaskByUid(task.related)
 			context.commit('addTaskToParent', { task, parent })
 
-			// In case the task is created in Talk, we don't have a route
-			// Only open the details view if there is enough space or if it is already open.
-			if (context.rootState.route !== undefined && (document.documentElement.clientWidth >= 768 || context.rootState.route?.params.taskId !== undefined)) {
-				// Open the details view for the new task
-				const calendarId = context.rootState.route.params.calendarId
-				const collectionId = context.rootState.route.params.collectionId
-				if (calendarId) {
-					router.push({ name: 'calendarsTask', params: { calendarId, taskId: task.uri } })
-				} else if (collectionId) {
-					if (collectionId === 'week') {
-						router.push({
-							name: 'collectionsParamTask',
-							params: { collectionId, taskId: task.uri, collectionParam: '0' },
-						})
-					} else {
-						router.push({ name: 'collectionsTask', params: { collectionId, taskId: task.uri } })
-					}
-				}
-			}
 			return task
 		}
 	},

src/views/AppNavigation.vue

@@ -387,11 +387,14 @@ export default {
 			)
 			e.stopPropagation()
 		},
-		create() {
+		async create() {
 			if (!this.isNameAllowed(this.newCalendarName).allowed) {
 				return
 			}
-			this.appendCalendar({ displayName: this.newCalendarName, color: this.selectedColor })
+			const { id: calendarId } = await this.appendCalendar({ displayName: this.newCalendarName, color: this.selectedColor })
+			if (calendarId) {
+				await this.$router.push({ name: 'calendars', params: { calendarId } })
+			}
 			this.creating = false
 		},
 		checkName(event) {