From 991de38980787cb0623ffeb194480748618c8cc8 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Sun, 24 May 2020 15:31:27 +0200
Subject: [PATCH] Add todoist migrator to the frontend

---
 public/images/migration/todoist.png           | Bin 0 -> 3209 bytes
 src/components/migrator/migrate-service.vue   |  39 ++++++++++++++++++
 src/components/migrator/migrate.vue           |   2 +-
 .../{wunderlist.vue => migration.vue}         |  29 ++++++++-----
 src/router/index.js                           |   8 ++--
 src/services/migrator/wunderlist.js           |   7 ----
 src/styles/components/migrator.scss           |   1 +
 7 files changed, 64 insertions(+), 22 deletions(-)
 create mode 100644 public/images/migration/todoist.png
 create mode 100644 src/components/migrator/migrate-service.vue
 rename src/components/migrator/{wunderlist.vue => migration.vue} (76%)
 delete mode 100644 src/services/migrator/wunderlist.js

diff --git a/public/images/migration/todoist.png b/public/images/migration/todoist.png
new file mode 100644
index 0000000000000000000000000000000000000000..c06f9f3460dde41fbb5fe61275010632eae71571
GIT binary patch
literal 3209
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

literal 0
HcmV?d00001

diff --git a/src/components/migrator/migrate-service.vue b/src/components/migrator/migrate-service.vue
new file mode 100644
index 000000000..02902727e
--- /dev/null
+++ b/src/components/migrator/migrate-service.vue
@@ -0,0 +1,39 @@
+<template>
+	<migration
+			:identifier="identifier"
+			:name="name"
+	/>
+</template>
+
+<script>
+	import Migration from './migration'
+	import router from '../../router'
+
+	export default {
+		name: 'migrateService',
+		components: {
+			Migration,
+		},
+		data() {
+			return {
+				name: '',
+				identifier: '',
+			}
+		},
+		created() {
+			switch (this.$route.params.service) {
+				case 'wunderlist':
+					this.name = 'Wunderlist'
+					this.identifier = 'wunderlist'
+					break
+				case 'todoist':
+					this.name = 'Todoist'
+					this.identifier = 'todoist'
+					break
+				default:
+					router.push({name: '404'})
+			}
+		},
+	}
+</script>
+
diff --git a/src/components/migrator/migrate.vue b/src/components/migrator/migrate.vue
index 94a3d1e9d..c24f13d8b 100644
--- a/src/components/migrator/migrate.vue
+++ b/src/components/migrator/migrate.vue
@@ -3,7 +3,7 @@
 		<h1>Import your data from other services to Vikunja</h1>
 		<p>Click on the logo of one of the third-party services below to get started.</p>
 		<div class="migration-services-overview">
-			<router-link :to="{name: 'migrate.'+m}" v-for="m in availableMigrators" :key="m">
+			<router-link :to="{name: 'migrate', params: {service: m}}" v-for="m in availableMigrators" :key="m">
 				<img :src="`/images/migration/${m}.png`" :alt="m"/>
 				{{ m }}
 			</router-link>
diff --git a/src/components/migrator/wunderlist.vue b/src/components/migrator/migration.vue
similarity index 76%
rename from src/components/migrator/wunderlist.vue
rename to src/components/migrator/migration.vue
index e6e0b13ea..fda96cd1a 100644
--- a/src/components/migrator/wunderlist.vue
+++ b/src/components/migrator/migration.vue
@@ -1,14 +1,14 @@
 <template>
 	<div class="content">
-		<h1>Import your data from Wunderlist to Vikunja</h1>
-		<p>Vikunja will import all folders, lists, tasks, notes, reminders and files you have access to.</p>
+		<h1>Import your data from {{ name }} to Vikunja</h1>
+		<p>Vikunja will import all lists, tasks, notes, reminders and files you have access to.</p>
 		<template v-if="isMigrating === false && message === '' && lastMigrationDate === 0">
-			<p>To authorize Vikunja to access your Wunderlist Account, click the button below.</p>
+			<p>To authorize Vikunja to access your {{ name }} Account, click the button below.</p>
 			<a :href="authUrl" class="button is-primary" :class="{'is-loading': migrationService.loading}" :disabled="migrationService.loading">Get Started</a>
 		</template>
 		<div class="migration-in-progress-container" v-else-if="isMigrating === true && message === '' && lastMigrationDate === 0">
 			<div class="migration-in-progress">
-				<img src="/images/migration/wunderlist.png" alt="Wunderlist Logo"/>
+				<img :src="`/images/migration/${identifier}.png`" :alt="name"/>
 				<div class="progress-dots">
 					<span></span>
 					<span></span>
@@ -19,13 +19,13 @@
 					<span></span>
 					<span></span>
 				</div>
-				<img src="/images/logo.svg" alt="Vikunja Logo">
+				<img src="/images/logo.svg" alt="Vikunja">
 			</div>
 			<p>Importing in progress, hang tight...</p>
 		</div>
 		<div v-else-if="lastMigrationDate > 0">
 			<p>
-				It looks like you've already imported your stuff from wunderlist at {{ new Date(lastMigrationDate * 1000) }}.<br/>
+				It looks like you've already imported your stuff from {{ name }} at {{ new Date(lastMigrationDate * 1000) }}.<br/>
 				Importing again is possible, but might create duplicates.
 				Are you sure?
 			</p>
@@ -46,13 +46,12 @@
 </template>
 
 <script>
-	import WunderlistMigrationService from '../../services/migrator/wunderlist'
+	import AbstractMigrationService from "../../services/migrator/abstractMigrationService";
 
 	export default {
-		name: 'wunderlist',
+		name: 'migration',
 		data() {
 			return {
-				migrationService: WunderlistMigrationService,
 				authUrl: '',
 				isMigrating: false,
 				lastMigrationDate: 0,
@@ -60,8 +59,18 @@
 				wunderlistCode: '',
 			}
 		},
+		props: {
+			name: {
+				type: String,
+				required: true,
+			},
+			identifier: {
+				type: String,
+				required: true,
+			},
+		},
 		created() {
-			this.migrationService = new WunderlistMigrationService()
+			this.migrationService = new AbstractMigrationService(this.identifier)
 			this.getAuthUrl()
 			this.message = ''
 
diff --git a/src/router/index.js b/src/router/index.js
index 539a32d99..b6b016b02 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -27,7 +27,7 @@ import NewTeamComponent from '@/components/teams/NewTeam'
 import ListLabelsComponent from '@/components/labels/ListLabels'
 // Migration
 import MigrationComponent from '../components/migrator/migrate'
-import WunderlistMigrationComponent from '../components/migrator/wunderlist'
+import MigrateServiceComponent from '../components/migrator/migrate-service'
 // List Views
 import ShowListComponent from '../components/lists/ShowList'
 import Kanban from '../components/lists/views/Kanban'
@@ -195,9 +195,9 @@ export default new Router({
 			component: MigrationComponent,
 		},
 		{
-			path: '/migrate/wunderlist',
-			name: 'migrate.wunderlist',
-			component: WunderlistMigrationComponent,
+			path: '/migrate/:service',
+			name: 'migrate',
+			component: MigrateServiceComponent,
 		},
 		{
 			path: '/user/settings',
diff --git a/src/services/migrator/wunderlist.js b/src/services/migrator/wunderlist.js
deleted file mode 100644
index 341989ecd..000000000
--- a/src/services/migrator/wunderlist.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import AbstractMigrationService from './abstractMigrationService'
-
-export default class WunderlistMigrationService extends AbstractMigrationService {
-	constructor() {
-		super('wunderlist')
-	}
-}
diff --git a/src/styles/components/migrator.scss b/src/styles/components/migrator.scss
index c80301e5e..3b21390d1 100644
--- a/src/styles/components/migrator.scss
+++ b/src/styles/components/migrator.scss
@@ -5,6 +5,7 @@
     display: inline-block;
     width: 100px;
     text-transform: capitalize;
+    margin-right: 1em;
 
     img {
       display: block;