From 8f0e0a392e17e86085dbbb421a2c452df5a5cc7e Mon Sep 17 00:00:00 2001
From: Drew Ansbacher <drew.ansbacher@spiredigital.com>
Date: Wed, 30 Jun 2021 11:29:13 -0600
Subject: [PATCH] pw modal

---
 .../src/app/pages/home/home.page.html         |  4 +-
 setup-wizard/src/app/pages/home/home.page.ts  | 25 +++++++++++-
 .../src/app/pages/password/password.page.html |  6 ++-
 .../src/app/pages/password/password.page.ts   | 35 ++++++++++++-----
 .../src/app/pages/recover/recover.page.html   |  6 +--
 .../src/app/pages/recover/recover.page.ts     | 39 +++++++++++++++++--
 .../src/app/services/api/api.service.ts       |  2 +-
 .../src/app/services/api/mock-api.service.ts  |  5 +--
 8 files changed, 96 insertions(+), 26 deletions(-)

diff --git a/setup-wizard/src/app/pages/home/home.page.html b/setup-wizard/src/app/pages/home/home.page.html
index e43a6d3d6..4f3fed8d6 100644
--- a/setup-wizard/src/app/pages/home/home.page.html
+++ b/setup-wizard/src/app/pages/home/home.page.html
@@ -10,7 +10,7 @@
     <h2 color="light">Select Data Drive</h2>
     <ion-card 
       *ngFor="let drive of dataDrives"
-      (click)="selectDrive(drive['logical-name'])"
+      (click)="selectDrive(drive)"
       button="true"
       [class.selected]="selectedDrive === drive['logical-name']"
       color="light"
@@ -28,7 +28,7 @@
   </div>
   <div *ngIf="stateService.selectedDataDrive">
     <ion-card
-      [routerLink]="['/password']"
+      (click)="presentPasswordModal()"
       button="true"
       color="light"
     >
diff --git a/setup-wizard/src/app/pages/home/home.page.ts b/setup-wizard/src/app/pages/home/home.page.ts
index ac00b8be0..55c56700a 100644
--- a/setup-wizard/src/app/pages/home/home.page.ts
+++ b/setup-wizard/src/app/pages/home/home.page.ts
@@ -1,7 +1,8 @@
 import { Component } from '@angular/core'
-import { AlertController } from '@ionic/angular'
+import { AlertController, ModalController } from '@ionic/angular'
 import { ApiService } from 'src/app/services/api/api.service'
 import { StateService } from 'src/app/services/state.service'
+import { PasswordPage } from '../password/password.page'
 
 @Component({
   selector: 'home',
@@ -16,6 +17,7 @@ export class HomePage {
     private readonly apiService: ApiService,
     private readonly stateService: StateService,
     private readonly alertController: AlertController,
+    private modalController: ModalController,
   ) {}
 
   async ngOnInit() {
@@ -62,4 +64,25 @@ export class HomePage {
     this.stateService.selectedDataDrive = this.selectedDrive
   }
 
+  async presentPasswordModal() {
+    const modal = await this.modalController.create({
+      component: PasswordPage,
+      backdropDismiss: false,
+      componentProps: {
+        'version': null,
+      }
+    })
+    modal.onDidDismiss().then(ret => {
+      if(ret.data.pwValid) {
+        this.submitPassword(ret.data.password)
+      }
+    })
+    await modal.present();
+  }
+
+  async submitPassword (pw: string) {
+    await this.apiService.submitPassword(pw)
+    // @TODO navigate to embassyOS
+  }
+
 }
diff --git a/setup-wizard/src/app/pages/password/password.page.html b/setup-wizard/src/app/pages/password/password.page.html
index 417b719d2..ce7b497c8 100644
--- a/setup-wizard/src/app/pages/password/password.page.html
+++ b/setup-wizard/src/app/pages/password/password.page.html
@@ -6,15 +6,17 @@
   </ion-toolbar>
 </ion-header>
 <ion-content>
-  <div *ngIf="stateService.recoveryDrive">
+  <div *ngIf="!needsVer">
     <h2>Enter Password</h2>
     <ion-input type="password" [(ngModel)]="password">Password:</ion-input>
   </div>
-  <div *ngIf="!stateService.recoveryDrive">
+
+  <div *ngIf="needsVer">
     <h2>Create Password</h2>
     <ion-input type="password" [(ngModel)]="password">Password:</ion-input>
     <ion-input type="password" [(ngModel)]="passwordVer">Verify Password:</ion-input>
   </div>
   <p>{{error}}</p>
+  <ion-button (click)="cancel()">Cancel</ion-button>
   <ion-button (click)="submitPassword()" [disabled]="!password">Submit</ion-button>
 </ion-content>
diff --git a/setup-wizard/src/app/pages/password/password.page.ts b/setup-wizard/src/app/pages/password/password.page.ts
index 484d111f0..051f0477c 100644
--- a/setup-wizard/src/app/pages/password/password.page.ts
+++ b/setup-wizard/src/app/pages/password/password.page.ts
@@ -1,6 +1,5 @@
-import { Component } from '@angular/core'
-import { ApiService } from 'src/app/services/api/api.service'
-import { StateService } from 'src/app/services/state.service'
+import { Component, Input } from '@angular/core'
+import { ModalController } from '@ionic/angular'
 
 @Component({
   selector: 'password',
@@ -8,24 +7,40 @@ import { StateService } from 'src/app/services/state.service'
   styleUrls: ['password.page.scss'],
 })
 export class PasswordPage {
+  @Input() version: string | null
+
+  needsVer = true
+
   error = ''
   password = ''
   passwordVer = ''
 
   constructor(
-    private readonly apiService: ApiService,
-    private readonly stateService: StateService,
+    private modalController: ModalController
   ) {}
 
+  ngOnInit() {
+    this.needsVer = !this.version?.startsWith('0.3')
+    console.log('needs', this.needsVer)
+  }
+
   async submitPassword () {
-    if (!this.stateService.recoveryDrive && this.password !== this.passwordVer) {
-      console.log('here')
+    if (this.needsVer && this.password !== this.passwordVer) {
       this.error="*passwords dont match"
     } else {
-      console.log('submitting')
-      await this.apiService.submitPassword(this.password)
-      // @Todo navigate to embassy os
+      this.dismiss(true)
     }
   }
 
+  cancel () {
+    this.dismiss(false)
+  }
+
+  dismiss(submitted: boolean) {
+    this.modalController.dismiss({
+      pwValid: submitted,
+      pw: this.password
+    });
+  }
+
 }
diff --git a/setup-wizard/src/app/pages/recover/recover.page.html b/setup-wizard/src/app/pages/recover/recover.page.html
index 8680113ce..b7a6d1c9e 100644
--- a/setup-wizard/src/app/pages/recover/recover.page.html
+++ b/setup-wizard/src/app/pages/recover/recover.page.html
@@ -10,7 +10,7 @@
     <h2 color="light">Select Data Drive</h2>
     <ion-card 
       *ngFor="let drive of dataDrives"
-      (click)="selectDrive(drive['logical-name'])"
+      (click)="selectDrive(drive)"
       button="true"
       [class.selected]="selectedDrive === drive['logical-name']"
       color="light"
@@ -30,11 +30,11 @@
     <h2>Progress: {{ 100 * stateService.dataProgress }}% <ion-spinner *ngIf="stateService.dataProgress != 1"></ion-spinner> </h2>
     <ion-progress-bar value="{{stateService.dataProgress}}"></ion-progress-bar>
     <ion-button 
-      [routerLink]="['/password']" 
+      (click)="navToEmbassy()"
       color="primary" 
       [disabled]="stateService.dataProgress != 1"
     >
-      Next
+      Go To Embassy
     </ion-button>
   </div>
 </ion-content>
diff --git a/setup-wizard/src/app/pages/recover/recover.page.ts b/setup-wizard/src/app/pages/recover/recover.page.ts
index f1a76f6af..730e0a412 100644
--- a/setup-wizard/src/app/pages/recover/recover.page.ts
+++ b/setup-wizard/src/app/pages/recover/recover.page.ts
@@ -1,7 +1,8 @@
 import { Component } from '@angular/core'
-import { AlertController } from '@ionic/angular'
-import { ApiService } from 'src/app/services/api/api.service'
+import { AlertController, ModalController } from '@ionic/angular'
+import { ApiService, EmbassyDrive } from 'src/app/services/api/api.service'
 import { StateService } from 'src/app/services/state.service'
+import { PasswordPage } from '../password/password.page'
 
 @Component({
   selector: 'recover',
@@ -11,11 +12,13 @@ import { StateService } from 'src/app/services/state.service'
 export class RecoverPage {
   dataDrives = []
   selectedDrive = null
+  selectedVersion = null
 
   constructor(
     private readonly apiService: ApiService,
     private readonly stateService: StateService,
     public alertController: AlertController,
+    private modalController: ModalController,
   ) {}
 
   async ngOnInit() {
@@ -26,11 +29,15 @@ export class RecoverPage {
     }
   }
 
-  selectDrive(name: string) {
+  selectDrive(disk: EmbassyDrive) {
+    const name = disk['logical-name']
+    const version = disk.version
     if (name === this.selectedDrive) {
       this.selectedDrive = null
+      this.selectedVersion = null
     } else {
       this.selectedDrive = name
+      this.selectedVersion = version
     }
   }
 
@@ -60,9 +67,33 @@ export class RecoverPage {
   }
 
   async chooseDisk() {
-    await this.apiService.selectEmbassyDrive({logicalName: this.selectedDrive})
+    this.presentPasswordModal()
+  }
+
+  async presentPasswordModal() {
+    const modal = await this.modalController.create({
+      component: PasswordPage,
+      backdropDismiss: false,
+      componentProps: {
+        'version': this.selectedVersion,
+      }
+    })
+    modal.onDidDismiss().then(ret => {
+      if(ret.data.pwValid) {
+        this.submitPWAndDisk(ret.data.password)
+      }
+    })
+    await modal.present();
+  }
+
+  async submitPWAndDisk(pw: string) {
+    await this.apiService.selectEmbassyDrive({logicalName: this.selectedDrive}, pw)
     this.stateService.recoveryDrive = this.selectedDrive
     this.stateService.pollDataTransferProgress()
   }
 
+  async navToEmbassy() {
+    // @TODO nav to embassy
+  }
+
 }
diff --git a/setup-wizard/src/app/services/api/api.service.ts b/setup-wizard/src/app/services/api/api.service.ts
index 446b52d13..c9a77ce00 100644
--- a/setup-wizard/src/app/services/api/api.service.ts
+++ b/setup-wizard/src/app/services/api/api.service.ts
@@ -7,7 +7,7 @@ export abstract class ApiService {
   abstract getStorageDisks (): Promise<StorageDisk[]>
   abstract selectStorageDisk (disk: { logicalName: string }): Promise<void>
   abstract getEmbassyDrives (): Promise<EmbassyDrive[]>
-  abstract selectEmbassyDrive (disk: { logicalName: string }): Promise<void>
+  abstract selectEmbassyDrive (disk: { logicalName: string }, password: string): Promise<void>
   abstract getDataTransferProgress () : Promise<TransferProgress>
   abstract submitPassword (password: string) : Promise<void>
 }
diff --git a/setup-wizard/src/app/services/api/mock-api.service.ts b/setup-wizard/src/app/services/api/mock-api.service.ts
index 3177945f9..ac154acd5 100644
--- a/setup-wizard/src/app/services/api/mock-api.service.ts
+++ b/setup-wizard/src/app/services/api/mock-api.service.ts
@@ -12,9 +12,8 @@ export class MockApiService extends ApiService {
   }
 
   async getState () {
-    await pauseFor(2000)
     return {
-      'selected-data-drive': null,
+      'selected-data-drive': 'page1',
       'recovery-drive': null,
       'has-password': false,
       'data-transfer-progress': null
@@ -74,4 +73,4 @@ export class MockApiService extends ApiService {
   }
 }
 
-let tries = 4
\ No newline at end of file
+let tries = 2
\ No newline at end of file