feat: allow selecting multiple labels at once

package.json

@@ -10,7 +10,6 @@
     "build:modern-only": "BUILD_MODERN_ONLY=true vite build && workbox copyLibraries dist/",
     "build:dev": "vite build -m development --outDir dist-dev/",
     "lint": "eslint --ignore-pattern '*.test.*' ./src --ext .vue,.js,.ts",
-    "lint:markup": "vue-tsc --noEmit",
     "cypress:open": "cypress open",
     "test:unit": "jest",
     "test:frontend": "cypress run",
@@ -18,8 +17,8 @@
   },
   "dependencies": {
     "@kyvg/vue3-notification": "2.3.4",
-    "@sentry/tracing": "6.14.1",
-    "@sentry/vue": "6.14.1",
+    "@sentry/tracing": "6.14.0",
+    "@sentry/vue": "6.14.0",
     "@vue/compat": "3.2.21",
     "bulma": "0.9.3",
     "camel-case": "4.1.2",
@@ -54,8 +53,8 @@
     "@fortawesome/free-solid-svg-icons": "5.15.4",
     "@fortawesome/vue-fontawesome": "3.0.0-5",
     "@types/jest": "27.0.2",
-    "@typescript-eslint/eslint-plugin": "5.3.1",
-    "@typescript-eslint/parser": "5.3.1",
+    "@typescript-eslint/eslint-plugin": "5.3.0",
+    "@typescript-eslint/parser": "5.3.0",
     "@vitejs/plugin-legacy": "1.6.2",
     "@vitejs/plugin-vue": "1.9.4",
     "@vue/eslint-config-typescript": "9.0.1",
@@ -65,7 +64,7 @@
     "cypress": "8.7.0",
     "cypress-file-upload": "5.0.8",
     "esbuild": "0.13.12",
-    "eslint": "8.2.0",
+    "eslint": "8.1.0",
     "eslint-plugin-vue": "8.0.3",
     "express": "4.17.1",
     "faker": "5.5.3",
@@ -78,7 +77,6 @@
     "typescript": "4.4.4",
     "vite": "2.6.13",
     "vite-plugin-pwa": "0.11.3",
-    "vue-tsc": "0.29.2",
     "wait-on": "6.0.0",
     "workbox-cli": "6.3.0"
   },

src/components/input/multiselect.vue

@@ -7,7 +7,9 @@
 		@focus="focus"
 	>
 		<div class="control" :class="{'is-loading': loading || localLoading}">
-			<div class="input-wrapper input" :class="{'has-multiple': multiple && Array.isArray(internalValue) && internalValue.length > 0}">
+			<div
+				class="input-wrapper input"
+				:class="{'has-multiple': multiple && Array.isArray(internalValue) && internalValue.length > 0}">
 				<template v-if="Array.isArray(internalValue)">
 					<template v-for="(item, key) in internalValue">
 						<slot name="tag" :item="item">
@@ -81,7 +83,7 @@
 </template>
 
 <script>
-import { i18n } from '@/i18n'
+import {i18n} from '@/i18n'
 import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
 
 export default {
@@ -180,8 +182,14 @@ export default {
 				return 200
 			},
 		},
+		closeAfterSelect: {
+			type: Boolean,
+			default() {
+				return true
+			},
+		},
 	},
-	
+
 	/**
 	 * Available events:
 	 *   @search: Triggered every time the search query input changes
@@ -285,7 +293,9 @@ export default {
 			this.$emit('update:modelValue', this.internalValue)
 			this.$emit('select', object)
 			this.setSelectedObject(object)
-			this.closeSearchResults()
+			if (this.closeAfterSelect && this.filteredSearchResults.length > 0 && !this.creatableAvailable) {
+				this.closeSearchResults()
+			}
 		},
 		setSelectedObject(object, resetOnly = false) {
 			this.internalValue = object

src/components/tasks/partials/editLabels.vue

@@ -12,6 +12,7 @@
 		:create-placeholder="$t('task.label.createPlaceholder')"
 		v-model="labels"
 		:search-delay="10"
+		:close-after-select="false"
 	>
 		<template #tag="props">
 			<span
@@ -148,9 +149,3 @@ export default {
 	},
 }
 </script>
-
-<style lang="scss" scoped>
-.tag {
-	margin: .5rem 0 0 .5rem;
-}
-</style>

src/i18n/lang/vi-VN.json

@@ -234,7 +234,7 @@
     "list": {
       "title": "Danh sách",
       "add": "Thêm",
-      "addPlaceholder": "Thêm việc cần làm…",
+      "addPlaceholder": "Thêm một công việc mới…",
       "empty": "Danh sách này đang trống trơn.",
       "newTaskCta": "Thêm một công việc mới.",
       "editTask": "Chỉnh sửa Công việc"
@@ -459,7 +459,7 @@
       "nextMonday": "Thứ Hai tới",
       "thisWeekend": "Cuối tuần này",
       "laterThisWeek": "Cuối tuần này",
-      "nextWeek": "Tuần tới",
+      "nextWeek": "Tuần kế tiếp",
       "chooseDate": "Chọn một ngày"
     },
     "editor": {
@@ -509,8 +509,8 @@
       "from": "Công việc từ",
       "until": "cho đến",
       "today": "Hôm nay",
-      "nextWeek": "Tuần tới",
-      "nextMonth": "Tháng tới",
+      "nextWeek": "Tuần kế tiếp",
+      "nextMonth": "Tháng kế tiếp",
       "noTasks": "Hôm nay thảnh thơi — Hãy tận hưởng ngày tuyệt vời!"
     },
     "detail": {

src/store/modules/tasks.js

@@ -223,12 +223,13 @@ export default {
 
 			const labelAddsToWaitFor = parsedLabels.map(async labelTitle => {
 				let label = validateLabel(labels, labelTitle)
-				if (typeof label === 'undefined') {
-					// label not found, create it
-					const labelModel = new LabelModel({title: labelTitle})
-					label = await dispatch('labels/createLabel', labelModel, {root: true})
+				if (typeof label !== 'undefined') {
+					return label
 				}
 
+				// label not found, create it
+				const labelModel = new LabelModel({title: labelTitle})
+				await dispatch('labels/createLabel', labelModel, {root: true})
 				return addLabelToTask(task, label)
 			})
 

src/styles/theme/notification.scss

@@ -5,6 +5,14 @@
 .notifications {
   left: 0.5rem !important;
   bottom: 1rem !important;
+
+  .notification-wrapper .notification {
+    border-radius: 0;
+    border-top-width: 0;
+    border-right-width: 0;
+    border-bottom-width: 0;
+    border-left-width: 0.4rem;
+  }
 }
 
 .message .message-body {