user must click continue in kiosk on success page (#2001)

* user must click continue in kiosk on success page

* hide source disk when target list for transfer and shpw indeterminate bar when 100%

* minor copy

* also check for guid on disk

* reuse va

frontend/projects/setup-wizard/src/app/pages/embassy/embassy.page.ts

@@ -9,6 +9,7 @@ import {
   ApiService,
   BackupRecoverySource,
   DiskRecoverySource,
+  DiskMigrateSource,
 } from 'src/app/services/api/api.service'
 import { DiskInfo, ErrorToastService, GuidPipe } from '@start9labs/shared'
 import { StateService } from 'src/app/services/state.service'
@@ -52,17 +53,24 @@ export class EmbassyPage {
     this.loading = true
     try {
       const disks = await this.apiService.getDrives()
-      this.storageDrives = disks.filter(
-        d =>
-          !d.partitions
+      this.storageDrives = disks.filter(d => {
+        if (this.stateService.setupType === 'restore') {
+          return !d.partitions
             .map(p => p.logicalname)
             .includes(
               (
                 (this.stateService.recoverySource as BackupRecoverySource)
                   ?.target as DiskRecoverySource
               )?.logicalname,
-            ),
-      )
+            )
+        } else if (this.stateService.setupType === 'transfer') {
+          const guid = (this.stateService.recoverySource as DiskMigrateSource)
+            .guid
+          return (
+            d.guid !== guid && !d.partitions.map(p => p.guid).includes(guid)
+          )
+        }
+      })
     } catch (e: any) {
       this.errorToastService.present(e)
     } finally {

frontend/projects/setup-wizard/src/app/pages/loading/loading.page.html

@@ -24,7 +24,7 @@
                 padding-bottom: 20px;
                 margin-bottom: 40px;
               "
-              [type]="progress.decimal ? 'determinate' : 'indeterminate'"
+              [type]="progress.decimal && progress.decimal < 1 ? 'determinate' : 'indeterminate'"
               [value]="progress.decimal || 0"
             ></ion-progress-bar>
             <p>{{ progress.decimal | toMessage }}</p>

frontend/projects/setup-wizard/src/app/pages/loading/loading.page.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core'
 import { NavController } from '@ionic/angular'
 import { StateService } from 'src/app/services/state.service'
+import { Pipe, PipeTransform } from '@angular/core'
 
 @Component({
   selector: 'app-loading',
@@ -28,8 +29,6 @@ export class LoadingPage {
   }
 }
 
-import { Pipe, PipeTransform } from '@angular/core'
-
 @Pipe({
   name: 'toMessage',
 })
@@ -42,12 +41,20 @@ export class ToMessagePipe implements PipeTransform {
       case 'attach':
         return 'Setting up your Embassy'
       case 'restore':
-        return 'Restoring data. This can take a while.'
+        if (!progress) {
+          return 'Initializing'
+        } else if (progress < 1) {
+          return 'Restoring data. This can take a while'
+        } else {
+          return 'Finalizing data restore'
+        }
       case 'transfer':
         if (!progress) {
           return 'Preparing data. Depending on how much data you have, this could take up to 1 hour'
-        } else {
+        } else if (progress < 1) {
           return 'Transferring data'
+        } else {
+          return 'Finalizing data transfer'
         }
       default:
         return ''

frontend/projects/setup-wizard/src/app/pages/success/success.page.html

@@ -8,16 +8,23 @@
           <ion-card>
             <ion-row class="ion-align-items-center">
               <ion-col size-xs="12" class="ion-text-center">
-                <div class="inline">
+                <div class="inline" style="margin-bottom: 3rem">
                   <ion-icon
                     name="checkmark-circle-outline"
                     color="success"
                   ></ion-icon>
                   <h1>Setup Complete!</h1>
                 </div>
-                <h3 class="ion-padding-top">
-                  You will be redirected momentarily.
-                </h3>
+                <div class="card-container">
+                  <ion-card id="exit" (click)="exitKiosk()">
+                    <div class="container">
+                      <div class="inline">
+                        <p>Continue to login</p>
+                        <ion-icon name="log-in-outline"></ion-icon>
+                      </div>
+                    </div>
+                  </ion-card>
+                </div>
               </ion-col>
             </ion-row>
           </ion-card>

frontend/projects/setup-wizard/src/app/pages/success/success.page.scss

@@ -106,6 +106,20 @@ ion-card {
     align-items: center;
   }
 
+  #exit {
+    background: var(--color-accent);
+    height: 100%;
+
+    .container p {
+      font-size: 1.4rem !important;
+      font-weight: bold;
+    }
+
+    ion-icon {
+      font-size: 1.7rem;
+    }
+  }
+
   #launch {
     background: var(--alt-blue);
     height: 100%;

frontend/projects/setup-wizard/src/app/pages/success/success.page.ts

@@ -8,11 +8,7 @@ import {
   Output,
   ViewChild,
 } from '@angular/core'
-import {
-  DownloadHTMLService,
-  ErrorToastService,
-  pauseFor,
-} from '@start9labs/shared'
+import { DownloadHTMLService, ErrorToastService } from '@start9labs/shared'
 import { ApiService } from 'src/app/services/api/api.service'
 import { StateService } from 'src/app/services/state.service'
 
@@ -61,14 +57,13 @@ export class SuccessPage {
     this.ngZone.runOutsideAngular(() => this.initMatrix())
     try {
       const ret = await this.api.complete()
-      if (this.isKiosk) {
-        await pauseFor(4000)
-      } else {
+      if (!this.isKiosk) {
         this.torAddress = ret['tor-address']
         this.lanAddress = ret['lan-address']
         this.cert = ret['root-ca']
+
+        await this.api.exit()
       }
-      await this.api.exit()
     } catch (e: any) {
       await this.errCtrl.present(e)
     }
@@ -94,6 +89,10 @@ export class SuccessPage {
     })
   }
 
+  exitKiosk() {
+    this.api.exit()
+  }
+
   private initMatrix() {
     this.ctx = this.canvas.nativeElement.getContext('2d')!
     this.canvas.nativeElement.width = window.innerWidth
@@ -118,7 +117,7 @@ export class SuccessPage {
     }
   }
 
-  draw() {
+  private draw() {
     // draw a semi transparent black rectangle on top of the scene to slowly fade older characters
     this.ctx.fillStyle = 'rgba( 0 , 0 , 0 , ' + this.fadeFactor + ' )'
     this.ctx.fillRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height)
@@ -143,7 +142,7 @@ export class SuccessPage {
     }
   }
 
-  tick() {
+  private tick() {
     this.draw()
     setTimeout(this.tick.bind(this), 50)
   }