fix(migration): put "Import from other services" in settings

Resolves #2347

frontend/src/router/index.ts

@@ -186,6 +186,20 @@ const router = createRouter({
 					name: 'user.settings.apiTokens',
 					component: UserSettingsApiTokensComponent,
 				},
+				{
+					path: '/user/settings/migrate',
+					name: 'migrate.start',
+					component: MigrationComponent,
+				},
+				{
+					path: '/user/settings/migrate/:service',
+					name: 'migrate.service',
+					component: MigrationHandlerComponent,
+					props: route => ({
+						service: route.params.service as string,
+						code: route.query.code as string,
+					}),
+				},
 			],
 		},
 		{
@@ -402,20 +416,6 @@ const router = createRouter({
 				showAsModal: true,
 			},
 		},
-		{
-			path: '/migrate',
-			name: 'migrate.start',
-			component: MigrationComponent,
-		},
-		{
-			path: '/migrate/:service',
-			name: 'migrate.service',
-			component: MigrationHandlerComponent,
-			props: route => ({
-				service: route.params.service as string,
-				code: route.query.code as string,
-			}),
-		},
 		{
 			path: '/filters/new',
 			name: 'filters.create',

frontend/src/views/user/Settings.vue

@@ -9,6 +9,7 @@
 					>
 						<RouterLink
 							class="navigation-link"
+							:class="{'router-link-active': routeName === 'migrate.start' && route.name === 'migrate.service'}"
 							:to="{name: routeName}"
 						>
 							{{ title }}
@@ -29,12 +30,14 @@ import { useI18n } from 'vue-i18n'
 import { useTitle } from '@/composables/useTitle'
 import { useConfigStore } from '@/stores/config'
 import { useAuthStore } from '@/stores/auth'
+import {useRoute} from 'vue-router'
 
 const { t } = useI18n({useScope: 'global'})
 useTitle(() => t('user.settings.title'))
 
 const configStore = useConfigStore()
 const authStore = useAuthStore()
+const route = useRoute()
 
 const totpEnabled = computed(() => configStore.totpEnabled)
 const caldavEnabled = computed(() => configStore.caldavEnabled)