From 54a65e465a78fe0d4e59b65a5e972ee6a0c09643 Mon Sep 17 00:00:00 2001 From: Matt Hill Date: Fri, 22 Oct 2021 10:00:51 -0600 Subject: [PATCH] better backup reports --- ui/src/app/app.component.html | 1 + .../backup-report/backup-report.module.ts | 14 ++++++ .../backup-report/backup-report.page.html | 30 ++++++++++++ .../backup-report/backup-report.page.scss | 0 .../backup-report/backup-report.page.ts | 48 +++++++++++++++++++ ui/src/app/modals/markdown/markdown.page.html | 4 +- .../app-instructions.module.ts | 26 ---------- .../app-instructions.page.html | 16 ------- .../app-instructions.page.scss | 3 -- .../app-instructions/app-instructions.page.ts | 39 --------------- .../apps-routes/app-show/app-show.module.ts | 2 + .../apps-routes/app-show/app-show.page.ts | 15 +++++- .../pages/apps-routes/apps-routing.module.ts | 4 -- .../notifications/notifications.module.ts | 2 + .../notifications/notifications.page.html | 2 +- .../pages/notifications/notifications.page.ts | 43 ++++------------- ui/src/app/services/api/api.fixures.ts | 4 +- .../app/services/patch-db/patch-db.service.ts | 2 - 18 files changed, 125 insertions(+), 130 deletions(-) create mode 100644 ui/src/app/modals/backup-report/backup-report.module.ts create mode 100644 ui/src/app/modals/backup-report/backup-report.page.html create mode 100644 ui/src/app/modals/backup-report/backup-report.page.scss create mode 100644 ui/src/app/modals/backup-report/backup-report.page.ts delete mode 100644 ui/src/app/pages/apps-routes/app-instructions/app-instructions.module.ts delete mode 100644 ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.html delete mode 100644 ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.scss delete mode 100644 ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.ts diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 5f60563e9..19b4fa829 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -103,6 +103,7 @@ + diff --git a/ui/src/app/modals/backup-report/backup-report.module.ts b/ui/src/app/modals/backup-report/backup-report.module.ts new file mode 100644 index 000000000..16e635e28 --- /dev/null +++ b/ui/src/app/modals/backup-report/backup-report.module.ts @@ -0,0 +1,14 @@ +import { NgModule } from '@angular/core' +import { CommonModule } from '@angular/common' +import { IonicModule } from '@ionic/angular' +import { BackupReportPage } from './backup-report.page' + +@NgModule({ + declarations: [BackupReportPage], + imports: [ + CommonModule, + IonicModule, + ], + exports: [BackupReportPage], +}) +export class BackupReportPageModule { } diff --git a/ui/src/app/modals/backup-report/backup-report.page.html b/ui/src/app/modals/backup-report/backup-report.page.html new file mode 100644 index 000000000..c6513352d --- /dev/null +++ b/ui/src/app/modals/backup-report/backup-report.page.html @@ -0,0 +1,30 @@ + + + Backup Report + + + + + + + + + + + Completed: {{ timestamp | date : 'short' }} + + +

System data

+

{{ system.result }}

+ + + + + +

{{ pkg.key }}

+

{{ pkg.value.error ? 'Failed: ' + pkg.value.error : 'Succeeded' }}

+ + + + + diff --git a/ui/src/app/modals/backup-report/backup-report.page.scss b/ui/src/app/modals/backup-report/backup-report.page.scss new file mode 100644 index 000000000..e69de29bb diff --git a/ui/src/app/modals/backup-report/backup-report.page.ts b/ui/src/app/modals/backup-report/backup-report.page.ts new file mode 100644 index 000000000..26c6db1e5 --- /dev/null +++ b/ui/src/app/modals/backup-report/backup-report.page.ts @@ -0,0 +1,48 @@ +import { Component, Input } from '@angular/core' +import { ModalController } from '@ionic/angular' +import { BackupReport } from 'src/app/services/api/api.types' + +@Component({ + selector: 'backup-report', + templateUrl: './backup-report.page.html', + styleUrls: ['./backup-report.page.scss'], +}) +export class BackupReportPage { + @Input() report: BackupReport + @Input() timestamp: string + system: { + result: string + icon: 'remove' | 'remove-circle-outline' | 'checkmark' + color: 'dark' | 'danger' | 'success' + } + + constructor ( + private readonly modalCtrl: ModalController, + ) { } + + ngOnInit () { + if (!this.report.server.attempted) { + this.system = { + result: 'Not Attempted', + icon: 'remove', + color: 'dark', + } + } else if (this.report.server.error) { + this.system = { + result: `Failed: ${this.report.server.error}`, + icon: 'remove-circle-outline', + color: 'danger', + } + } else { + this.system = { + result: 'Succeeded', + icon: 'checkmark', + color: 'success', + } + } + } + + async dismiss () { + return this.modalCtrl.dismiss(true) + } +} diff --git a/ui/src/app/modals/markdown/markdown.page.html b/ui/src/app/modals/markdown/markdown.page.html index e300412fc..146a315eb 100644 --- a/ui/src/app/modals/markdown/markdown.page.html +++ b/ui/src/app/modals/markdown/markdown.page.html @@ -1,11 +1,11 @@ - + {{ title | titlecase }} + - {{ title | titlecase }} diff --git a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.module.ts b/ui/src/app/pages/apps-routes/app-instructions/app-instructions.module.ts deleted file mode 100644 index 0225b2fdc..000000000 --- a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.module.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { NgModule } from '@angular/core' -import { CommonModule } from '@angular/common' -import { Routes, RouterModule } from '@angular/router' -import { IonicModule } from '@ionic/angular' -import { AppInstructionsPage } from './app-instructions.page' -import { SharingModule } from 'src/app/modules/sharing.module' - -const routes: Routes = [ - { - path: '', - component: AppInstructionsPage, - }, -] - -@NgModule({ - imports: [ - CommonModule, - IonicModule, - RouterModule.forChild(routes), - SharingModule, - ], - declarations: [ - AppInstructionsPage, - ], -}) -export class AppInstructionsPageModule { } diff --git a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.html b/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.html deleted file mode 100644 index a21ad8d1b..000000000 --- a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - - Instructions - - - - - - - -
- - \ No newline at end of file diff --git a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.scss b/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.scss deleted file mode 100644 index 748913e67..000000000 --- a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.scss +++ /dev/null @@ -1,3 +0,0 @@ -.instructions-padding { - padding: 0 16px 16px 16px -} \ No newline at end of file diff --git a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.ts b/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.ts deleted file mode 100644 index a4ee75e28..000000000 --- a/ui/src/app/pages/apps-routes/app-instructions/app-instructions.page.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { Component, ViewChild } from '@angular/core' -import { ActivatedRoute } from '@angular/router' -import { IonContent } from '@ionic/angular' -import { PatchDbService } from 'src/app/services/patch-db/patch-db.service' -import { ApiService } from 'src/app/services/api/embassy-api.service' -import { ErrorToastService } from 'src/app/services/error-toast.service' - -@Component({ - selector: 'app-instructions', - templateUrl: './app-instructions.page.html', - styleUrls: ['./app-instructions.page.scss'], -}) -export class AppInstructionsPage { - instructions: string - loading = true - - @ViewChild(IonContent) content: IonContent - - constructor ( - private readonly route: ActivatedRoute, - private readonly errToast: ErrorToastService, - private readonly embassyApi: ApiService, - private readonly patch: PatchDbService, - ) { } - - async ngOnInit () { - const pkgId = this.route.snapshot.paramMap.get('pkgId') - - const url = this.patch.getData()['package-data'][pkgId]['static-files'].instructions - - try { - this.instructions = await this.embassyApi.getStatic(url) - } catch (e) { - this.errToast.present(e) - } finally { - this.loading = false - } - } -} diff --git a/ui/src/app/pages/apps-routes/app-show/app-show.module.ts b/ui/src/app/pages/apps-routes/app-show/app-show.module.ts index 8e8afa59f..86d0afe9e 100644 --- a/ui/src/app/pages/apps-routes/app-show/app-show.module.ts +++ b/ui/src/app/pages/apps-routes/app-show/app-show.module.ts @@ -7,6 +7,7 @@ import { StatusComponentModule } from 'src/app/components/status/status.componen import { SharingModule } from 'src/app/modules/sharing.module' import { InstallWizardComponentModule } from 'src/app/components/install-wizard/install-wizard.component.module' import { AppConfigPageModule } from 'src/app/modals/app-config/app-config.module' +import { MarkdownPageModule } from 'src/app/modals/markdown/markdown.module' const routes: Routes = [ { @@ -24,6 +25,7 @@ const routes: Routes = [ InstallWizardComponentModule, AppConfigPageModule, SharingModule, + MarkdownPageModule, ], declarations: [AppShowPage], }) diff --git a/ui/src/app/pages/apps-routes/app-show/app-show.page.ts b/ui/src/app/pages/apps-routes/app-show/app-show.page.ts index ce3cd1104..850858e59 100644 --- a/ui/src/app/pages/apps-routes/app-show/app-show.page.ts +++ b/ui/src/app/pages/apps-routes/app-show/app-show.page.ts @@ -15,6 +15,7 @@ import { ErrorToastService } from 'src/app/services/error-toast.service' import { AppConfigPage } from 'src/app/modals/app-config/app-config.page' import { PackageLoadingService, ProgressData } from 'src/app/services/package-loading.service' import { filter } from 'rxjs/operators' +import { MarkdownPage } from 'src/app/modals/markdown/markdown.page' @Component({ selector: 'app-show', @@ -211,6 +212,18 @@ export class AppShowPage { await modal.present() } + async presentModalInstructions () { + const modal = await this.modalCtrl.create({ + componentProps: { + title: 'Instructions', + contentUrl: this.pkg['static-files']['instructions'], + }, + component: MarkdownPage, + }) + + await modal.present() + } + private setDepValues (id: string, errors: { [id: string]: DependencyError }): DependencyInfo { let errorText = '' let actionText = 'View' @@ -330,7 +343,7 @@ export class AppShowPage { this.buttons = [ // instructions { - action: () => this.navCtrl.navigateForward(['instructions'], { relativeTo: this.route }), + action: () => this.presentModalInstructions(), title: 'Instructions', description: `Understand how to use ${pkgTitle}`, icon: 'list-outline', diff --git a/ui/src/app/pages/apps-routes/apps-routing.module.ts b/ui/src/app/pages/apps-routes/apps-routing.module.ts index 4884c0f1f..8135e2c8a 100644 --- a/ui/src/app/pages/apps-routes/apps-routing.module.ts +++ b/ui/src/app/pages/apps-routes/apps-routing.module.ts @@ -19,10 +19,6 @@ const routes: Routes = [ path: ':pkgId/actions', loadChildren: () => import('./app-actions/app-actions.module').then(m => m.AppActionsPageModule), }, - { - path: ':pkgId/instructions', - loadChildren: () => import('./app-instructions/app-instructions.module').then(m => m.AppInstructionsPageModule), - }, { path: ':pkgId/interfaces', loadChildren: () => import('./app-interfaces/app-interfaces.module').then(m => m.AppInterfacesPageModule), diff --git a/ui/src/app/pages/notifications/notifications.module.ts b/ui/src/app/pages/notifications/notifications.module.ts index 63195890e..5b5feed93 100644 --- a/ui/src/app/pages/notifications/notifications.module.ts +++ b/ui/src/app/pages/notifications/notifications.module.ts @@ -5,6 +5,7 @@ import { RouterModule, Routes } from '@angular/router' import { NotificationsPage } from './notifications.page' import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/badge-menu.component.module' import { SharingModule } from 'src/app/modules/sharing.module' +import { BackupReportPageModule } from 'src/app/modals/backup-report/backup-report.module' const routes: Routes = [ { @@ -20,6 +21,7 @@ const routes: Routes = [ RouterModule.forChild(routes), BadgeMenuComponentModule, SharingModule, + BackupReportPageModule, ], declarations: [NotificationsPage], }) diff --git a/ui/src/app/pages/notifications/notifications.page.html b/ui/src/app/pages/notifications/notifications.page.html index 54337b3b0..8cf0ed46d 100644 --- a/ui/src/app/pages/notifications/notifications.page.html +++ b/ui/src/app/pages/notifications/notifications.page.html @@ -66,7 +66,7 @@

{{ not.message }} - View Report + - View Report

diff --git a/ui/src/app/pages/notifications/notifications.page.ts b/ui/src/app/pages/notifications/notifications.page.ts index 1fac97c0a..e73d58b9d 100644 --- a/ui/src/app/pages/notifications/notifications.page.ts +++ b/ui/src/app/pages/notifications/notifications.page.ts @@ -1,9 +1,10 @@ import { Component } from '@angular/core' import { ApiService } from 'src/app/services/api/embassy-api.service' import { ServerNotification, ServerNotifications } from 'src/app/services/api/api.types' -import { AlertController, LoadingController, AlertButton } from '@ionic/angular' +import { LoadingController, ModalController } from '@ionic/angular' import { ActivatedRoute } from '@angular/router' import { ErrorToastService } from 'src/app/services/error-toast.service' +import { BackupReportPage } from 'src/app/modals/backup-report/backup-report.page' @Component({ selector: 'notifications', @@ -21,8 +22,8 @@ export class NotificationsPage { constructor ( private readonly embassyApi: ApiService, private readonly loadingCtrl: LoadingController, + private readonly modalCtrl: ModalController, private readonly errToast: ErrorToastService, - private readonly alertCtrl: AlertController, private readonly route: ActivatedRoute, ) { } @@ -90,40 +91,14 @@ export class NotificationsPage { } async viewBackupReport (notification: ServerNotification<1>) { - const data = notification.data - - const embassyFailed = !!data.server.error - const packagesFailed = Object.values(data.packages).some(val => val.error) - - let message: string - - if (embassyFailed || packagesFailed) { - message = 'There was an issue backing up one or more items. Click "Retry" to retry ONLY the items that failed.' - } else { - message = 'All items were successfully backed up' - } - - const buttons: AlertButton[] = [ - { - text: 'Dismiss', - role: 'cancel', + const modal = await this.modalCtrl.create({ + component: BackupReportPage, + componentProps: { + report: notification.data, + timestamp: notification['created-at'], }, - ] - - if (embassyFailed || packagesFailed) { - buttons.push({ - text: 'Retry', - }) - } - - - const alert = await this.alertCtrl.create({ - header: 'Backup Report', - message, - buttons, }) - - await alert.present() + await modal.present() } } diff --git a/ui/src/app/services/api/api.fixures.ts b/ui/src/app/services/api/api.fixures.ts index 9d6aa8422..2214ad8b1 100644 --- a/ui/src/app/services/api/api.fixures.ts +++ b/ui/src/app/services/api/api.fixures.ts @@ -740,12 +740,12 @@ export module Mock { message: 'Embassy and services have been successfully backed up.', data: { server: { - attempted: true, + attempted: false, error: null, }, packages: { 'bitcoind': { - error: null, + error: 'An error ocurred while backing up', }, }, }, diff --git a/ui/src/app/services/patch-db/patch-db.service.ts b/ui/src/app/services/patch-db/patch-db.service.ts index 9a7aa5690..bc03b004b 100644 --- a/ui/src/app/services/patch-db/patch-db.service.ts +++ b/ui/src/app/services/patch-db/patch-db.service.ts @@ -27,8 +27,6 @@ export class PatchDbService { private patchSub: Subscription data: DataModel - getData () { return this.patchDb.store.cache.data } - constructor ( @Inject(PATCH_SOURCE) private readonly source: Source, @Inject(PATCH_HTTP) private readonly http: ApiService,