Enhance OTP type detection

app/Http/Controllers/TwoFAccountController.php

@@ -142,8 +142,7 @@ public function update(Request $request, $id)
             throw $e;
         }
         
-
+        if( $twofaccount->otpType === 'hotp' ) {
-        if( $twofaccount->type === 'hotp' ) {
 
             // HOTP can be desynchronized from the verification
             // server so we let the user the possibility to force

app/TwoFAccount.php

@@ -39,7 +39,7 @@ class TwoFAccount extends Model implements Sortable
      *
      * @var array
      */
-    protected $appends = ['type', 'counter'];
+    protected $appends = ['otpType', 'counter'];
 
 
     /**
@@ -130,14 +130,25 @@ public function setIconAttribute($value)
 
 
     /**
-    * Get the account type.
+    * Get the account OTP type.
     *
     * @return string
     */
-    public function getTypeAttribute()
+    public function getOtpTypeAttribute()
     {
-        
+        switch (substr( $this->uri, 0, 15 )) {
-        return substr( $this->uri, 0, 15 ) === "otpauth://totp/" ? 'totp' : 'hotp';
+
+            case "otpauth://totp/" :
+                return 'totp';
+                break;
+
+            case "otpauth://hotp/" :
+                return 'hotp';
+                break;
+
+            default:
+                return null;
+        }
     }
 
     /**
@@ -148,7 +159,7 @@ public function getTypeAttribute()
     public function getCounterAttribute()
     {
         
-        if( $this->type === 'hotp' ) {
+        if( $this->otpType === 'hotp' ) {
             $otp = Factory::loadFromProvisioningUri($this->uri);
 
             return $otp->getCounter();

resources/js/components/TwofaccountShow.vue

@@ -6,10 +6,10 @@
         <p class="is-size-4 has-text-grey-light has-ellipsis">{{ internal_service }}</p>
         <p class="is-size-6 has-text-grey has-ellipsis">{{ internal_account }}</p>
         <p id="otp" class="is-size-1 has-text-white" :title="$t('commons.copy_to_clipboard')" v-clipboard="() => otp.replace(/ /g, '')" v-clipboard:success="clipboardSuccessHandler">{{ displayedOtp }}</p>
-        <ul class="dots" v-if="type === 'totp'">
+        <ul class="dots" v-if="otpType === 'totp'">
             <li v-for="n in 30"></li>
         </ul>
-        <ul v-else-if="type === 'hotp'">
+        <ul v-else-if="otpType === 'hotp'">
             <li>counter: {{ counter }}</li>
         </ul>
     </div>
@@ -25,7 +25,7 @@
                 internal_uri: '',
                 next_uri: '',
                 internal_icon: '',
-                type: '',
+                otpType: '',
                 otp : '',
                 timerID: null,
                 position: null,
@@ -57,9 +57,9 @@
                 // 2 possible cases :
                 //   - ID is provided so we fetch the account data from db but without the uri.
                 //     This prevent the uri (a sensitive data) to transit via http request unnecessarily. In this
-                //     case this.type is sent by the backend.
+                //     case this.otpType is sent by the backend.
                 //   - the URI prop has been set via the create form, we need to preview some OTP before storing the account.
-                //     So this.type is set on client side from the provided URI
+                //     So this.otpType is set on client side from the provided URI
                 
                 this.id = id
 
@@ -71,7 +71,7 @@
                         this.internal_service = data.service
                         this.internal_account = data.account
                         this.internal_icon = data.icon
-                        this.type = data.type
+                        this.otpType = data.otpType
                     }
                     else {
 
@@ -79,10 +79,20 @@
                         this.internal_account = this.account
                         this.internal_icon = this.icon
                         this.internal_uri = this.uri
-                        this.type = this.internal_uri.slice(0, 15 ) === "otpauth://totp/" ? 'totp' : 'hotp';
+                        this.otpType = this.internal_uri.slice(0, 15 ) === "otpauth://totp/" ? 'totp' : 'hotp';
                     }
 
-                    this.type === 'totp' ? await this.getTOTP() : await this.getHOTP()
+                    switch(this.otpType) {
+                        case 'totp':
+                            await this.getTOTP()
+                            break;
+                        case 'hotp':
+                            await this.getHOTP()
+                            break;
+                        default:
+                            this.$router.push({ name: 'genericError', params: { err: this.$t('errors.not_a_supported_otp_type') } });
+                    } 
+
                     this.$parent.isActive = true
                 }
             },
@@ -156,7 +166,7 @@
             },
 
             stopLoop: function() {
-                if( this.type === 'totp' ) {
+                if( this.otpType === 'totp' ) {
                     clearInterval(this.timerID)
                 }
             },

resources/lang/en/errors.php

@@ -23,6 +23,7 @@
     ],
     'something_wrong_with_server' => 'Something is wrong with your server',
     'Unable_to_decrypt_uri' => 'Unable to decrypt uri',
+    'not_a_supported_otp_type' => 'This OTP format is not currently supported',
     'wrong_current_password' => 'Wrong current password, nothing has changed',
     'error_during_encryption' => 'Encryption failed, your database remains unprotected',
     'error_during_decryption' => 'Decryption failed, your database is still protected',