Integration/0.2.13 (#324)

* updates to 8.10.4, adjusts dependencies, adds license info feature

* add toJSON

* add licesne info to services

* remove mocks

* adds license info to available show

* prepare upgrade messaging

* better welcome message

* update backend versioning to 0.2.13

* add version migration file

* update ui build scripts

* update eos image

* update eos image with embassy

* add migration files

* update welcome page

* explicity add migration files

Co-authored-by: Keagan McClelland <keagan.mcclelland@gmail.com>
Co-authored-by: Lucy Cifferello <12953208+elvece@users.noreply.github.com>

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

@@ -21,6 +21,26 @@
       <ion-text class="ion-text-wrap" color="danger">{{ error }}</ion-text>
     </ion-item>
 
+    <ion-card *ngIf="v1Status.status === 'instructions'" [href]="'https://start9.com/eos-' + v1Status.version" target="_blank" class="instructions-card">
+      <ion-card-header>
+        <ion-card-subtitle>Coming Soon...</ion-card-subtitle>
+        <ion-card-title>EmbassyOS Version {{ v1Status.version }}</ion-card-title>
+      </ion-card-header>
+      <ion-card-content>
+        <b>Get ready. View the update instructions.</b>
+      </ion-card-content>
+    </ion-card>
+
+    <ion-card *ngIf="v1Status.status === 'available'" [href]="'https://start9.com/eos-' + v1Status.version" target="_blank" class="available-card">
+      <ion-card-header>
+        <ion-card-subtitle>Now Available...</ion-card-subtitle>
+        <ion-card-title>EmbassyOS Version {{ v1Status.version }}</ion-card-title>
+      </ion-card-header>
+      <ion-card-content>
+        <b>View the update instructions.</b>
+      </ion-card-content>
+    </ion-card>
+
     <ion-card *ngFor="let app of apps" style="margin: 10px 10px;" [routerLink]="[app.id]">
       <ion-item style="--inner-border-width: 0 0 .4px 0; --border-color: #525252;" *ngIf="{ installing: (app.subject.status | async) === 'INSTALLING', installComparison: app.subject | compareInstalledAndLatest | async } as l">
         <ion-avatar style="margin-top: 8px;" slot="start">

ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.scss

@@ -3,4 +3,14 @@
   font-style: italic;
   font-family: 'Open Sans';
   padding: 1px 0px 1.5px 0px;
+}
+
+.instructions-card {
+  --background: linear-gradient(45deg, #101010 16%, var(--ion-color-medium) 150%);
+  margin: 16px 10px;
+}
+
+.available-card {
+  --background: linear-gradient(45deg, #101010 16%, var(--ion-color-danger) 150%);
+  margin: 16px 10px;
 }

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

@@ -8,6 +8,7 @@ import { Subscription, BehaviorSubject, combineLatest } from 'rxjs'
 import { take } from 'rxjs/operators'
 import { markAsLoadingDuringP } from 'src/app/services/loader.service'
 import { OsUpdateService } from 'src/app/services/os-update.service'
+import { V1Status } from 'src/app/services/api/api-types'
 
 @Component({
   selector: 'app-available-list',
@@ -20,6 +21,7 @@ export class AppAvailableListPage {
   installedAppDeltaSubscription: Subscription
   apps: PropertySubjectId<AppAvailablePreview>[] = []
   appsInstalled: PropertySubjectId<AppInstalledPreview>[] = []
+  v1Status: V1Status = { status: 'nothing', version: '' }
 
   constructor (
     private readonly apiService: ApiService,
@@ -35,6 +37,7 @@ export class AppAvailableListPage {
 
     markAsLoadingDuringP(this.$loading$, Promise.all([
       this.getApps(),
+      this.checkV1Status(),
       this.osUpdateService.checkWhenNotAvailable$().toPromise(), // checks for an os update, banner component renders conditionally
       pauseFor(600),
     ]))
@@ -44,6 +47,14 @@ export class AppAvailableListPage {
     this.appModel.getContents().forEach(appInstalled => this.mergeInstalledProps(appInstalled.id))
   }
 
+  async checkV1Status () {
+    try {
+      this.v1Status = await this.apiService.checkV1Status()
+    } catch (e) {
+      console.error(e)
+    }
+  }
+
   mergeInstalledProps (appInstalledId: string) {
     const appAvailable  = this.apps.find(app => app.id === appInstalledId)
     if (!appAvailable) return

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

@@ -17,6 +17,8 @@
     versionInstalled: $app$.versionInstalled | async,
     versionViewing: $app$.versionViewing | async,
     descriptionLong: $app$.descriptionLong | async,
+    licenseName: $app$.licenseName | async,
+    licenseLink: $app$.licenseLink | async,
     serviceRequirements: $app$.serviceRequirements | async,
     iconURL: $app$.iconURL | async,
     releaseNotes: $app$.releaseNotes | async
@@ -112,9 +114,14 @@
         <dependency-list [$loading$]="$dependenciesLoading$" [hostApp]="$app$ | peekProperties" [dependencies]="vars.serviceRequirements"></dependency-list>
       </ng-container>
       <ion-item-divider></ion-item-divider>
+      <ion-item *ngIf="vars.licenseLink" lines="none" button [href]="vars.licenseLink" target="_blank">
+        <ion-icon slot="start" name="newspaper-outline"></ion-icon>
+        <ion-label>License</ion-label>
+        <ion-note slot="end">{{ vars.licenseName }}</ion-note>
+      </ion-item>
       <ion-item lines="none" button (click)="presentAlertVersions()">
-        <ion-icon color="medium" slot="start" name="file-tray-stacked-outline"></ion-icon>
-        <ion-label color="medium">Other versions</ion-label>
+        <ion-icon slot="start" name="file-tray-stacked-outline"></ion-icon>
+        <ion-label>Other versions</ion-label>
       </ion-item>
     </ion-item-group>
   </ng-container>

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

@@ -15,6 +15,8 @@
      torAddress: app.torAddress | async,
      status: app.status | async,
      versionInstalled: app.versionInstalled | async,
+     licenseName: app.licenseName | async,
+     licenseLink: app.licenseLink | async,
      configuredRequirements: app.configuredRequirements | async,
      lastBackup: app.lastBackup | async,
      hasFetchedFull: app.hasFetchedFull | async,
@@ -157,6 +159,12 @@
           <ion-icon slot="start" name="storefront-outline" color="primary"></ion-icon>
           <ion-label><ion-text color="primary">Marketplace Listing</ion-text></ion-label>
         </ion-item>
+        <!-- license -->
+        <ion-item *ngIf="vars.licenseLink" lines="none" button [href]="vars.licenseLink" target="_blank">
+          <ion-icon slot="start" name="newspaper-outline" color="primary"></ion-icon>
+          <ion-label><ion-text color="primary">License</ion-text></ion-label>
+          <ion-note slot="end">{{ vars.licenseName }}</ion-note>
+        </ion-item>
 
         <!-- dependencies -->
         <ng-container *ngIf="vars.configuredRequirements && vars.configuredRequirements.length">