updated login form

src/components/login_form/password_form.js

@@ -0,0 +1,43 @@
+import oauthApi from '../../services/new_api/oauth.js'
+import { mapState } from 'vuex'
+export default {
+  props: ['user'],
+  computed: mapState({
+    registrationOpen: state => state.instance.registrationOpen,
+    loggingIn: state => state.users.loggingIn
+  }),
+  methods: {
+    submit () {
+      const data = {
+        oauth: this.$store.state.oauth,
+        instance: this.$store.state.instance.server
+      }
+      this.$emit('display-errors', false)
+
+      oauthApi.getOrCreateApp(data).then((app) => {
+        oauthApi.getTokenWithCredentials(
+          {
+            app,
+            instance: data.instance,
+            username: this.user.username,
+            password: this.user.password
+          }
+        ).then(async (result) => {
+          if (result.error) {
+            if (result.error === 'mfa_required') {
+              this.$store.commit('mfa/setApp', app)
+              this.$store.commit('mfa/setSettings', result)
+              this.$emit('change-form', 'TotpForm')
+              return
+            } else {
+              this.$emit('display-errors', result.error)
+              this.user.password = ''
+              return
+            }
+          }
+          this.$emit('login', result)
+        })
+      })
+    }
+  }
+}

src/components/login_form/password_form.vue

@@ -34,48 +34,4 @@
   </div>
 </div>
 </template>
-<script>
-import oauthApi from '../../services/new_api/oauth.js'
-import { mapState } from 'vuex'
-export default {
-  props: ['user'],
-  computed: mapState({
-    registrationOpen: state => state.instance.registrationOpen,
-    loggingIn: state => state.users.loggingIn
-  }),
-  methods: {
-    submit () {
-      const data = {
-        oauth: this.$store.state.oauth,
-        instance: this.$store.state.instance.server
-      }
-      this.$emit('display-errors', false)
-
-      oauthApi.getOrCreateApp(data).then((app) => {
-        oauthApi.getTokenWithCredentials(
-          {
-            app,
-            instance: data.instance,
-            username: this.user.username,
-            password: this.user.password
-          }
-        ).then(async (result) => {
-          if (result.error) {
-            if (result.error === 'mfa_required') {
-              this.$store.commit('mfa/setApp', app)
-              this.$store.commit('mfa/setSettings', result)
-              this.$emit('change-form', 'TotpForm')
-              return
-            } else {
-              this.$emit('display-errors', result.error)
-              this.user.password = ''
-              return
-            }
-          }
-          this.$emit('login', result)
-        })
-      })
-    }
-  }
-}
-</script>
+<script src="./password_form.js" ></script>

src/components/login_form/recovery_form.js

@@ -0,0 +1,30 @@
+import mfaApi from '../../services/new_api/mfa.js'
+export default {
+  props: ['user'],
+  data () {
+    return { code: null }
+  },
+  methods: {
+    gotoOtp () {
+      this.$emit('change-form', 'TotpForm')
+    },
+    submit () {
+      const data = {
+        app: this.$store.state.mfa.app,
+        instance: this.$store.state.instance.server,
+        mfaToken: this.$store.state.mfa.settings.mfa_token,
+        code: this.code
+      }
+
+      mfaApi.verifyRecoveryCode(data).then((result) => {
+        if (result.error) {
+          this.$emit('display-errors', result.error)
+          this.code = null
+          return
+        }
+
+        this.$emit('login', result)
+      })
+    }
+  }
+}

src/components/login_form/recovery_form.vue

@@ -30,35 +30,4 @@
   </div>
 </div>
 </template>
-<script>
-import mfaApi from '../../services/new_api/mfa.js'
-export default {
-  props: ['user'],
-  data () {
-    return { code: null }
-  },
-  methods: {
-    gotoOtp () {
-      this.$emit('change-form', 'TotpForm')
-    },
-    submit () {
-      const data = {
-        app: this.$store.state.mfa.app,
-        instance: this.$store.state.instance.server,
-        mfaToken: this.$store.state.mfa.settings.mfa_token,
-        code: this.code
-      }
-
-      mfaApi.verifyRecoveryCode(data).then((result) => {
-        if (result.error) {
-          this.$emit('display-errors', result.error)
-          this.code = null
-          return
-        }
-
-        this.$emit('login', result)
-      })
-    }
-  }
-}
-</script>
+<script src="./recovery_form.js" ></script>

src/components/login_form/token_form.js

@@ -0,0 +1,18 @@
+import oauthApi from '../../services/new_api/oauth.js'
+import { mapState } from 'vuex'
+export default {
+  props: ['user'],
+  computed: mapState({
+    registrationOpen: state => state.instance.registrationOpen,
+    loggingIn: state => state.users.loggingIn
+  }),
+  methods: {
+    submit () {
+      oauthApi.login({
+        oauth: this.$store.state.oauth,
+        instance: this.$store.state.instance.server,
+        commit: this.$store.commit
+      })
+    }
+  }
+}

src/components/login_form/token_form.vue

@@ -27,23 +27,5 @@
   </div>
 </div>
 </template>
-<script>
-import oauthApi from '../../services/new_api/oauth.js'
-import { mapState } from 'vuex'
-export default {
-  props: ['user'],
-  computed: mapState({
-    registrationOpen: state => state.instance.registrationOpen,
-    loggingIn: state => state.users.loggingIn
-  }),
-  methods: {
-    submit () {
-      oauthApi.login({
-        oauth: this.$store.state.oauth,
-        instance: this.$store.state.instance.server,
-        commit: this.$store.commit
-      })
-    }
-  }
-}
-</script>
+
+<script src="./token_form.js" ></script>

src/components/login_form/totp_form.js

@@ -0,0 +1,32 @@
+import mfaApi from '../../services/new_api/mfa.js'
+export default {
+  props: ['user'],
+  data () {
+    return {
+      code: null
+    }
+  },
+  methods: {
+    gotoRecoveryCodes () {
+      this.$emit('change-form', 'RecoveryForm')
+    },
+
+    submit () {
+      const data = {
+        app: this.$store.state.mfa.app,
+        instance: this.$store.state.instance.server,
+        mfaToken: this.$store.state.mfa.settings.mfa_token,
+        code: this.code
+      }
+      mfaApi.verifyOTPCode(data).then((result) => {
+        if (result.error) {
+          this.$emit('display-errors', result.error)
+          this.code = null
+          return
+        }
+
+        this.$emit('login', result)
+      })
+    }
+  }
+}

src/components/login_form/totp_form.vue

@@ -29,37 +29,4 @@
   </div>
 </div>
 </template>
-<script>
-import mfaApi from '../../services/new_api/mfa.js'
-export default {
-  props: ['user'],
-  data () {
-    return {
-      code: null
-    }
-  },
-  methods: {
-    gotoRecoveryCodes () {
-      this.$emit('change-form', 'RecoveryForm')
-    },
-
-    submit () {
-      const data = {
-        app: this.$store.state.mfa.app,
-        instance: this.$store.state.instance.server,
-        mfaToken: this.$store.state.mfa.settings.mfa_token,
-        code: this.code
-      }
-      mfaApi.verifyOTPCode(data).then((result) => {
-        if (result.error) {
-          this.$emit('display-errors', result.error)
-          this.code = null
-          return
-        }
-
-        this.$emit('login', result)
-      })
-    }
-  }
-}
-</script>
+<script src="./totp_form.js"></script>

src/components/user_settings/mfa.vue

@@ -10,7 +10,7 @@
     <div class="setting-item">
       <button class="btn btn-default"
               @click="getBackupCodes">
-        {{$t('settings.mfa.re_generate_recovery_codes')}}
+        {{$t('settings.mfa.generate_new_recovery_codes')}}
       </button>
       <div v-if="backup_codes.length > 0">
         <h4>{{$t('settings.mfa.recovery_codes')}}</h4>

src/i18n/en.json

@@ -157,7 +157,7 @@
       "setup_otp" : "Setup OTP",
       "confirm_and_enabled" : "Confirm & enable OTP",
       "title": "Two-factor Authentication",
-      "re_generate_recovery_codes" : "Re-generate recovery codes",
+      "generate_new_recovery_codes" : "Generate new recovery codes",
       "generate_recovery_codes" : "Generate recovery codes.",
       "recovery_codes" : "Recovery codes.",
       "recovery_codes_warning" : "Print or copy your recovery codes before continuing two-factor authentication setup below.",

src/i18n/ru.json

@@ -95,7 +95,7 @@
       "setup_otp" : "Настройка OTP",
       "confirm_and_enabled" : "Подтвердить и включить OTP",
       "title": "Двухфакторная аутентификация",
-      "re_generate_recovery_codes" : "Получить новые коды востановления",
+      "generate_new_recovery_codes" : "Получить новые коды востановления",
       "generate_recovery_codes" : "Коды восстановления",
       "recovery_codes" : "Коды восстановления.",
       "recovery_codes_warning" : "Распечатайте или скопируйте коды восстановления.",