From bd5668d15dfe560ddba1798fafc31fc407da391c Mon Sep 17 00:00:00 2001 From: Lucy C <12953208+elvece@users.noreply.github.com> Date: Fri, 2 Dec 2022 23:20:01 -0700 Subject: [PATCH] UI fixes (#2014) * fix html displaying in marketplace banner description * always bold install risk copy * display correct pkg in marketplace when diff registry, copy changes Co-authored-by: Matt Hill Co-authored-by: Matt Hill --- frontend/projects/marketplace/package.json | 2 +- .../src/services/marketplace.service.ts | 4 +- .../src/app/pages/loading/loading.page.ts | 32 ++----- .../src/app/pages/success/success.page.ts | 2 +- .../marketplace-list.page.html | 2 +- .../marketplace-list/marketplace-list.page.ts | 3 +- .../marketplace-show.page.html | 13 ++- .../marketplace-show/marketplace-show.page.ts | 2 +- .../src/app/services/marketplace.service.ts | 94 ++++++++++--------- 9 files changed, 78 insertions(+), 76 deletions(-) diff --git a/frontend/projects/marketplace/package.json b/frontend/projects/marketplace/package.json index 78960bd7b..f7a8d21d9 100644 --- a/frontend/projects/marketplace/package.json +++ b/frontend/projects/marketplace/package.json @@ -1,6 +1,6 @@ { "name": "@start9labs/marketplace", - "version": "0.3.7", + "version": "0.3.8", "peerDependencies": { "@angular/common": ">=13.2.0", "@angular/core": ">=13.2.0", diff --git a/frontend/projects/marketplace/src/services/marketplace.service.ts b/frontend/projects/marketplace/src/services/marketplace.service.ts index fdc42781d..af1b473d5 100644 --- a/frontend/projects/marketplace/src/services/marketplace.service.ts +++ b/frontend/projects/marketplace/src/services/marketplace.service.ts @@ -8,13 +8,13 @@ export abstract class AbstractMarketplaceService { abstract getMarketplace$(): Observable - abstract getSelectedStore$(): Observable + abstract getSelectedStore$(): Observable abstract getPackage$( id: string, version: string, url?: string, - ): Observable + ): Observable // could be {} so need to check in show page abstract fetchReleaseNotes$( id: string, diff --git a/frontend/projects/setup-wizard/src/app/pages/loading/loading.page.ts b/frontend/projects/setup-wizard/src/app/pages/loading/loading.page.ts index 18464510d..d95ed823c 100644 --- a/frontend/projects/setup-wizard/src/app/pages/loading/loading.page.ts +++ b/frontend/projects/setup-wizard/src/app/pages/loading/loading.page.ts @@ -36,28 +36,16 @@ export class ToMessagePipe implements PipeTransform { constructor(private readonly stateService: StateService) {} transform(progress: number | null): string { - switch (this.stateService.setupType) { - case 'fresh': - case 'attach': - return 'Setting up your Embassy' - case 'restore': - 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 if (progress < 1) { - return 'Transferring data' - } else { - return 'Finalizing data transfer' - } - default: - return '' + if (['fresh', 'attach'].includes(this.stateService.setupType || '')) { + return 'Setting up your Embassy' + } + + if (!progress) { + return 'Preparing data. This can take a while' + } else if (progress < 1) { + return 'Copying data' + } else { + return 'Finalizing' } } } diff --git a/frontend/projects/setup-wizard/src/app/pages/success/success.page.ts b/frontend/projects/setup-wizard/src/app/pages/success/success.page.ts index eb8238f8a..779ea3cef 100644 --- a/frontend/projects/setup-wizard/src/app/pages/success/success.page.ts +++ b/frontend/projects/setup-wizard/src/app/pages/success/success.page.ts @@ -59,7 +59,7 @@ export class SuccessPage { const ret = await this.api.complete() if (!this.isKiosk) { this.torAddress = ret['tor-address'] - this.lanAddress = ret['lan-address'] + this.lanAddress = ret['lan-address'].replace('https', 'http') this.cert = ret['root-ca'] await this.api.exit() diff --git a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html index f1511926f..ea8d4a75a 100644 --- a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html +++ b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html @@ -15,7 +15,7 @@ -

{{ details.description }}

+

diff --git a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts index 0c2970606..5a8a673dd 100644 --- a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts +++ b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts @@ -19,7 +19,6 @@ export class MarketplaceListPage { readonly back = !!this.route.snapshot.queryParamMap.get('back') readonly store$ = this.marketplaceService.getSelectedStore$().pipe( - filter(Boolean), map(({ info, packages }) => { const categories = new Set() if (info.categories.includes('featured')) categories.add('featured') @@ -57,7 +56,7 @@ export class MarketplaceListPage { // alt marketplace color = 'warning' description = - 'This is a Custom Registry. Start9 cannot verify the integrity or functionality of services from this registry, and they may cause harm to your system. Install at your own risk.' + 'This is a Custom Registry. Start9 cannot verify the integrity or functionality of services from this registry, and they may cause harm to your system. Install at your own risk.' } return { diff --git a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html index fa1e5f38f..61b687861 100644 --- a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html +++ b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html @@ -2,7 +2,16 @@ - + + +

+ {{ pkgId }} version {{ version === '*' ? 'latest' : version }} not + found in this registry +

+ + + + - + diff --git a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts index 51f376fd3..dcb6e48d1 100644 --- a/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts +++ b/frontend/projects/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts @@ -14,7 +14,7 @@ import { DataModel } from 'src/app/services/patch-db/data-model' changeDetection: ChangeDetectionStrategy.OnPush, }) export class MarketplaceShowPage { - private readonly pkgId = getPkgId(this.route) + readonly pkgId = getPkgId(this.route) readonly url = this.route.snapshot.queryParamMap.get('url') || undefined readonly loadVersion$ = new BehaviorSubject('*') diff --git a/frontend/projects/ui/src/app/services/marketplace.service.ts b/frontend/projects/ui/src/app/services/marketplace.service.ts index 5ce5283e4..05841b2b7 100644 --- a/frontend/projects/ui/src/app/services/marketplace.service.ts +++ b/frontend/projects/ui/src/app/services/marketplace.service.ts @@ -92,13 +92,13 @@ export class MarketplaceService implements AbstractMarketplaceService { shareReplay(1), ) - private readonly selectedStore$: Observable = + private readonly selectedStore$: Observable = this.selectedHost$.pipe( switchMap(({ url }) => this.marketplace$.pipe( - filter(m => !!m[url]), - take(1), map(m => m[url]), + filter(Boolean), + take(1), ), ), ) @@ -123,7 +123,7 @@ export class MarketplaceService implements AbstractMarketplaceService { return this.marketplace$ } - getSelectedStore$(): Observable { + getSelectedStore$(): Observable { return this.selectedStore$ } @@ -131,18 +131,24 @@ export class MarketplaceService implements AbstractMarketplaceService { id: string, version: string, optionalUrl?: string, - ): Observable { + ): Observable { return this.patch.watch$('ui', 'marketplace').pipe( - switchMap(marketplace => { - const url = optionalUrl || marketplace['selected-url'] + switchMap(uiMarketplace => { + const url = optionalUrl || uiMarketplace['selected-url'] - if (version !== '*' || !marketplace['known-hosts'][url]) { + if (version !== '*' || !uiMarketplace['known-hosts'][url]) { return this.fetchPackage$(id, version, url) } - return this.selectedStore$.pipe( + return this.marketplace$.pipe( + map(m => m[url]), filter(Boolean), - map(s => s.packages.find(p => p.manifest.id === id)), + take(1), + map( + store => + store.packages.find(p => p.manifest.id === id) || + ({} as MarketplacePkg), + ), ) }), ) @@ -184,6 +190,37 @@ export class MarketplaceService implements AbstractMarketplaceService { ) } + fetchReleaseNotes$( + id: string, + url?: string, + ): Observable> { + return this.selectedHost$.pipe( + switchMap(m => { + return from( + this.api.marketplaceProxy>( + `/package/v0/release-notes/${id}`, + {}, + url || m.url, + ), + ) + }), + ) + } + + fetchStatic$(id: string, type: string, url?: string): Observable { + return this.selectedHost$.pipe( + switchMap(m => { + return from( + this.api.marketplaceProxy( + `/package/v0/${type}/${id}`, + {}, + url || m.url, + ), + ) + }), + ) + } + private fetchStore$(url: string): Observable { return combineLatest([this.fetchInfo$(url), this.fetchPackages$(url)]).pipe( map(([info, packages]) => ({ info, packages })), @@ -221,44 +258,13 @@ export class MarketplaceService implements AbstractMarketplaceService { ) } - fetchPackage$( + private fetchPackage$( id: string, version: string, url: string, - ): Observable { + ): Observable { return this.fetchPackages$(url, { ids: [{ id, version }] }).pipe( - map(pkgs => pkgs[0]), - ) - } - - fetchReleaseNotes$( - id: string, - url?: string, - ): Observable> { - return this.selectedHost$.pipe( - switchMap(m => { - return from( - this.api.marketplaceProxy>( - `/package/v0/release-notes/${id}`, - {}, - url || m.url, - ), - ) - }), - ) - } - - fetchStatic$(id: string, type: string, url?: string): Observable { - return this.selectedHost$.pipe( - switchMap(m => { - return from( - this.api.marketplaceProxy( - `/package/v0/${type}/${id}`, - {}, - url || m.url, - ), - ) - }), + map(pkgs => pkgs[0] || {}), ) }