feat: use new async component definition

- fix see: https://v3.vuejs.org/guide/migration/async-components.html
- put async editor in separate component

src/views/filters/CreateSavedFilter.vue

@@ -60,8 +60,8 @@
 </template>
 
 <script>
-import LoadingComponent from '@/components/misc/loading.vue'
-import ErrorComponent from '@/components/misc/error.vue'
+import AsyncEditor from '@/components/input/AsyncEditor'
+
 import Filters from '@/components/list/partials/filters.vue'
 import SavedFilterService from '@/services/savedFilter'
 import SavedFilterModel from '@/models/savedFilter'
@@ -86,12 +86,7 @@ export default {
 	},
 	components: {
 		Filters,
-		editor: () => ({
-			component: import('../../components/input/editor'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	created() {
 		this.editorActive = false

src/views/filters/settings/edit.vue

@@ -52,8 +52,8 @@
 </template>
 
 <script>
-import ErrorComponent from '@/components/misc/error.vue'
-import LoadingComponent from '@/components/misc/loading.vue'
+import AsyncEditor from '@/components/input/AsyncEditor'
+
 import CreateEdit from '@/components/misc/create-edit.vue'
 
 import SavedFilterModel from '@/models/savedFilter'
@@ -84,12 +84,7 @@ export default {
 	components: {
 		CreateEdit,
 		Filters,
-		editor: () => ({
-			component: import('@/components/input/editor.vue'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	watch: {
 		// call again the method if the route changes

src/views/labels/ListLabels.vue

@@ -100,21 +100,16 @@
 import {mapState} from 'vuex'
 
 import LabelModel from '../../models/label'
-import ColorPicker from '../../components/input/colorPicker'
-import LoadingComponent from '../../components/misc/loading'
-import ErrorComponent from '../../components/misc/error'
 import {LOADING, LOADING_MODULE} from '@/store/mutation-types'
 
+import AsyncEditor from '@/components/input/AsyncEditor'
+import ColorPicker from '@/components/input/colorPicker'
+
 export default {
 	name: 'ListLabels',
 	components: {
 		ColorPicker,
-		editor: () => ({
-			component: import('../../components/input/editor'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	data() {
 		return {

src/views/list/settings/edit.vue

@@ -66,11 +66,11 @@
 </template>
 
 <script>
+import AsyncEditor from '@/components/input/AsyncEditor'
+
 import ListModel from '@/models/list'
 import ListService from '@/services/list'
 import ColorPicker from '@/components/input/colorPicker.vue'
-import LoadingComponent from '@/components/misc/loading.vue'
-import ErrorComponent from '@/components/misc/error.vue'
 import ListDuplicateService from '@/services/listDuplicateService'
 import {CURRENT_LIST} from '@/store/mutation-types'
 import CreateEdit from '@/components/misc/create-edit.vue'
@@ -87,12 +87,7 @@ export default {
 	components: {
 		CreateEdit,
 		ColorPicker,
-		editor: () => ({
-			component: import('@/components/input/editor.vue'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	watch: {
 		'$route.params.listId': {

src/views/namespaces/settings/edit.vue

@@ -57,12 +57,12 @@
 </template>
 
 <script>
+import AsyncEditor from '@/components/input/AsyncEditor'
+
 import NamespaceService from '@/services/namespace'
 import NamespaceModel from '@/models/namespace'
 import Fancycheckbox from '@/components/input/fancycheckbox.vue'
 import ColorPicker from '@/components/input/colorPicker.vue'
-import LoadingComponent from '@/components/misc/loading.vue'
-import ErrorComponent from '@/components/misc/error.vue'
 import CreateEdit from '@/components/misc/create-edit.vue'
 
 export default {
@@ -79,12 +79,7 @@ export default {
 		CreateEdit,
 		ColorPicker,
 		Fancycheckbox,
-		editor: () => ({
-			component: import('@/components/input/editor.vue'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	beforeMount() {
 		this.namespace.id = this.$route.params.id

src/views/teams/EditTeam.vue

@@ -161,6 +161,7 @@
 </template>
 
 <script>
+import AsyncEditor from '@/components/input/AsyncEditor'
 import {mapState} from 'vuex'
 
 import TeamService from '../../services/team'
@@ -171,9 +172,6 @@ import UserModel from '../../models/user'
 import UserService from '../../services/user'
 import Rights from '../../models/constants/rights.json'
 
-import LoadingComponent from '../../components/misc/loading'
-import ErrorComponent from '../../components/misc/error'
-
 import Multiselect from '@/components/input/multiselect.vue'
 
 export default {
@@ -199,12 +197,7 @@ export default {
 	},
 	components: {
 		Multiselect,
-		editor: () => ({
-			component: import('../../components/input/editor'),
-			loading: LoadingComponent,
-			error: ErrorComponent,
-			timeout: 60000,
-		}),
+		editor: AsyncEditor,
 	},
 	watch: {
 		// call again the method if the route changes