Add logo for file migrator

src/helpers/migrator.ts

@@ -0,0 +1,38 @@
+export interface Migrator {
+	name: string
+	identifier: string
+	isFileMigrator?: boolean
+}
+
+export const getMigratorFromSlug = (slug: string): Migrator => {
+	switch (slug) {
+		case 'wunderlist':
+			return {
+				name: 'Wunderlist',
+				identifier: 'wunderlist',
+			}
+		case 'todoist':
+			return {
+				name: 'Todoist',
+				identifier: 'todoist',
+			}
+		case 'trello':
+			return {
+				name: 'Trello',
+				identifier: 'trello',
+			}
+		case 'microsoft-todo':
+			return {
+				name: 'Microsoft Todo',
+				identifier: 'microsoft-todo',
+			}
+		case 'vikunja-file':
+			return {
+				name: 'Vikunja Export',
+				identifier: 'vikunja-file',
+				isFileMigrator: true,
+			}
+		default:
+			throw Error('Unknown migrator slug ' + slug)
+	}
+}

src/views/migrator/Migrate.vue

@@ -3,15 +3,20 @@
 		<h1>{{ $t('migrate.title') }}</h1>
 		<p>{{ $t('migrate.description') }}</p>
 		<div class="migration-services-overview">
-			<router-link :key="m" :to="{name: 'migrate.service', params: {service: m}}" v-for="m in availableMigrators">
-				<img :alt="m" :src="`/images/migration/${m}.png`"/>
-				{{ m }}
+			<router-link
+				:key="m.identifier"
+				:to="{name: 'migrate.service', params: {service: m.identifier}}"
+				v-for="m in availableMigrators">
+				<img :alt="m.name" :src="`/images/migration/${m.identifier}.png`"/>
+				{{ m.name }}
 			</router-link>
 		</div>
 	</div>
 </template>
 
 <script>
+import {getMigratorFromSlug} from '../../helpers/migrator'
+
 export default {
 	name: 'migrate.service',
 	mounted() {
@@ -19,7 +24,7 @@ export default {
 	},
 	computed: {
 		availableMigrators() {
-			return this.$store.state.config.availableMigrators
+			return this.$store.state.config.availableMigrators.map(getMigratorFromSlug)
 		},
 	},
 }

src/views/migrator/MigrateService.vue

@@ -8,7 +8,7 @@
 
 <script>
 import Migration from '../../components/migrator/migration'
-import router from '../../router'
+import {getMigratorFromSlug} from '../../helpers/migrator'
 
 export default {
 	name: 'migrateService',
@@ -26,30 +26,13 @@ export default {
 		this.setTitle(this.$t('migrate.titleService', {name: this.name}))
 	},
 	created() {
-		switch (this.$route.params.service) {
-			case 'wunderlist':
-				this.name = 'Wunderlist'
-				this.identifier = 'wunderlist'
-				break
-			case 'todoist':
-				this.name = 'Todoist'
-				this.identifier = 'todoist'
-				break
-			case 'trello':
-				this.name = 'Trello'
-				this.identifier = 'trello'
-				break
-			case 'microsoft-todo':
-				this.name = 'Microsoft Todo'
-				this.identifier = 'microsoft-todo'
-				break
-			case 'vikunja-file':
-				this.name = 'Vikunja Export'
-				this.identifier = 'vikunja-file'
-				this.isFileMigrator = true
-				break
-			default:
-				router.push({name: '404'})
+		try {
+			const {name, identifier, isFileMigrator} = getMigratorFromSlug(this.$route.params.service)
+			this.name = name
+			this.identifier = identifier
+			this.isFileMigrator = isFileMigrator
+		} catch (e) {
+			this.$router.push({name: '404'})
 		}
 	},
 }