If confirmation is needed, show it in the frontend while redirecting to /login

5 files changed, 93 insertions, 64 deletions

diff --git a/api/controllers/api/v1/accounts.py b/api/controllers/api/v1/accounts.py
index bb2f84d0..eff33449 100644
--- a/api/controllers/api/v1/accounts.py
+++ b/api/controllers/api/v1/accounts.py
@@ -160,6 +160,7 @@ def accounts():
 
     if FSConfirmable.requires_confirmation(u):
         FSConfirmable.send_confirmation_instructions(u)
+        return jsonify({"need_confirmation": True, "message": "need email confirmation"}), 200
 
     # get the matching item from the given bearer
     bearer_item = OAuth2Token.query.filter(OAuth2Token.access_token == bearer).first()
diff --git a/front/src/boot/routes.js b/front/src/boot/routes.js
index 6457561c..d8bde47f 100644
--- a/front/src/boot/routes.js
+++ b/front/src/boot/routes.js
@@ -45,7 +45,7 @@ export default (store) => {
     { name: 'public-timeline', path: '/main/public', component: PublicTimeline },
     { name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute },
     { path: '/about', name: 'about', component: About },
-    { path: '/login', name: 'login_form', component: LoginForm },
+    { path: '/login', name: 'login_form', component: LoginForm, props: true },
     { path: '/register', name: 'register', component: Register },
     { name: 'password-reset', path: '/password-reset', component: PasswordReset },
     { name: 'password-reset-token', path: '/password-reset/:token', component: PasswordResetToken },
diff --git a/front/src/components/login_form/login_form.vue b/front/src/components/login_form/login_form.vue
index 0e4b31be..52b59349 100644
--- a/front/src/components/login_form/login_form.vue
+++ b/front/src/components/login_form/login_form.vue
@@ -1,66 +1,74 @@
 <template>
-  <div class="row justify-content-md-center">
-    <div class="col-md-3">
-      <b-form class="login" @submit.prevent="submitPassword">
-        <h1 v-translate>
-          Sign in
-        </h1>
-        <b-form-group
-          id="ig-username"
-          :label="labels.usernameLabel"
-          label-for="username"
-        >
-          <b-form-input
-            id="username"
-            v-model="user.username"
-            type="text"
-            :placeholder="labels.usernamePlaceholder"
-            :state="$v.user.username.$dirty ? !$v.user.username.$error : null"
-            aria-describedby="login-live-feedback"
-          />
-          <b-form-invalid-feedback id="login-live-feedback">
-            <translate translate-context="Content/Login/Feedback/Username/Required">
-              Please enter your login
-            </translate>
-          </b-form-invalid-feedback>
-        </b-form-group>
+  <div>
+    <div v-if="needsEmailConfirmation" class="row justify-content-md-center">
+      <b-alert v-translate variant="warning" show>
+        An email has been sent to confirm your account, you cannot login before this is done.
+      </b-alert>
+    </div>
 
-        <b-form-group
-          id="ig-password"
-          :label="labels.passwordLabel"
-          label-for="password"
-        >
-          <b-form-input
-            id="password"
-            v-model="user.password"
-            type="password"
-            :placeholder="labels.passwordPlaceholder"
-            :state="$v.user.password.$dirty ? !$v.user.password.$error : null"
-            aria-describedby="password-live-feedback"
-          />
-          <b-form-invalid-feedback id="password-live-feedback">
-            <translate translate-context="Content/Login/Feedback/Password/Required">
-              Please enter your password
-            </translate>
-          </b-form-invalid-feedback>
-        </b-form-group>
+    <div class="row justify-content-md-center">
+      <div class="col-md-3">
+        <b-form class="login" @submit.prevent="submitPassword">
+          <h1 v-translate>
+            Sign in
+          </h1>
+          <b-form-group
+            id="ig-username"
+            :label="labels.usernameLabel"
+            label-for="username"
+          >
+            <b-form-input
+              id="username"
+              v-model="user.username"
+              type="text"
+              :placeholder="labels.usernamePlaceholder"
+              :state="$v.user.username.$dirty ? !$v.user.username.$error : null"
+              aria-describedby="login-live-feedback"
+            />
+            <b-form-invalid-feedback id="login-live-feedback">
+              <translate translate-context="Content/Login/Feedback/Username/Required">
+                Please enter your login
+              </translate>
+            </b-form-invalid-feedback>
+          </b-form-group>
 
-        <b-button type="submit" variant="primary">
-          <translate translate-context="Content/Login/Button/Login">
-            Login
-          </translate>
-        </b-button>
-        <router-link :to="{name: 'password-reset'}">
-          <translate translate-context="Content/Login/Link/Reset password">
-            Reset password
-          </translate>
-        </router-link>
-      </b-form>
+          <b-form-group
+            id="ig-password"
+            :label="labels.passwordLabel"
+            label-for="password"
+          >
+            <b-form-input
+              id="password"
+              v-model="user.password"
+              type="password"
+              :placeholder="labels.passwordPlaceholder"
+              :state="$v.user.password.$dirty ? !$v.user.password.$error : null"
+              aria-describedby="password-live-feedback"
+            />
+            <b-form-invalid-feedback id="password-live-feedback">
+              <translate translate-context="Content/Login/Feedback/Password/Required">
+                Please enter your password
+              </translate>
+            </b-form-invalid-feedback>
+          </b-form-group>
 
-      <br>
-      <b-alert v-if="error" variant="danger" show>
-        {{ error }}
-      </b-alert>
+          <b-button type="submit" variant="primary">
+            <translate translate-context="Content/Login/Button/Login">
+              Login
+            </translate>
+          </b-button>
+          <router-link :to="{name: 'password-reset'}">
+            <translate translate-context="Content/Login/Link/Reset password">
+              Reset password
+            </translate>
+          </router-link>
+        </b-form>
+
+        <br>
+        <b-alert v-if="error" variant="danger" show>
+          {{ error }}
+        </b-alert>
+      </div>
     </div>
   </div>
 </template>
@@ -73,6 +81,13 @@ import oauthApi from '../../backend/oauth/oauth.js'
 
 export default {
   mixins: [validationMixin],
+  props: {
+    needsEmailConfirmation: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
   data: () => ({
     user: {},
     error: false
diff --git a/front/src/components/register/register.vue b/front/src/components/register/register.vue
index da366c89..b313d439 100644
--- a/front/src/components/register/register.vue
+++ b/front/src/components/register/register.vue
@@ -224,8 +224,12 @@ export default {
       if (!this.$v.$invalid) {
         try {
           console.debug('register:registering')
-          await this.signUp(this.user)
-          this.$router.push({ name: 'profile' })
+          const autologin = await this.signUp(this.user)
+          if (autologin) {
+            this.$router.push({ name: 'profile' })
+          } else {
+            this.$router.push({ name: 'login_form', params: { needsEmailConfirmation: true } })
+          }
         } catch (error) {
           console.warn('Registration failed: ' + error)
           this.$bvToast.toast(this.$pgettext('Content/Register/Toast/Error/Message', 'An error occured'), {
diff --git a/front/src/modules/users.js b/front/src/modules/users.js
index 92a3abe6..764b67e3 100644
--- a/front/src/modules/users.js
+++ b/front/src/modules/users.js
@@ -163,14 +163,23 @@ const users = {
       })
     },
     async signUp (store, userInfo) {
+      // Returns true if autologin, false if account needs confirmation
       console.debug('users:signUp')
       store.commit('signUpPending')
 
       try {
         const data = await apiService.register(userInfo, store)
         store.commit('signUpSuccess')
-        store.commit('setToken', data.access_token)
-        store.dispatch('loginUser', data.access_token)
+        if (data.need_confirmation) {
+          // user needs to confirm his account through email
+          console.debug('email confirmation is enabled')
+          return false // no autologin
+        } else {
+          // email confirmation not enabled, we got an access token
+          store.commit('setToken', data.access_token)
+          store.dispatch('loginUser', data.access_token)
+          return true // autologin
+        }
       } catch (e) {
         store.commit('signUpFailure', e.errors)
         throw e