From 2dfe5746af9405d1ae882fa64a1cb33f73f823f0 Mon Sep 17 00:00:00 2001
From: Axolotle <nchesnais@mailoo.org>
Date: Sun, 27 Sep 2020 22:37:16 +0200
Subject: [PATCH] add PostInstall view/route

---
 app/src/i18n/locales/en.json  |   4 +-
 app/src/router/routes.js      |  10 +++
 app/src/views/Login.vue       |   2 +-
 app/src/views/PostInstall.vue | 113 ++++++++++++++++++++++++++++++++++
 4 files changed, 127 insertions(+), 2 deletions(-)
 create mode 100644 app/src/views/PostInstall.vue

diff --git a/app/src/i18n/locales/en.json b/app/src/i18n/locales/en.json
index 883e0884..6cb800a9 100644
--- a/app/src/i18n/locales/en.json
+++ b/app/src/i18n/locales/en.json
@@ -64,7 +64,7 @@
     "confirm_install_app_warning": "Warning: this application may work but is not well-integrated in YunoHost. Some features such as single sign-on and backup/restore might not be available.",
     "confirm_install_app_danger": "WARNING! This application is still experimental (if not explicitly not working) and it is likely to break your system! You should probably NOT install it unless you know what you are doing. Are you willing to take that risk?",
     "confirm_migrations_skip": "Skipping migrations is not recommended. Are you sure you want to do that?",
-    "confirm_postinstall": "You are about to launch the post-installation process on the domain %s. It may take a few minutes, *do not interrupt the operation*.",
+    "confirm_postinstall": "You are about to launch the post-installation process on the domain {domain}. It may take a few minutes, *do not interrupt the operation*.",
     "confirm_restore": "Are you sure you want to restore {name}?",
     "confirm_service_restart": "Are you sure you want to restart {name}?",
     "confirm_service_start": "Are you sure you want to start {name}?",
@@ -268,6 +268,8 @@
     "postinstall_intro_2": "Two more configuration steps are required to activate you server's services.",
     "postinstall_intro_3": "You can obtain more information by visiting the <a href='//yunohost.org/postinstall' target='_blank'>appropriate documentation page</a>",
     "postinstall_password": "This password will be used to manage everything on your server. Take the time to choose it wisely.",
+    "postinstall_set_domain": "Set main domain",
+    "postinstall_set_password": "Set administration password",
     "previous": "Previous",
     "protocol": "Protocol",
     "read_more": "Read more",
diff --git a/app/src/router/routes.js b/app/src/router/routes.js
index 65a2a681..d696bb8b 100644
--- a/app/src/router/routes.js
+++ b/app/src/router/routes.js
@@ -10,6 +10,16 @@ const routes = [
   { name: 'home', path: '/', component: Home },
   { name: 'login', path: '/login', component: Login, meta: { noAuth: true } },
 
+  /* ───────────────╮
+   │  POST INSTALL  │
+   ╰─────────────── */
+  {
+    name: 'post-install',
+    path: '/postinstall',
+    component: () => import(/* webpackChunkName: "views/postinstall" */ '@/views/PostInstall'),
+    meta: { noAuth: true }
+  },
+
   /* ───────╮
    │  USER  │
    ╰─────── */
diff --git a/app/src/views/Login.vue b/app/src/views/Login.vue
index 321b53ec..cac677d0 100644
--- a/app/src/views/Login.vue
+++ b/app/src/views/Login.vue
@@ -58,7 +58,7 @@ export default {
       if (installed) {
         this.disabled = false
       } else {
-        this.$router.push({ name: 'postinstall' })
+        this.$router.push({ name: 'post-install' })
       }
     }).catch(err => {
       this.apiError = err.message
diff --git a/app/src/views/PostInstall.vue b/app/src/views/PostInstall.vue
new file mode 100644
index 00000000..1913b007
--- /dev/null
+++ b/app/src/views/PostInstall.vue
@@ -0,0 +1,113 @@
+<template>
+  <div class="post-install">
+    <!-- START STEP -->
+    <template v-if="step === 'start'">
+      <b-alert variant="success" show>
+        <icon iname="thumbs-up" /> {{ $t('postinstall_intro_1') }}
+      </b-alert>
+      <b-alert variant="info" show>
+        <span v-t="'postinstall_intro_2'" />
+        <br>
+        <span v-html="$t('postinstall_intro_3')" />
+      </b-alert>
+      <b-button size="lg" variant="primary" @click="step = 'domain'">
+        {{ $t('begin') }}
+      </b-button>
+    </template>
+
+    <!-- DOMAIN SETUP STEP -->
+    <template v-else-if="step === 'domain'">
+      <domain-form :title="$t('postinstall_set_domain')" :submit-text="$t('next')" @submit="setDomain">
+        <template v-slot:message>
+          <b-alert variant="warning" show v-t="'postinstall_domain'" />
+        </template>
+      </domain-form>
+
+      <b-button variant="primary" @click="step = 'start'" class="mt-3">
+        <icon iname="chevron-left" /> {{ $t('previous') }}
+      </b-button>
+    </template>
+
+    <!-- PASSWORD SETUP STEP -->
+    <template v-else-if="step === 'password'">
+      <password-form :title="$t('postinstall_set_password')" :submit-text="$t('next')" @submit="setPassword">
+        <template v-slot:message>
+          <b-alert variant="warning" show v-t="'postinstall_password'" />
+        </template>
+      </password-form>
+
+      <b-button variant="primary" @click="step = 'domain'" class="mt-3">
+        <icon iname="chevron-left" /> {{ $t('previous') }}
+      </b-button>
+    </template>
+
+    <!-- POST-INSTALL SUCCESS STEP -->
+    <template v-else-if="step === 'login'">
+      <b-alert variant="success" show>
+        <icon iname="thumbs-up" /> {{ $t('installation_complete') }}
+      </b-alert>
+      <login-view />
+    </template>
+
+    <!-- CONFIRM POST-INSTALL MODAL -->
+    <b-modal
+      ref="post-install-modal" id="post-install-modal" centered
+      body-bg-variant="danger" body-text-variant="light"
+      @ok="performPostInstall" hide-header
+    >
+      {{ $t('confirm_postinstall', { domain }) }}
+    </b-modal>
+  </div>
+</template>
+
+<script>
+import api from '@/helpers/api'
+import { DomainForm, PasswordForm } from '@/components/reusableForms'
+import LoginView from '@/views/Login'
+
+export default {
+  name: 'PostInstall',
+
+  data () {
+    return {
+      step: 'start',
+      domain: undefined,
+      password: undefined
+    }
+  },
+
+  methods: {
+    setDomain ({ domain }) {
+      this.domain = domain
+      this.step = 'password'
+    },
+
+    setPassword (password) {
+      this.password = password
+      this.$refs['post-install-modal'].show()
+    },
+
+    performPostInstall () {
+      // FIXME does the api will throw an error for bad passwords ?
+      api.post('postinstall', { domain: this.domain, password: this.password }).then(data => {
+        // Display success message and allow the user to login
+        this.step = 'login'
+      })
+    }
+  },
+
+  created () {
+    this.$store.dispatch('CHECK_INSTALL').then(installed => {
+      if (installed) {
+        this.$router.push({ name: 'home' })
+      }
+    })
+  },
+
+  components: {
+    DomainForm,
+    PasswordForm,
+    LoginView
+  }
+}
+</script>