add PostInstall view/route

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",

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  │
    ╰─────── */

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

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>