Fix: Remove legacy otp from login and show the right device id.

bookie/src/app/auth/auth.service.ts

@@ -82,11 +82,10 @@ export class AuthService {
     return this.currentUserSubject.value;
   }
 
-  login(username: string, password: string, otp: string) {
+  login(username: string, password: string) {
     const formData: FormData = new FormData();
     formData.append('username', username);
     formData.append('password', password);
-    formData.append('otp', otp);
     formData.append('grant_type', 'password');
     return this.http
       .post<{ access_token: string; token_type: string }>(loginUrl, formData)

bookie/src/app/auth/login/login.component.html

@@ -26,31 +26,7 @@
         </mat-form-field>
       </div>
       <mat-divider></mat-divider>
-      <h2 *ngIf="showOtp">Client ID: {{ clientId }}</h2>
-      <div
-        fxLayout="row"
-        fxLayout.lt-md="column"
-        fxLayoutGap="20px"
-        fxLayoutGap.lt-md="0px"
-        *ngIf="showOtp"
-      >
-        <mat-form-field fxFlex>
-          <mat-label>Otp</mat-label>
-          <input matInput placeholder="Otp" formControlName="otp" />
-        </mat-form-field>
-      </div>
-      <div
-        fxLayout="row"
-        fxLayout.lt-md="column"
-        fxLayoutGap="20px"
-        fxLayoutGap.lt-md="0px"
-        *ngIf="showOtp"
-      >
-        <mat-form-field fxFlex>
-          <mat-label>Client Name</mat-label>
-          <input matInput placeholder="Client Name" formControlName="clientName" />
-        </mat-form-field>
-      </div>
+      <h2 *ngIf="unregisteredDevice">Sorry, device {{ deviceName }} is not enabled.</h2>
     </form>
   </mat-card-content>
   <mat-card-actions>

bookie/src/app/auth/login/login.component.ts

@@ -15,8 +15,8 @@ export class LoginComponent implements OnInit, AfterViewInit {
   @ViewChild('nameElement', { static: true }) nameElement?: ElementRef;
   form: FormGroup;
   hide: boolean;
-  showOtp: boolean;
-  clientId: string;
+  unregisteredDevice: boolean;
+  deviceName: string;
   private returnUrl: string;
 
   constructor(
@@ -28,8 +28,8 @@ export class LoginComponent implements OnInit, AfterViewInit {
     private fb: FormBuilder,
   ) {
     this.hide = true;
-    this.showOtp = false;
-    this.clientId = '';
+    this.unregisteredDevice = false;
+    this.deviceName = '';
     this.returnUrl = '';
 
     // Create form
@@ -56,9 +56,8 @@ export class LoginComponent implements OnInit, AfterViewInit {
     const formModel = this.form.value;
     const { username } = formModel;
     const { password } = formModel;
-    const { otp } = formModel;
     this.auth
-      .login(username, password, otp)
+      .login(username, password)
       // .pipe(first())
       .subscribe(
         () => {
@@ -66,8 +65,8 @@ export class LoginComponent implements OnInit, AfterViewInit {
         },
         (error) => {
           if (error.status === 401 && error.error.detail === 'Device is not registered') {
-            this.showOtp = true;
-            this.clientId = this.cs.getCookie('device_id');
+            this.unregisteredDevice = true;
+            this.deviceName = this.cs.getCookie('device');
           }
           this.toaster.show('Error', error.error.detail);
         },