nextcloud migration

frontend/src/api/migration.js

@@ -6,6 +6,11 @@ const migrationBase = baseURL + "migration/";
 
 const migrationURLs = {
   chowdownURL: migrationBase + "chowdown/repo/",
+  nextcloudAvaiable: migrationBase + "nextcloud/available/",
+  nextcloudImport: (selection) =>
+    `${migrationBase}nextcloud/${selection}/import/`,
+  nextcloudDelete: (selection) =>
+    `${migrationBase}nextcloud/${selection}/delete/`,
 };
 
 export default {
@@ -15,4 +20,12 @@ export default {
     store.dispatch("requestRecentRecipes");
     return response.data;
   },
+  async getNextcloudImports() {
+    let response = await apiReq.get(migrationURLs.nextcloudAvaiable);
+    return response.data;
+  },
+  async importNextcloud(selected) {
+    let response = await apiReq.post(migrationURLs.nextcloudImport(selected));
+    return response.data;
+  },
 };

frontend/src/components/Settings/Migration/ChowdownCard.vue

@@ -0,0 +1,73 @@
+<template>
+  <v-card-text>
+    <p>
+      Currently Chowdown via public Repo URL is the only supported type of
+      migration
+    </p>
+    <v-form ref="form">
+      <v-row dense align="center">
+        <v-col cols="12" md="5" sm="5">
+          <v-text-field
+            v-model="repo"
+            label="Chowdown Repo URL"
+            :rules="[rules.required]"
+          >
+          </v-text-field>
+        </v-col>
+        <v-col cols="12" md="4" sm="5">
+          <v-btn text color="info" @click="importRepo"> Migrate </v-btn>
+        </v-col>
+      </v-row>
+    </v-form>
+    <v-alert v-if="failedRecipes[1]" outlined dense type="error">
+      <h4>Failed Recipes</h4>
+      <v-list dense>
+        <v-list-item v-for="fail in this.failedRecipes" :key="fail">
+          {{ fail }}
+        </v-list-item>
+      </v-list>
+    </v-alert>
+    <v-alert v-if="failedImages[1]" outlined dense type="error">
+      <h4>Failed Images</h4>
+      <v-list dense>
+        <v-list-item v-for="fail in this.failedImages" :key="fail">
+          {{ fail }}
+        </v-list-item>
+      </v-list>
+    </v-alert>
+  </v-card-text>
+</template>
+
+<script>
+import api from "../../../api";
+// import SuccessFailureAlert from "../../UI/SuccessFailureAlert";
+// import TimePicker from "./Webhooks/TimePicker";
+export default {
+  data() {
+    return {
+      processRan: false,
+      failedImages: [],
+      failedRecipes: [],
+      repo: "",
+      rules: {
+        required: (v) => !!v || "Selection Required",
+      },
+    };
+  },
+  methods: {
+    async importRepo() {
+      if (this.$refs.form.validate()) {
+        this.$emit("loading");
+        let response = await api.migrations.migrateChowdown(this.repo);
+        this.failedImages = response.failedImages;
+        this.failedRecipes = response.failedRecipes;
+        this.$emit("finished");
+        this.processRan = true;
+      }
+    },
+  },
+};
+</script>
+
+<style>
+</style>

frontend/src/components/Settings/Migration/NextcloudCard.vue

@@ -0,0 +1,69 @@
+<template>
+  <v-card-text>
+    <p>
+      You can import recipes from either a zip file or a directory located in
+      the /app/data/migraiton/ folder. Please review the documentation to ensure
+      your directory structure matches what is expected
+    </p>
+    <v-form ref="form">
+      <v-row align="center">
+        <v-col cols="12" md="5" sm="5">
+          <v-select
+            :items="availableImports"
+            v-model="selectedImport"
+            label="Nextcloud Data"
+            :rules="[rules.required]"
+          ></v-select>
+        </v-col>
+        <v-col cols="12" md="2" sm="2">
+          <v-btn text color="info" @click="importRecipes"> Migrate </v-btn>
+        </v-col>
+      </v-row>
+    </v-form>
+    <SuccessFailureAlert
+      success-header="Successfully Imported from Nextcloud"
+      :success="successfulImports"
+      failed-header="Failed Imports"
+      :failed="failedImports"
+    />
+  </v-card-text>
+</template>
+
+<script>
+import api from "../../../api";
+import SuccessFailureAlert from "../../UI/SuccessFailureAlert";
+export default {
+  components: {
+    SuccessFailureAlert,
+  },
+  data() {
+    return {
+      successfulImports: [],
+      failedImports: [],
+      availableImports: [],
+      selectedImport: null,
+      rules: {
+        required: (v) => !!v || "Selection Required",
+      },
+    };
+  },
+  async mounted() {
+    this.availableImports = await api.migrations.getNextcloudImports();
+  },
+  methods: {
+    async importRecipes() {
+      if (this.$refs.form.validate()) {
+        this.$emit("loading");
+        let data = await api.migrations.importNextcloud(this.selectedImport);
+
+        this.successfulImports = data.successful;
+        this.failedImports = data.failed;
+        this.$emit("finished");
+      }
+    },
+  },
+};
+</script>
+
+<style>
+</style>

frontend/src/components/Settings/Migration/index.vue

@@ -2,64 +2,42 @@
   <v-card :loading="loading">
     <v-card-title class="headline"> Recipe Migration </v-card-title>
     <v-divider></v-divider>
-    <v-card-text>
-      <p>
-        Currently Chowdown via public Repo URL is the only supported type of
-        migration
-      </p>
-      <v-form>
-        <v-row dense align="center">
-          <v-col cols="12" md="5" sm="5">
-            <v-text-field v-model="repo" label="Chowdown Repo URL">
-            </v-text-field>
-          </v-col>
-          <v-col cols="12" md="4" sm="5">
-            <v-btn text color="info" @click="importRepo"> Migrate </v-btn>
-          </v-col>
-        </v-row>
-      </v-form>
-      <v-alert v-if="failedRecipes[1]" outlined dense type="error">
-        <h4>Failed Recipes</h4>
-        <v-list dense>
-          <v-list-item v-for="fail in this.failedRecipes" :key="fail">
-            {{ fail }}
-          </v-list-item>
-        </v-list>
-      </v-alert>
-      <v-alert v-if="failedImages[1]" outlined dense type="error">
-        <h4>Failed Images</h4>
-        <v-list dense>
-          <v-list-item v-for="fail in this.failedImages" :key="fail">
-            {{ fail }}
-          </v-list-item>
-        </v-list>
-      </v-alert>
-    </v-card-text>
+
+    <v-tabs v-model="tab">
+      <v-tab>Chowdown</v-tab>
+      <v-tab>Nextcloud Recipes</v-tab>
+
+      <v-tab-item>
+        <ChowdownCard @loading="loading = true" @finished="finished" />
+      </v-tab-item>
+      <v-tab-item>
+        <NextcloudCard @loading="loading = true" @finished="finished" />
+      </v-tab-item>
+    </v-tabs>
   </v-card>
 </template>
 
+
 <script>
-import api from "../../../api";
+import ChowdownCard from "./ChowdownCard";
+import NextcloudCard from "./NextcloudCard";
 // import SuccessFailureAlert from "../../UI/SuccessFailureAlert";
 // import TimePicker from "./Webhooks/TimePicker";
 export default {
+  components: {
+    ChowdownCard,
+    NextcloudCard,
+  },
   data() {
     return {
-      processRan: false,
+      tab: null,
       loading: false,
-      failedImages: [],
-      failedRecipes: [],
-      repo: "",
     };
   },
   methods: {
-    async importRepo() {
-      this.loading = true;
-      let response = await api.migrations.migrateChowdown(this.repo);
-      this.failedImages = response.failedImages;
-      this.failedRecipes = response.failedRecipes;
+    finished() {
       this.loading = false;
-      this.processRan = true;
+      this.$store.dispatch("requestRecentRecipes");
     },
   },
 };