Use object spread operator

.babelrc.js

@@ -1,5 +1,8 @@
 module.exports = {
-	plugins: ['@babel/plugin-syntax-dynamic-import'],
+	plugins: [
+		'@babel/plugin-syntax-dynamic-import',
+		'@babel/plugin-proposal-object-rest-spread'
+	],
 	presets: [
 		[
 			'@babel/preset-env',

package.json

@@ -42,6 +42,7 @@
 	},
 	"devDependencies": {
 		"@babel/core": "^7.2.0",
+		"@babel/plugin-proposal-object-rest-spread": "^7.2.0",
 		"@babel/plugin-syntax-dynamic-import": "^7.2.0",
 		"@babel/preset-env": "^7.2.0",
 		"@vue/test-utils": "^1.0.0-beta.27",

src/app.vue

@@ -50,11 +50,11 @@ export default {
 		'TheSettings': TheSettings,
 		'TheList': TheList
 	},
-	computed: Object.assign({},
-		mapState({
+	computed: {
+		...mapState({
 			calendars: state => state.calendars.calendars
 		})
-	),
+	},
 	beforeMount() {
 		// get calendars then get tasks
 		client.connect({ enableCalDAV: true }).then(() => {

src/components/SortorderDropdown.vue

@@ -95,7 +95,7 @@ export default {
 			]
 		}
 	},
-	computed: Object.assign({
+	computed: {
 		sortOrder: {
 			get() {
 				return this.$store.state.settings.settings.sortOrder
@@ -133,7 +133,7 @@ export default {
 			}
 			return 'icon-' + icon
 		}
-	}),
+	},
 	methods: {
 		closeMenu() {
 			this.menuOpen = false

src/components/Task.vue

@@ -202,46 +202,44 @@ export default {
 			return t('tasks', 'Add a subtask to "{task}"...', {	task: this.task.summary })
 		}
 	},
-	methods: Object.assign(
-		mapActions([
+	methods: {
+		...mapActions([
 			'toggleCompleted',
 			'toggleStarred'
 		]),
-		{
-			/**
-			 * Checks if a date is overdue
-			 */
-			overdue: overdue,
+		/**
+		 * Checks if a date is overdue
+		 */
+		overdue: overdue,
 
-			/**
-			 * Navigates to a different route, but checks if navigation is desired
-			 *
-			 * @param {Object} $event the event that triggered navigation
-			 * @param {String} route the route to navigate to
-			 */
-			navigate: function($event) {
-				if (!$event.target.classList.contains('no-nav')) {
-					this.$router.push(this.taskRoute)
-				}
-			},
-
-			cancelCreation: function(e) {
-				// don't cancel the task creation if the own add-subtask button is clicked
-				if (e.target.getAttribute('taskId') !== this.task.uri) {
-					this.showSubtaskInput = false
-				}
-			},
-
-			toggleSubtasks: function(task) {
-			},
-
-			toggleCompletedSubtasks: function(task) {
-			},
-
-			addTask: function() {
-				this.newTaskName = ''
+		/**
+		 * Navigates to a different route, but checks if navigation is desired
+		 *
+		 * @param {Object} $event the event that triggered navigation
+		 * @param {String} route the route to navigate to
+		 */
+		navigate: function($event) {
+			if (!$event.target.classList.contains('no-nav')) {
+				this.$router.push(this.taskRoute)
 			}
+		},
+
+		cancelCreation: function(e) {
+			// don't cancel the task creation if the own add-subtask button is clicked
+			if (e.target.getAttribute('taskId') !== this.task.uri) {
+				this.showSubtaskInput = false
+			}
+		},
+
+		toggleSubtasks: function(task) {
+		},
+
+		toggleCompletedSubtasks: function(task) {
+		},
+
+		addTask: function() {
+			this.newTaskName = ''
 		}
-	)
+	}
 }
 </script>

src/components/TheCollections/Calendar.vue

@@ -98,7 +98,7 @@ export default {
 			isAddingTask: false
 		}
 	},
-	computed: Object.assign({
+	computed: {
 		showHidden: {
 			get() {
 				return this.$store.state.settings.settings.showHidden
@@ -119,14 +119,14 @@ export default {
 		 */
 		completedCountString: function() {
 			return n('tasks', '%n Completed Task', '%n Completed Tasks', this.completedCount(this.calendarId))
-		} },
-	mapGetters({
-		completedCount: 'getCalendarCountCompleted',
-		calendar: 'getCalendarByRoute',
-		uncompletedRootTasks: 'findUncompletedRootTasks',
-		completedRootTasks: 'findCompletedRootTasks'
-	})
-	),
+		},
+		...mapGetters({
+			completedCount: 'getCalendarCountCompleted',
+			calendar: 'getCalendarByRoute',
+			uncompletedRootTasks: 'findUncompletedRootTasks',
+			completedRootTasks: 'findCompletedRootTasks'
+		})
+	},
 	methods: {
 		toggleHidden: function() {
 			this.showHidden = +!this.showHidden

src/components/TheCollections/General.vue

@@ -79,7 +79,7 @@ export default {
 			isAddingTask: false
 		}
 	},
-	computed: Object.assign({
+	computed: {
 
 		/**
 		 * Returns the calendars which are to be shown for the current collection
@@ -107,20 +107,19 @@ export default {
 				return t('tasks', 'Add an important task to "{calendar}"...', { calendar: this.calendar.displayName })
 			case 'today':
 				return t('tasks', 'Add a task due today to "{calendar}"...', { calendar: this.calendar.displayName })
-			case 'all':
-				return t('tasks', 'Add a task to "{calendar}"...', { calendar: this.calendar.displayName })
 			case 'current':
 				return t('tasks', 'Add a current task to "{calendar}"...', { calendar: this.calendar.displayName })
+			default:
+				return t('tasks', 'Add a task to "{calendar}"...', { calendar: this.calendar.displayName })
 			}
-		}
+		},
+		...mapGetters({
+			uncompletedRootTasks: 'findUncompletedRootTasks',
+			calendar: 'getDefaultCalendar',
+			calendars: 'getSortedCalendars',
+			calendarCount: 'getCalendarCountByCollectionId'
+		})
 	},
-	mapGetters({
-		uncompletedRootTasks: 'findUncompletedRootTasks',
-		calendar: 'getDefaultCalendar',
-		calendars: 'getSortedCalendars',
-		calendarCount: 'getCalendarCountByCollectionId'
-	})
-	),
 	methods: {
 		clearNewTask: function(event) {
 			event.target.blur()

src/components/TheCollections/Week.vue

@@ -72,12 +72,12 @@ export default {
 			days: [0, 1, 2, 3, 4, 5, 6]
 		}
 	},
-	computed: Object.assign({},
-		mapGetters({
+	computed: {
+		...mapGetters({
 			tasks: 'getAllTasks',
 			uncompletedRootTasks: 'findUncompletedRootTasks'
 		})
-	),
+	},
 	methods: {
 		dayHasEntry: function(days) {
 			return days

src/components/TheDetails.vue

@@ -422,7 +422,7 @@ export default {
 			categories: []
 		}
 	},
-	computed: Object.assign({
+	computed: {
 		isAllDayPossible: function() {
 			return !this.task.calendar.readOnly && (this.task.due || this.task.start)
 		},
@@ -433,6 +433,8 @@ export default {
 				return 'medium'
 			} else if (this.task.priority > 0 && this.task.priority < 5) {
 				return 'high'
+			} else {
+				return ''
 			}
 		},
 		iconStar: function() {
@@ -461,16 +463,15 @@ export default {
 		},
 		dueDate: function() {
 			return moment(this.task.due, 'YYYYMMDDTHHmmss').toDate()
-		}
+		},
+		...mapState({
+		}),
+		...mapGetters({
+			task: 'getTaskByRoute'
+		})
 	},
-	mapState({
-	}),
-	mapGetters({
-		task: 'getTaskByRoute'
-	})
-	),
-	methods: Object.assign(
-		mapActions([
+	methods: {
+		...mapActions([
 			'deleteTask',
 			'toggleCompleted',
 			'toggleStarred',
@@ -478,99 +479,97 @@ export default {
 			'deleteStartDate',
 			'toggleAllDay'
 		]),
-		{
-			closeDetails: function() {
-				if (this.$route.params.calendarId) {
-					this.$router.push({ path: `/calendars/${this.$route.params.calendarId}` })
-				} else {
-					this.$router.push({ path: `/collections/${this.$route.params.collectionId}` })
-				}
-			},
-
-			dateIcon: function(date) {
-				if (valid(date)) {
-					var c = 'icon-color icon-calendar-due'
-					if (overdue(date)) {
-						c += ' icon-calendar-overdue'
-					}
-					return c
-				} else {
-					return 'icon-bw icon-calendar'
-				}
-			},
-
-			/**
-			 * Checks if a date is overdue
-			 */
-			overdue: overdue,
-
-			/**
-			 * Checks if a date is valid
-			 */
-			valid: valid,
-
-			editProperty: function(type, event) {
-				// don't start to edit the property again
-				// if the confirm button of the datepicker was clicked
-				if (event && event.target.classList.contains('mx-datepicker-btn-confirm')) {
-					return
-				}
-				if (!this.task.calendar.readOnly && this.edit !== type) {
-					this.edit = type
-					this.tmpTask[type] = this.task[type]
-				}
-				if (type === 'summary' || type === 'note') {
-					this.$nextTick(
-						() => document.getElementById(type + 'Input').focus()
-					)
-				}
-			},
-
-			finishEditing: function(type) {
-				if (this.edit === type) {
-					this.setProperty(type, this.tmpTask[type])
-					this.edit = ''
-				}
-			},
-
-			cancelEditing: function(type) {
-				this.edit = ''
-				this.tmpTask[type] = this.task[type]
-			},
-
-			setProperty: function(type, value) {
-				console.debug('Set property "' + type + '" to "' + value)
-				this.edit = ''
-			},
-
-			setPropertyTemporarily: function(type, value) {
-				console.debug('Set property "' + type + '" temporarily to "' + value)
-			},
-
-			setStartDate: function(date) {
-				console.debug('Set start date to ' + date)
-			},
-
-			setStartTime: function(time) {
-				console.debug('Set start time to ' + time)
-			},
-
-			setDueDate: function(date) {
-				console.debug('Set due date to ' + date)
-			},
-
-			setDueTime: function(time) {
-				console.debug('Set due time to ' + time)
-			},
-
-			updateCategories: function(category) {
-				console.debug(category)
-			},
-
-			addCategory: function(category) {
-				console.debug(category)
+		closeDetails: function() {
+			if (this.$route.params.calendarId) {
+				this.$router.push({ path: `/calendars/${this.$route.params.calendarId}` })
+			} else {
+				this.$router.push({ path: `/collections/${this.$route.params.collectionId}` })
 			}
+		},
+
+		dateIcon: function(date) {
+			if (valid(date)) {
+				var c = 'icon-color icon-calendar-due'
+				if (overdue(date)) {
+					c += ' icon-calendar-overdue'
+				}
+				return c
+			} else {
+				return 'icon-bw icon-calendar'
+			}
+		},
+
+		/**
+		 * Checks if a date is overdue
+		 */
+		overdue: overdue,
+
+		/**
+		 * Checks if a date is valid
+		 */
+		valid: valid,
+
+		editProperty: function(type, event) {
+			// don't start to edit the property again
+			// if the confirm button of the datepicker was clicked
+			if (event && event.target.classList.contains('mx-datepicker-btn-confirm')) {
+				return
+			}
+			if (!this.task.calendar.readOnly && this.edit !== type) {
+				this.edit = type
+				this.tmpTask[type] = this.task[type]
+			}
+			if (type === 'summary' || type === 'note') {
+				this.$nextTick(
+					() => document.getElementById(type + 'Input').focus()
+				)
+			}
+		},
+
+		finishEditing: function(type) {
+			if (this.edit === type) {
+				this.setProperty(type, this.tmpTask[type])
+				this.edit = ''
+			}
+		},
+
+		cancelEditing: function(type) {
+			this.edit = ''
+			this.tmpTask[type] = this.task[type]
+		},
+
+		setProperty: function(type, value) {
+			console.debug('Set property "' + type + '" to "' + value)
+			this.edit = ''
+		},
+
+		setPropertyTemporarily: function(type, value) {
+			console.debug('Set property "' + type + '" temporarily to "' + value)
+		},
+
+		setStartDate: function(date) {
+			console.debug('Set start date to ' + date)
+		},
+
+		setStartTime: function(time) {
+			console.debug('Set start time to ' + time)
+		},
+
+		setDueDate: function(date) {
+			console.debug('Set due date to ' + date)
+		},
+
+		setDueTime: function(time) {
+			console.debug('Set due time to ' + time)
+		},
+
+		updateCategories: function(category) {
+			console.debug(category)
+		},
+
+		addCategory: function(category) {
+			console.debug(category)
 		}
-	)
+	}
 }
 </script>

src/components/TheList.vue

@@ -213,160 +213,158 @@ export default {
 			dayOfMonth: moment().date()
 		}
 	},
-	computed: Object.assign({},
-		mapState({
+	computed: {
+		...mapState({
 			collections: state => state.collections.collections
 		}),
-		mapGetters({
+		...mapGetters({
 			calendars: 'getSortedCalendars',
 			collectionCount: 'getCollectionCount',
 			calendarCount: 'getCalendarCount',
 			isCalendarNameUsed: 'isCalendarNameUsed'
 		})
-	),
-	methods: Object.assign(
-		mapActions([
+	},
+	methods: {
+		...mapActions([
 			'changeCalendar',
 			'deleteCalendar',
 			'appendCalendar'
 		]),
-		{
-			hideCollection: function(collection) {
-				switch (collection.show) {
-				case 0:
-					return true
-				case 1:
-					return false
-				case 2:
-					return this.collectionCount(collection.id) < 1
-				}
-			},
-			showTooltip: function(target) {
-				return this.tooltipTarget === target
-			},
-			edit: function(calendar) {
-				this.editing = calendar.id
-				this.newCalendarName = calendar.displayName
-				this.selectedColor = calendar.color
-				this.nameError = false
-				this.tooltipTarget = ''
-				this.$nextTick(
-					() => document.querySelector('#list_' + calendar.id + ' input.edit').focus()
-				)
-			},
-			resetView: function(calendar) {
-				if (this.editing === calendar.id) {
-					this.editing = ''
-				}
-				this.tooltipTarget = ''
-			},
-			copyCalDAVUrl(event, calendar) {
-				// change to loading status
-				event.stopPropagation()
-
-				const url = this.url(calendar)
-
-				// copy link for calendar to clipboard
-				this.$copyText(url)
-					.then(e => {
-						event.preventDefault()
-						this.copySuccess = true
-						this.copied = true
-						// Notify calendar url was copied
-						OC.Notification.showTemporary(t('tasks', 'Calendar link copied to clipboard.'))
-					}, e => {
-						this.copySuccess = false
-						this.copied = true
-						OC.Notification.showTemporary(t('tasks', 'Calendar link could not be copied to clipboard.'))
-					}).then(() => {
-						setTimeout(() => {
-							// stop loading status regardless of outcome
-							this.copied = false
-						}, 2000)
-					})
-			},
-			exportUrl(calendar) {
-				var url = calendar.url
-				// cut off last slash to have a fancy name for the ics
-				if (url.slice(url.length - 1) === '/') {
-					url = url.slice(0, url.length - 1)
-				}
-				url += '?export'
-				return url
-			},
-			url(calendar) {
-				const rootURL = OC.linkToRemote('dav')
-				return new URL(calendar.url, rootURL)
-			},
-			setColor: function(color) {
-				this.selectedColor = color
-			},
-			startCreate: function(e) {
-				if (OCA.Theming) {
-					this.selectedColor = OCA.Theming.color
-				} else {
-					this.selectedColor = '#0082C9'
-				}
-				this.newCalendarName = ''
-				this.creating = true
-				this.$nextTick(
-					() => document.getElementById('newListInput').focus()
-				)
-				e.stopPropagation()
-			},
-			cancelCreate: function() {
-				this.creating = false
-			},
-			create: function() {
-				if (!this.isNameAllowed(this.newCalendarName, 'new').allowed) {
-					return
-				}
-				this.appendCalendar({ displayName: this.newCalendarName, color: this.selectedColor })
-				this.creating = false
-			},
-			save: function(calendar) {
-				if (!this.isNameAllowed(this.newCalendarName, calendar.id).allowed) {
-					return
-				}
-				this.changeCalendar({ calendar: calendar, newName: this.newCalendarName, newColor: this.selectedColor })
-				this.editing = false
-			},
-			checkName: function(event, id) {
-				var check = this.isNameAllowed(this.newCalendarName, id)
-				this.tooltipMessage = check.msg
-				if (!check.allowed) {
-					this.tooltipTarget = 'list_' + id
-					this.nameError = true
-				} else {
-					this.tooltipTarget = ''
-					this.nameError = false
-				}
-				if (event.keyCode === 27) {
-					event.preventDefault()
-					this.tooltipTarget = ''
-					this.creating = false
-					this.editing = false
-					this.nameError = false
-				}
-			},
-			isNameAllowed: function(name, id) {
-				var check = {
-					allowed:	false,
-					msg:	''
-				}
-				if (this.isCalendarNameUsed(name, id)) {
-					check.msg = t('tasks', 'The name "%s" is already used.').replace('%s', name)
-				} else if (!name) {
-					check.msg = t('tasks', 'An empty name is not allowed.')
-				} else {
-					check.allowed = true
-				}
-				return check
-			},
-			deleteMessage: function(name) {
-				return t('tasks', 'This will delete the calendar "%s" and all corresponding events and tasks.').replace('%s', name)
+		hideCollection: function(collection) {
+			switch (collection.show) {
+			case 0:
+				return true
+			case 1:
+				return false
+			case 2:
+				return this.collectionCount(collection.id) < 1
 			}
+		},
+		showTooltip: function(target) {
+			return this.tooltipTarget === target
+		},
+		edit: function(calendar) {
+			this.editing = calendar.id
+			this.newCalendarName = calendar.displayName
+			this.selectedColor = calendar.color
+			this.nameError = false
+			this.tooltipTarget = ''
+			this.$nextTick(
+				() => document.querySelector('#list_' + calendar.id + ' input.edit').focus()
+			)
+		},
+		resetView: function(calendar) {
+			if (this.editing === calendar.id) {
+				this.editing = ''
+			}
+			this.tooltipTarget = ''
+		},
+		copyCalDAVUrl(event, calendar) {
+			// change to loading status
+			event.stopPropagation()
+
+			const url = this.url(calendar)
+
+			// copy link for calendar to clipboard
+			this.$copyText(url)
+				.then(e => {
+					event.preventDefault()
+					this.copySuccess = true
+					this.copied = true
+					// Notify calendar url was copied
+					OC.Notification.showTemporary(t('tasks', 'Calendar link copied to clipboard.'))
+				}, e => {
+					this.copySuccess = false
+					this.copied = true
+					OC.Notification.showTemporary(t('tasks', 'Calendar link could not be copied to clipboard.'))
+				}).then(() => {
+					setTimeout(() => {
+						// stop loading status regardless of outcome
+						this.copied = false
+					}, 2000)
+				})
+		},
+		exportUrl(calendar) {
+			var url = calendar.url
+			// cut off last slash to have a fancy name for the ics
+			if (url.slice(url.length - 1) === '/') {
+				url = url.slice(0, url.length - 1)
+			}
+			url += '?export'
+			return url
+		},
+		url(calendar) {
+			const rootURL = OC.linkToRemote('dav')
+			return new URL(calendar.url, rootURL)
+		},
+		setColor: function(color) {
+			this.selectedColor = color
+		},
+		startCreate: function(e) {
+			if (OCA.Theming) {
+				this.selectedColor = OCA.Theming.color
+			} else {
+				this.selectedColor = '#0082C9'
+			}
+			this.newCalendarName = ''
+			this.creating = true
+			this.$nextTick(
+				() => document.getElementById('newListInput').focus()
+			)
+			e.stopPropagation()
+		},
+		cancelCreate: function() {
+			this.creating = false
+		},
+		create: function() {
+			if (!this.isNameAllowed(this.newCalendarName, 'new').allowed) {
+				return
+			}
+			this.appendCalendar({ displayName: this.newCalendarName, color: this.selectedColor })
+			this.creating = false
+		},
+		save: function(calendar) {
+			if (!this.isNameAllowed(this.newCalendarName, calendar.id).allowed) {
+				return
+			}
+			this.changeCalendar({ calendar: calendar, newName: this.newCalendarName, newColor: this.selectedColor })
+			this.editing = false
+		},
+		checkName: function(event, id) {
+			var check = this.isNameAllowed(this.newCalendarName, id)
+			this.tooltipMessage = check.msg
+			if (!check.allowed) {
+				this.tooltipTarget = 'list_' + id
+				this.nameError = true
+			} else {
+				this.tooltipTarget = ''
+				this.nameError = false
+			}
+			if (event.keyCode === 27) {
+				event.preventDefault()
+				this.tooltipTarget = ''
+				this.creating = false
+				this.editing = false
+				this.nameError = false
+			}
+		},
+		isNameAllowed: function(name, id) {
+			var check = {
+				allowed:	false,
+				msg:	''
+			}
+			if (this.isCalendarNameUsed(name, id)) {
+				check.msg = t('tasks', 'The name "%s" is already used.').replace('%s', name)
+			} else if (!name) {
+				check.msg = t('tasks', 'An empty name is not allowed.')
+			} else {
+				check.allowed = true
+			}
+			return check
+		},
+		deleteMessage: function(name) {
+			return t('tasks', 'This will delete the calendar "%s" and all corresponding events and tasks.').replace('%s', name)
 		}
-	)
+	}
 }
 </script>

src/components/TheSettings.vue

@@ -97,7 +97,7 @@ export default {
 			dayOfMonth: moment().date()
 		}
 	},
-	computed: Object.assign({
+	computed: {
 		defaultCalendarId: {
 			get() {
 				var cal = this.$store.getters.getDefaultCalendar
@@ -106,15 +106,14 @@ export default {
 			set(value) {
 				this.$store.dispatch('setSetting', { type: 'defaultCalendarId', value: value })
 			}
-		}
+		},
+		...mapState({
+			collections: state => state.collections.collections
+		}),
+		...mapGetters({
+			calendars: 'getSortedCalendars'
+		})
 	},
-	mapState({
-		collections: state => state.collections.collections
-	}),
-	mapGetters({
-		calendars: 'getSortedCalendars'
-	})
-	),
 	methods:
 		mapActions([
 			'setVisibility'