diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index cd53f9547..1746d192f 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -15,6 +15,7 @@ import { ConfigService } from './services/config.service' import { QRCodeModule } from 'angularx-qrcode' import { APP_CONFIG_COMPONENT_MAPPING } from './modals/app-config-injectable/modal-injectable-token' import { appConfigComponents } from './modals/app-config-injectable/modal-injectable-value'; +import { OSWelcomePageModule } from './modals/os-welcome/os-welcome.module' @NgModule({ declarations: [AppComponent], @@ -26,6 +27,7 @@ import { appConfigComponents } from './modals/app-config-injectable/modal-inject AppRoutingModule, IonicStorageModule.forRoot(), QRCodeModule, + OSWelcomePageModule, ], providers: [ { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }, diff --git a/ui/src/app/modals/os-welcome/os-welcome.module.ts b/ui/src/app/modals/os-welcome/os-welcome.module.ts new file mode 100644 index 000000000..30dbd1773 --- /dev/null +++ b/ui/src/app/modals/os-welcome/os-welcome.module.ts @@ -0,0 +1,15 @@ +import { NgModule } from '@angular/core' +import { CommonModule } from '@angular/common' +import { IonicModule } from '@ionic/angular' +import { OSWelcomePage } from './os-welcome.page' +import { SharingModule } from 'src/app/modules/sharing.module' + +@NgModule({ + imports: [ + CommonModule, + IonicModule, + SharingModule, + ], + declarations: [OSWelcomePage], +}) +export class OSWelcomePageModule { } diff --git a/ui/src/app/modals/os-welcome/os-welcome.page.html b/ui/src/app/modals/os-welcome/os-welcome.page.html new file mode 100644 index 000000000..92a268261 --- /dev/null +++ b/ui/src/app/modals/os-welcome/os-welcome.page.html @@ -0,0 +1,14 @@ + + + + + + + + Welcome to {{ version }} + + + + + Here is some cool shit. + \ No newline at end of file diff --git a/ui/src/app/modals/os-welcome/os-welcome.page.scss b/ui/src/app/modals/os-welcome/os-welcome.page.scss new file mode 100644 index 000000000..e69de29bb diff --git a/ui/src/app/modals/os-welcome/os-welcome.page.ts b/ui/src/app/modals/os-welcome/os-welcome.page.ts new file mode 100644 index 000000000..27bd863f5 --- /dev/null +++ b/ui/src/app/modals/os-welcome/os-welcome.page.ts @@ -0,0 +1,19 @@ +import { Component, Input } from '@angular/core' +import { ModalController } from '@ionic/angular' + +@Component({ + selector: 'os-welcome', + templateUrl: './os-welcome.page.html', + styleUrls: ['./os-welcome.page.scss'], +}) +export class OSWelcomePage { + @Input() version: string + + constructor ( + private readonly modalCtrl: ModalController, + ) { } + + dismiss () { + this.modalCtrl.dismiss() + } +} diff --git a/ui/src/app/models/server-model.ts b/ui/src/app/models/server-model.ts index bcee0c2cf..9bf12fa70 100644 --- a/ui/src/app/models/server-model.ts +++ b/ui/src/app/models/server-model.ts @@ -105,6 +105,7 @@ export class ServerModel { wifi: { ssids: [], current: undefined }, ssh: [], notifications: [], + welcomeSeen: true, }) } } @@ -122,6 +123,7 @@ export interface S9Server { wifi: { ssids: string[], current: string } ssh: SSHFingerprint[] notifications: S9Notification[] + welcomeSeen: boolean } export interface S9Notification { diff --git a/ui/src/app/services/sync.notifier.ts b/ui/src/app/services/sync.notifier.ts index 0cd75fd7b..06a0902aa 100644 --- a/ui/src/app/services/sync.notifier.ts +++ b/ui/src/app/services/sync.notifier.ts @@ -1,18 +1,27 @@ import { Injectable } from '@angular/core' -import { ToastController, NavController } from '@ionic/angular' +import { ConfigService } from 'src/app/services/config.service' +import { ToastController, NavController, ModalController } from '@ionic/angular' import { ServerModel, S9Server } from '../models/server-model' +import { OSWelcomePage } from '../modals/os-welcome/os-welcome.page' @Injectable({ providedIn: 'root', }) export class SyncNotifier { constructor ( + private readonly config: ConfigService, private readonly toastCtrl: ToastController, + private readonly modalCtrl: ModalController, private readonly navCtrl: NavController, private readonly serverModel: ServerModel, ) { } - async handleNotifications (server: Readonly): Promise { + async handleSpecial (server: Readonly): Promise { + this.handleNotifications(server) + this.handleOSWelcome(server) + } + + private async handleNotifications (server: Readonly) { const count = server.notifications.length if (!count) { return } @@ -47,4 +56,19 @@ export class SyncNotifier { await toast.present() this.serverModel.update(updates) } + + private async handleOSWelcome(server: Readonly) { + if (server.welcomeSeen || server.versionInstalled !== this.config.version) return + + const modal = await this.modalCtrl.create({ + backdropDismiss: false, + component: OSWelcomePage, + presentingElement: await this.modalCtrl.getTop(), + componentProps: { + version: server.versionInstalled + }, + }) + + await modal.present() + } } diff --git a/ui/src/app/services/sync.service.ts b/ui/src/app/services/sync.service.ts index 59dbd2d30..d7ad8645b 100644 --- a/ui/src/app/services/sync.service.ts +++ b/ui/src/app/services/sync.service.ts @@ -35,7 +35,7 @@ export class SyncDaemon { stop () { this.$sync$.next(false) } sync (): Observable { return from(this.getServerAndApps()).pipe( - concatMap(() => this.syncNotifier.handleNotifications(this.serverModel.peek())), + concatMap(() => this.syncNotifier.handleSpecial(this.serverModel.peek())), tap(() => this.$synced$.next()), catchError(e => of(console.error(`Exception in sync service`, e))), )