ui: add embassy os release notes

ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.html

@@ -81,6 +81,13 @@
         </ion-item>
       </ng-container>
 
+      <ion-item-divider style="color: var(--ion-color-primary); font-weight: bold;">Release Notes</ion-item-divider>
+      <ion-item lines="none" button details="true" [disabled]="" (click)="presentModalReleaseNotes()" [disabled]="$newVersionLoading$ | async">
+        <ion-icon slot="start" name="newspaper-outline" color="medium"></ion-icon>
+        <ion-label *ngIf="!($newVersionLoading$ | async)"><ion-text style="font-weight: bold;" color="medium">New in {{ vars.versionViewing | displayEmver }}</ion-text></ion-label>
+        <ion-spinner style="display: block; margin: auto;" name="lines" color="dark" *ngIf="$newVersionLoading$ | async"></ion-spinner>
+      </ion-item>
+
       <ion-item-divider class="divider">Description</ion-item-divider>
       <ion-item lines="none">
         <ion-label class="ion-text-wrap">
@@ -90,13 +97,6 @@
         </ion-label>
       </ion-item>
 
-      <ion-item-divider>Release Notes</ion-item-divider>
-      <ion-item lines="none" button details="true" [disabled]="" (click)="presentModalReleaseNotes()" [disabled]="$newVersionLoading$ | async">
-        <ion-icon slot="start" name="newspaper-outline" color="medium"></ion-icon>
-        <ion-label *ngIf="!($newVersionLoading$ | async)"><ion-text color="medium">New in {{ vars.versionViewing | displayEmver }}</ion-text></ion-label>
-        <ion-spinner style="display: block; margin: auto;" name="lines" color="dark" *ngIf="$newVersionLoading$ | async"></ion-spinner>
-      </ion-item>
-
       <ng-container *ngIf="(vars.serviceRequirements)?.length">
         <ion-item-divider class="divider">Service Dependencies
           <ion-button style="position: relative; right: 10px;" size="small" fill="clear" color="medium"  (click)="presentPopover(serviceDependencyDefintion, $event)">

ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.ts

@@ -1,10 +1,10 @@
-import { Component, HostListener, NgZone } from '@angular/core'
+import { Component, NgZone } from '@angular/core'
 import { ActivatedRoute } from '@angular/router'
-import { AppAvailableFull, AppAvailableVersionSpecificInfo, AppDependency } from 'src/app/models/app-types'
+import { AppAvailableFull, AppAvailableVersionSpecificInfo } from 'src/app/models/app-types'
 import { ApiService } from 'src/app/services/api/api.service'
 import { AlertController, ModalController, NavController, PopoverController } from '@ionic/angular'
 import { markAsLoadingDuring$ } from 'src/app/services/loader.service'
-import { BehaviorSubject, from, merge, Observable, of, Subscription } from 'rxjs'
+import { BehaviorSubject, from, Observable, of } from 'rxjs'
 import { catchError, concatMap, filter, switchMap, tap } from 'rxjs/operators'
 import { Recommendation } from 'src/app/components/recommendation-button/recommendation-button.component'
 import { wizardModal } from 'src/app/components/install-wizard/install-wizard.component'
@@ -13,7 +13,6 @@ import { AppModel } from 'src/app/models/app-model'
 import { initPropertySubject, peekProperties, PropertySubject } from 'src/app/util/property-subject.util'
 import { Cleanup } from 'src/app/util/cleanup'
 import { InformationPopoverComponent } from 'src/app/components/information-popover/information-popover.component'
-import { pauseFor } from 'src/app/util/misc.util'
 import { AppReleaseNotesPage } from 'src/app/modals/app-release-notes/app-release-notes.page'
 import { Emver } from 'src/app/services/emver.service'
 import { displayEmver } from 'src/app/pipes/emver.pipe'

ui/src/app/pages/server-routes/server-show/server-show.page.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core'
 import { LoadingOptions } from '@ionic/core'
 import { ServerModel, ServerStatus } from 'src/app/models/server-model'
-import { AlertController } from '@ionic/angular'
+import { AlertController, ModalController } from '@ionic/angular'
 import { S9Server } from 'src/app/models/server-model'
 import { ApiService } from 'src/app/services/api/api.service'
 import { SyncDaemon } from 'src/app/services/sync.service'
@@ -10,6 +10,8 @@ import { PropertySubject, toObservable } from 'src/app/util/property-subject.uti
 import { doForAtLeast } from 'src/app/util/misc.util'
 import { LoaderService } from 'src/app/services/loader.service'
 import { Emver } from 'src/app/services/emver.service'
+import { wizardModal } from 'src/app/components/install-wizard/install-wizard.component'
+import { WizardBaker } from 'src/app/components/install-wizard/prebaked-wizards'
 
 @Component({
   selector: 'server-show',
@@ -35,6 +37,8 @@ export class ServerShowPage {
     private readonly apiService: ApiService,
     private readonly syncDaemon: SyncDaemon,
     private readonly emver: Emver,
+    private readonly modalCtrl: ModalController,
+    private readonly wizardBaker: WizardBaker,
   ) { }
 
   async ngOnInit () {
@@ -83,9 +87,9 @@ export class ServerShowPage {
     await loader.present()
 
     try {
-      const { versionLatest } = await this.apiService.getVersionLatest()
+      const { versionLatest, releaseNotes } = await this.apiService.getVersionLatest()
       if (this.emver.compare(this.server.versionInstalled.getValue(), versionLatest) === -1) {
-        this.presentAlertUpdate(versionLatest)
+        this.presentAlertUpdate(versionLatest, releaseNotes)
       } else {
         this.presentAlertUpToDate()
       }
@@ -106,7 +110,7 @@ export class ServerShowPage {
     await alert.present()
   }
 
-  async presentAlertUpdate (versionLatest: string) {
+  async presentAlertUpdate (versionLatest: string, releaseNotes: string) {
     const alert = await this.alertCtrl.create({
       backdropDismiss: false,
       header: 'Confirm',
@@ -119,7 +123,7 @@ export class ServerShowPage {
         {
           text: 'Update',
           handler: () => {
-            this.updateEmbassyOS(versionLatest)
+            this.updateEmbassyOS(versionLatest, releaseNotes)
           },
         },
       ],
@@ -171,17 +175,18 @@ export class ServerShowPage {
     await alert.present()
   }
 
-  private async updateEmbassyOS (versionLatest: string) {
-    this.loader
-        .displayDuringAsync(async () => {
-          await this.apiService.updateAgent(versionLatest)
-          this.serverModel.update({ status: ServerStatus.UPDATING })
-          // hides the "Update Embassy to..." button for this intance of the component
-          this.updatingFreeze = true
-          this.updating = true
-          setTimeout(() => this.updatingFreeze = false, 8000)
-        })
-        .catch(e => this.setError(e))
+  private async updateEmbassyOS (versionLatest: string, releaseNotes: string) {
+    const { cancelled } = await wizardModal(
+      this.modalCtrl,
+      this.wizardBaker.updateOS({
+        version: versionLatest,
+        releaseNotes: releaseNotes,
+      }),
+    )
+    if (cancelled) return
+    this.updatingFreeze = true
+    this.updating = true
+    setTimeout(() => this.updatingFreeze = false, 8000)
   }
 
   private async restart () {