diff --git a/ui/src/app/app-routing.module.ts b/ui/src/app/app-routing.module.ts
index 8d5fad4d2..dfb54cdfc 100644
--- a/ui/src/app/app-routing.module.ts
+++ b/ui/src/app/app-routing.module.ts
@@ -27,6 +27,12 @@ const routes: Routes = [
canActivate: [AuthGuard, UnmaintenanceGuard],
loadChildren: () => import('./pages/maintenance/maintenance.module').then(m => m.MaintenancePageModule),
},
+ {
+ path: 'marketplace',
+ canActivate: [AuthGuard, MaintenanceGuard],
+ canActivateChild: [AuthGuard, MaintenanceGuard],
+ loadChildren: () => import('./pages/marketplace-routes/marketplace-routing.module').then(m => m.MarketplaceRoutingModule),
+ },
{
path: 'notifications',
canActivate: [AuthGuard, MaintenanceGuard],
diff --git a/ui/src/app/app.component.scss b/ui/src/app/app.component.scss
index dbacbb664..e3d6ad8bc 100644
--- a/ui/src/app/app.component.scss
+++ b/ui/src/app/app.component.scss
@@ -1,5 +1,5 @@
.selected {
- --background: linear-gradient(120deg, #1e1e1e -1%, var(--ion-color-start9) 96%);
+ --background: linear-gradient(120deg, #1e1e1e -1%, var(--ion-color-start9) 100%);
}
.menu-style {
@@ -10,4 +10,8 @@
.selected-badge {
background-color: #1e1e1e;
+}
+
+ion-split-pane {
+ --side-max-width: 280px;
}
\ No newline at end of file
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts
index 2930ed227..568843242 100644
--- a/ui/src/app/app.component.ts
+++ b/ui/src/app/app.component.ts
@@ -28,7 +28,7 @@ export class AppComponent {
appPages = [
{
title: 'Services',
- url: '/services/installed',
+ url: '/services',
icon: 'grid-outline',
},
{
@@ -38,7 +38,7 @@ export class AppComponent {
},
{
title: 'Marketplace',
- url: '/services/marketplace',
+ url: '/marketplace',
icon: 'storefront-outline',
},
{
diff --git a/ui/src/app/components/status/status.component.html b/ui/src/app/components/status/status.component.html
index 19737a908..e4f1a2925 100644
--- a/ui/src/app/components/status/status.component.html
+++ b/ui/src/app/components/status/status.component.html
@@ -1,24 +1,9 @@
-
- {{ display }}
+
+ {{ display }}
-
-
- {{ display }}
-
-
-
-
- {{ display }}
-
-
-
-
- {{ display }}
-
-
-
-
- {{ display }}
-
-
diff --git a/ui/src/app/components/status/status.component.scss b/ui/src/app/components/status/status.component.scss
index 7a81c76eb..18f7ad769 100644
--- a/ui/src/app/components/status/status.component.scss
+++ b/ui/src/app/components/status/status.component.scss
@@ -1,17 +1,5 @@
-.icon-small {
- width: auto;
- height: 14px;
- padding-left: 6px;
-}
-
-.icon-medium {
- width: auto;
- height: 18px;
- padding-left: 8px;
-}
-
-.icon-large {
- width: auto;
- height: 24px;
- padding-left: 12px;
+p {
+ margin: 0;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
diff --git a/ui/src/app/components/status/status.component.ts b/ui/src/app/components/status/status.component.ts
index a9dff2c97..07783c7d6 100644
--- a/ui/src/app/components/status/status.component.ts
+++ b/ui/src/app/components/status/status.component.ts
@@ -11,7 +11,9 @@ import { renderPkgStatus } from 'src/app/services/pkg-status-rendering.service'
export class StatusComponent {
@Input() pkg: PackageDataEntry
@Input() connection: ConnectionState
- @Input() size: 'small' | 'medium' | 'large' | 'italics-small' | 'bold-large' = 'large'
+ @Input() size?: 'small' | 'medium' | 'large' = 'large'
+ @Input() style?: string = 'regular'
+ @Input() weight?: string = 'normal'
display = ''
color = ''
showDots = false
diff --git a/ui/src/app/pages/apps-routes/app-actions/app-actions.page.ts b/ui/src/app/pages/apps-routes/app-actions/app-actions.page.ts
index ce1e4a2fc..d7b8945e5 100644
--- a/ui/src/app/pages/apps-routes/app-actions/app-actions.page.ts
+++ b/ui/src/app/pages/apps-routes/app-actions/app-actions.page.ts
@@ -89,7 +89,7 @@ export class AppActionsPage {
)
if (data.cancelled) return
- return this.navCtrl.navigateRoot('/services/installed')
+ return this.navCtrl.navigateRoot('/services')
}
private async executeAction (pkgId: string, actionId: string) {
diff --git a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.html b/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.html
deleted file mode 100644
index 37bc86756..000000000
--- a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.html
+++ /dev/null
@@ -1,161 +0,0 @@
-
-
-
-
-
- Listing
-
-
-
-
-
-
-
-
-
-
-
-
- {{ error }}
-
-
-
-
-
-
-
-
-
- {{ pkg.manifest.title }}
- {{ pkg.manifest.version | displayEmver }}
-
-
- Not Installed
-
-
-
-
-
- {{ localPkg.state }}
-
-
-
-
-
- Installed at {{ localPkg.installed.manifest.version | displayEmver }}
-
-
-
-
-
-
-
-
-
- Install
-
-
-
-
-
-
-
- Go to Service
-
-
-
-
- Update to {{ pkg.manifest.version | displayEmver }}
-
-
- Downgrade to {{ pkg.manifest.version | displayEmver }}
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ rec.dependentTitle }}
-
-
-
{{ rec.description }}
-
{{ pkg.manifest.title }} version {{ pkg.manifest.version | displayEmver }} is compatible.
-
{{ pkg.manifest.title }} version {{ pkg.manifest.version | displayEmver }} is NOT compatible.
-
-
-
-
-
-
-
-
-
-
- New in {{ pkg.manifest.version | displayEmver }}
-
- Version History
-
-
-
-
-
-
-
-
-
-
- Description
-
-
-
-
- {{ pkg.manifest.description.long }}
-
-
-
-
-
-
- Service Dependencies
-
-
-
-
-
-
-
-
-
-
-
-
- {{ pkg['dependency-metadata'][dep.key].title }}
- (recommended)
-
- {{ dep.value.version | displayEmver }}
-
-
-
-
-
-
-
-
-
-
-
-
-
- Other versions
-
-
-
-
-
\ No newline at end of file
diff --git a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.scss b/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.scss
deleted file mode 100644
index 20dc5bd27..000000000
--- a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-.recommendation-text {
- font-style: italic;
-}
-
-.recommendation-error {
- color: var(--ion-color-danger);
-}
-
-.main-action-button {
- margin: 20px 5px 20px 5px;
-}
-
-.divider {
- margin-top: 15px;
- color: var(--ion-color-medium);
- font-size: medium;
- padding-left: 10px;
- font-weight: unset;
-}
-
-#release-notes {
- overflow: auto;
- max-height: 160px;
-}
\ No newline at end of file
diff --git a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.module.ts b/ui/src/app/pages/apps-routes/app-list/app-list.module.ts
similarity index 80%
rename from ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.module.ts
rename to ui/src/app/pages/apps-routes/app-list/app-list.module.ts
index 298daed57..393e0bd51 100644
--- a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.module.ts
+++ b/ui/src/app/pages/apps-routes/app-list/app-list.module.ts
@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { Routes, RouterModule } from '@angular/router'
import { IonicModule } from '@ionic/angular'
-import { AppInstalledListPage } from './app-installed-list.page'
+import { AppListPage } from './app-list.page'
import { StatusComponentModule } from 'src/app/components/status/status.component.module'
import { SharingModule } from 'src/app/modules/sharing.module'
import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/badge-menu.component.module'
@@ -10,7 +10,7 @@ import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/b
const routes: Routes = [
{
path: '',
- component: AppInstalledListPage,
+ component: AppListPage,
},
]
@@ -24,7 +24,7 @@ const routes: Routes = [
BadgeMenuComponentModule,
],
declarations: [
- AppInstalledListPage,
+ AppListPage,
],
})
-export class AppInstalledListPageModule { }
+export class AppListPageModule { }
diff --git a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.html b/ui/src/app/pages/apps-routes/app-list/app-list.page.html
similarity index 84%
rename from ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.html
rename to ui/src/app/pages/apps-routes/app-list/app-list.page.html
index db9619b7e..4f3de538e 100644
--- a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.html
+++ b/ui/src/app/pages/apps-routes/app-list/app-list.page.html
@@ -15,7 +15,7 @@
Welcome to your Embassy
Get started by installing your first service.
-
+
Marketplace
@@ -24,10 +24,10 @@
-
-
+
+
-
@@ -40,8 +40,8 @@
-
- {{ (pkg.value | manifest).title }}
+
+ {{ (pkg.value | manifest).title }}
diff --git a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.scss b/ui/src/app/pages/apps-routes/app-list/app-list.page.scss
similarity index 85%
rename from ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.scss
rename to ui/src/app/pages/apps-routes/app-list/app-list.page.scss
index 9721ccccc..60733179d 100644
--- a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.scss
+++ b/ui/src/app/pages/apps-routes/app-list/app-list.page.scss
@@ -5,21 +5,16 @@
text-align: center;
ion-card-header {
- padding: 0;
+ padding: 0 10px;
status {
- font-size: 9px;
- font-weight: bold;
white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
}
- p {
- font-family: 'Montserrat';
- font-size: 11px;
+ ion-card-title {
+ font-size: calc(8px + .7vw);
color: white;
- margin: 0px 12px 8px 12px;
+ margin: 10px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@@ -72,7 +67,7 @@
}
}
-.disabled {
+.launch-disabled {
pointer-events: none;
border-color: transparent;
&:hover {
diff --git a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.ts b/ui/src/app/pages/apps-routes/app-list/app-list.page.ts
similarity index 81%
rename from ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.ts
rename to ui/src/app/pages/apps-routes/app-list/app-list.page.ts
index 0c9261512..b5860eb33 100644
--- a/ui/src/app/pages/apps-routes/app-installed-list/app-installed-list.page.ts
+++ b/ui/src/app/pages/apps-routes/app-list/app-list.page.ts
@@ -5,11 +5,11 @@ import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import { PackageDataEntry } from 'src/app/models/patch-db/data-model'
@Component({
- selector: 'app-installed-list',
- templateUrl: './app-installed-list.page.html',
- styleUrls: ['./app-installed-list.page.scss'],
+ selector: 'app-list',
+ templateUrl: './app-list.page.html',
+ styleUrls: ['./app-list.page.scss'],
})
-export class AppInstalledListPage {
+export class AppListPage {
pkgs: PackageDataEntry[] = []
constructor (
diff --git a/ui/src/app/pages/apps-routes/app-properties/app-properties.page.ts b/ui/src/app/pages/apps-routes/app-properties/app-properties.page.ts
index f6c81ffd5..4a4f3fc50 100644
--- a/ui/src/app/pages/apps-routes/app-properties/app-properties.page.ts
+++ b/ui/src/app/pages/apps-routes/app-properties/app-properties.page.ts
@@ -6,7 +6,6 @@ import { copyToClipboard } from 'src/app/util/web.util'
import { AlertController, NavController, PopoverController, ToastController } from '@ionic/angular'
import { PackageProperties } from 'src/app/util/properties.util'
import { QRComponent } from 'src/app/components/qr/qr.component'
-import { PropertyStore } from './property-store'
import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import * as JsonPointer from 'json-pointer'
import { FEStatus } from 'src/app/services/pkg-status-rendering.service'
@@ -34,7 +33,6 @@ export class AppPropertiesPage {
private readonly alertCtrl: AlertController,
private readonly toastCtrl: ToastController,
private readonly popoverCtrl: PopoverController,
- private readonly propertyStore: PropertyStore,
private readonly navCtrl: NavController,
public readonly patch: PatchDbModel,
) { }
@@ -75,7 +73,7 @@ export class AppPropertiesPage {
}
async goToNested (key: string): Promise
{
- this.navCtrl.navigateForward(`/services/installed/${this.pkgId}/properties`, {
+ this.navCtrl.navigateForward(`/services/${this.pkgId}/properties`, {
queryParams: {
pointer: `${this.pointer || ''}/${key}/value`,
},
diff --git a/ui/src/app/pages/apps-routes/app-properties/property-store.ts b/ui/src/app/pages/apps-routes/app-properties/property-store.ts
deleted file mode 100644
index e339a48ee..000000000
--- a/ui/src/app/pages/apps-routes/app-properties/property-store.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Injectable } from '@angular/core'
-import { BehaviorSubject } from 'rxjs'
-import { PackageProperties } from '../../../util/properties.util'
-
-@Injectable({
- providedIn: 'root',
-})
-export class PropertyStore {
- properties$: BehaviorSubject = new BehaviorSubject({ })
- watch$ () { return this.properties$.asObservable() }
-
- update (properties: PackageProperties): void {
- this.properties$.next(properties)
- }
-}
\ No newline at end of file
diff --git a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.module.ts b/ui/src/app/pages/apps-routes/app-show/app-show.module.ts
similarity index 73%
rename from ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.module.ts
rename to ui/src/app/pages/apps-routes/app-show/app-show.module.ts
index 411c6188c..565484e3b 100644
--- a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.module.ts
+++ b/ui/src/app/pages/apps-routes/app-show/app-show.module.ts
@@ -2,18 +2,17 @@ import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { Routes, RouterModule } from '@angular/router'
import { IonicModule } from '@ionic/angular'
-import { AppInstalledShowPage } from './app-installed-show.page'
+import { AppShowPage } from './app-show.page'
import { StatusComponentModule } from 'src/app/components/status/status.component.module'
import { SharingModule } from 'src/app/modules/sharing.module'
import { PwaBackComponentModule } from 'src/app/components/pwa-back-button/pwa-back.component.module'
import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/badge-menu.component.module'
import { InstallWizardComponentModule } from 'src/app/components/install-wizard/install-wizard.component.module'
-import { InformationPopoverComponentModule } from 'src/app/components/information-popover/information-popover.component.module'
const routes: Routes = [
{
path: '',
- component: AppInstalledShowPage,
+ component: AppShowPage,
},
]
@@ -27,9 +26,8 @@ const routes: Routes = [
PwaBackComponentModule,
BadgeMenuComponentModule,
InstallWizardComponentModule,
- InformationPopoverComponentModule,
],
- declarations: [AppInstalledShowPage],
+ declarations: [AppShowPage],
})
-export class AppInstalledShowPageModule { }
+export class AppShowPageModule { }
diff --git a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.html b/ui/src/app/pages/apps-routes/app-show/app-show.page.html
similarity index 80%
rename from ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.html
rename to ui/src/app/pages/apps-routes/app-show/app-show.page.html
index a55dfb715..872226d30 100644
--- a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.html
+++ b/ui/src/app/pages/apps-routes/app-show/app-show.page.html
@@ -41,23 +41,21 @@
-
-
-
-
- Configure
-
-
- Stop
-
-
- Fix
-
-
- Start
-
-
-
+
+
+
+ Configure
+
+
+ Stop
+
+
+ Fix
+
+
+ Start
+
+
Launch Web Interface
@@ -69,11 +67,11 @@
-
+
-
+
- {{ button.title }}
+ {{ button.title }}
@@ -101,7 +99,7 @@
{{ pkg.installed.status['dependency-errors'][dep.key] ? pkg.installed.status['dependency-errors'][dep.key].type : 'satisfied' }}
-
+
View
@@ -111,7 +109,7 @@
-
+
Start
diff --git a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.scss b/ui/src/app/pages/apps-routes/app-show/app-show.page.scss
similarity index 80%
rename from ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.scss
rename to ui/src/app/pages/apps-routes/app-show/app-show.page.scss
index 79e83f0f8..d85206dfa 100644
--- a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.scss
+++ b/ui/src/app/pages/apps-routes/app-show/app-show.page.scss
@@ -1,15 +1,3 @@
-.full-width {
- margin: 10px;
-}
-
-.about-attribute {
- font-size: small;
-}
-
-.about-attribute-value {
- font-size: small;
-}
-
.less-large {
font-size: 20px !important;
}
@@ -23,9 +11,10 @@
}
.status-readout {
+ --background: transparent;
display: flex;
justify-content: space-between;
- padding: 4px 10px;
+ padding: 0 10px;
border-radius: 10px;
align-items: center;
background: var(--ion-background-color);
@@ -35,10 +24,6 @@
border-color: #404040;
}
-.no-cushion-item {
- --background: transparent; --padding-start: 0px; --inner-padding-end: 0px; --padding-end: 0px;
-}
-
.launch-button {
--background: rgb(70 193 255 / 75%);
--background-hover: rgb(70 193 255);
diff --git a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.ts b/ui/src/app/pages/apps-routes/app-show/app-show.page.ts
similarity index 89%
rename from ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.ts
rename to ui/src/app/pages/apps-routes/app-show/app-show.page.ts
index b7e80fe99..160874d31 100644
--- a/ui/src/app/pages/apps-routes/app-installed-show/app-installed-show.page.ts
+++ b/ui/src/app/pages/apps-routes/app-show/app-show.page.ts
@@ -1,5 +1,5 @@
import { Component, ViewChild } from '@angular/core'
-import { AlertController, NavController, ModalController, IonContent, PopoverController } from '@ionic/angular'
+import { AlertController, NavController, ModalController, IonContent } from '@ionic/angular'
import { ApiService } from 'src/app/services/api/api.service'
import { ActivatedRoute, NavigationExtras } from '@angular/router'
import { chill, isEmptyObject } from 'src/app/util/misc.util'
@@ -7,7 +7,6 @@ import { LoaderService } from 'src/app/services/loader.service'
import { Observable, of, Subscription } from 'rxjs'
import { wizardModal } from 'src/app/components/install-wizard/install-wizard.component'
import { WizardBaker } from 'src/app/components/install-wizard/prebaked-wizards'
-import { InformationPopoverComponent } from 'src/app/components/information-popover/information-popover.component'
import { ConfigService, getManifest } from 'src/app/services/config.service'
import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import { DependencyErrorConfigUnsatisfied, DependencyErrorNotInstalled, DependencyErrorType, Manifest, PackageDataEntry, PackageState } from 'src/app/models/patch-db/data-model'
@@ -16,11 +15,11 @@ import { ConnectionService } from 'src/app/services/connection.service'
import { Recommendation } from 'src/app/components/recommendation-button/recommendation-button.component'
@Component({
- selector: 'app-installed-show',
- templateUrl: './app-installed-show.page.html',
- styleUrls: ['./app-installed-show.page.scss'],
+ selector: 'app-show',
+ templateUrl: './app-show.page.html',
+ styleUrls: ['./app-show.page.scss'],
})
-export class AppInstalledShowPage {
+export class AppShowPage {
error: string
pkgId: string
pkg: PackageDataEntry
@@ -43,7 +42,6 @@ export class AppInstalledShowPage {
private readonly modalCtrl: ModalController,
private readonly apiService: ApiService,
private readonly wizardBaker: WizardBaker,
- private readonly popoverController: PopoverController,
private readonly config: ConfigService,
public readonly patch: PatchDbModel,
public readonly connectionService: ConnectionService,
@@ -120,20 +118,6 @@ export class AppInstalledShowPage {
}
}
- async presentPopover (information: string, ev: any) {
- const popover = await this.popoverController.create({
- component: InformationPopoverComponent,
- event: ev,
- translucent: false,
- showBackdrop: true,
- backdropDismiss: true,
- componentProps: {
- information,
- },
- })
- return await popover.present()
- }
-
scrollToRequirements () {
const el = document.getElementById('dependencies')
if (!el) return
@@ -170,7 +154,7 @@ export class AppInstalledShowPage {
state: { installRec },
}
- await this.navCtrl.navigateForward(`/services/marketplace/${depId}`, navigationExtras)
+ await this.navCtrl.navigateForward(`/marketplace/${depId}`, navigationExtras)
}
private async configureDep (depId: string): Promise {
@@ -189,7 +173,7 @@ export class AppInstalledShowPage {
state: { configRecommendation },
}
- await this.navCtrl.navigateForward(`/services/installed/${depId}/config`, navigationExtras)
+ await this.navCtrl.navigateForward(`/services/${depId}/config`, navigationExtras)
}
private async presentAlertStart (message: string): Promise {
@@ -300,7 +284,7 @@ export class AppInstalledShowPage {
disabled: [],
},
{
- action: () => this.navCtrl.navigateForward(['/services', 'marketplace', this.pkgId], { relativeTo: this.route }),
+ action: () => this.navCtrl.navigateForward(['/marketplace', this.pkgId], { relativeTo: this.route }),
title: 'Marketplace Listing',
icon: 'storefront-outline',
color: 'danger',
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 83c884bd5..05ae01bc0 100644
--- a/ui/src/app/pages/apps-routes/apps-routing.module.ts
+++ b/ui/src/app/pages/apps-routes/apps-routing.module.ts
@@ -4,69 +4,57 @@ import { Routes, RouterModule } from '@angular/router'
const routes: Routes = [
{
path: '',
- redirectTo: 'installed',
+ redirectTo: 'list',
pathMatch: 'full',
},
{
- path: 'installed',
- loadChildren: () => import('./app-installed-list/app-installed-list.module').then(m => m.AppInstalledListPageModule),
+ path: 'list',
+ loadChildren: () => import('./app-list/app-list.module').then(m => m.AppListPageModule),
},
{
- path: 'installed/:pkgId',
- loadChildren: () => import('./app-installed-show/app-installed-show.module').then(m => m.AppInstalledShowPageModule),
+ path: ':pkgId',
+ loadChildren: () => import('./app-show/app-show.module').then(m => m.AppShowPageModule),
},
{
- path: 'installed/:pkgId/actions',
+ path: ':pkgId/actions',
loadChildren: () => import('./app-actions/app-actions.module').then(m => m.AppActionsPageModule),
},
{
- path: 'installed/:pkgId/config',
+ path: ':pkgId/config',
loadChildren: () => import('./app-config/app-config.module').then(m => m.AppConfigPageModule),
},
{
- path: 'installed/:pkgId/config/:edit',
+ path: ':pkgId/config/:edit',
loadChildren: () => import('./app-config/app-config.module').then(m => m.AppConfigPageModule),
},
{
- path: 'installed/:pkgId/instructions',
+ path: ':pkgId/instructions',
loadChildren: () => import('./app-instructions/app-instructions.module').then(m => m.AppInstructionsPageModule),
},
{
- path: 'installed/:pkgId/interfaces',
+ path: ':pkgId/interfaces',
loadChildren: () => import('./app-interfaces/app-interfaces.module').then(m => m.AppInterfacesPageModule),
},
{
- path: 'installed/:pkgId/logs',
+ path: ':pkgId/logs',
loadChildren: () => import('./app-logs/app-logs.module').then(m => m.AppLogsPageModule),
},
{
- path: 'installed/:pkgId/manifest',
+ path: ':pkgId/manifest',
loadChildren: () => import('./app-manifest/app-manifest.module').then(m => m.AppManifestPageModule),
},
{
- path: 'installed/:pkgId/metrics',
+ path: ':pkgId/metrics',
loadChildren: () => import('./app-metrics/app-metrics.module').then(m => m.AppMetricsPageModule),
},
{
- path: 'installed/:pkgId/properties',
+ path: ':pkgId/properties',
loadChildren: () => import('./app-properties/app-properties.module').then(m => m.AppPropertiesPageModule),
},
{
- path: 'installed/:pkgId/restore',
+ path: ':pkgId/restore',
loadChildren: () => import('./app-restore/app-restore.module').then(m => m.AppRestorePageModule),
},
- {
- path: 'marketplace',
- loadChildren: () => import('./app-available-list/app-available-list.module').then(m => m.AppAvailableListPageModule),
- },
- {
- path: 'marketplace/:pkgId',
- loadChildren: () => import('./app-available-show/app-available-show.module').then(m => m.AppAvailableShowPageModule),
- },
- {
- path: 'marketplace/:pkgId/notes',
- loadChildren: () => import('./app-release-notes/app-release-notes.module').then(m => m.ReleaseNotesModule),
- },
]
@NgModule({
diff --git a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.module.ts b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.module.ts
similarity index 100%
rename from ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.module.ts
rename to ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.module.ts
diff --git a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.html b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.html
similarity index 74%
rename from ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.html
rename to ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.html
index c850c7acb..38ca00abd 100644
--- a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.html
+++ b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.html
@@ -8,10 +8,10 @@
-
+
-
+
{{ note.key | displayEmver }}
diff --git a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.scss b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.scss
similarity index 100%
rename from ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.scss
rename to ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.scss
diff --git a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.ts b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.ts
similarity index 88%
rename from ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.ts
rename to ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.ts
index cf0159045..83d21fc67 100644
--- a/ui/src/app/pages/apps-routes/app-release-notes/app-release-notes.page.ts
+++ b/ui/src/app/pages/marketplace-routes/app-release-notes/app-release-notes.page.ts
@@ -1,6 +1,6 @@
import { Component } from '@angular/core'
import { ActivatedRoute } from '@angular/router'
-import { AppAvailableService } from '../app-available.service'
+import { MarketplaceService } from '../marketplace.service'
@Component({
selector: 'app-release-notes',
@@ -14,7 +14,7 @@ export class AppReleaseNotes {
constructor (
private readonly route: ActivatedRoute,
- public aaService: AppAvailableService,
+ public aaService: MarketplaceService,
) { }
ngOnInit () {
diff --git a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.module.ts b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.module.ts
similarity index 78%
rename from ui/src/app/pages/apps-routes/app-available-list/app-available-list.module.ts
rename to ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.module.ts
index 4c51804b3..693957f9d 100644
--- a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.module.ts
+++ b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.module.ts
@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { Routes, RouterModule } from '@angular/router'
import { IonicModule } from '@ionic/angular'
-import { AppAvailableListPage } from './app-available-list.page'
+import { MarketplaceListPage } from './marketplace-list.page'
import { SharingModule } from '../../../modules/sharing.module'
import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/badge-menu.component.module'
import { StatusComponentModule } from 'src/app/components/status/status.component.module'
@@ -11,7 +11,7 @@ import { StatusComponentModule } from 'src/app/components/status/status.componen
const routes: Routes = [
{
path: '',
- component: AppAvailableListPage,
+ component: MarketplaceListPage,
},
]
@@ -24,6 +24,6 @@ const routes: Routes = [
SharingModule,
BadgeMenuComponentModule,
],
- declarations: [AppAvailableListPage],
+ declarations: [MarketplaceListPage],
})
-export class AppAvailableListPageModule { }
+export class MarketplaceListPageModule { }
diff --git a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.html b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
similarity index 74%
rename from ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.html
rename to ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
index 9db1e87a6..6eb212d50 100644
--- a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.html
+++ b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
@@ -19,19 +19,7 @@
{{ error }}
-
-
- {{ cat }}
-
-
-
-
+
Now Available...
EmbassyOS Version {{ eos.version }}
@@ -41,10 +29,42 @@
-
+ Categories
+
+
+
+ {{ cat }}
+
+
+
+
+
+
-
+
+
+
+
+
+
+ {{ pkg.title }}
+
+
+ {{ pkg.descriptionShort }}
+
+
+
+
+
+
+
diff --git a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.scss b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.scss
similarity index 76%
rename from ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.scss
rename to ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.scss
index 5110a8ea4..1e2b65764 100644
--- a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.scss
+++ b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.scss
@@ -8,8 +8,8 @@
.scrollable {
overflow: auto;
white-space: nowrap;
- background-color: var(--ion-color-light);
- margin-bottom: 16px;
+ // background-color: var(--ion-color-light);
+ height: 80px;
/* Hide scrollbar for Chrome, Safari and Opera */
::-webkit-scrollbar {
@@ -23,6 +23,11 @@
.eos-card {
--background: linear-gradient(45deg, #101010 16%, var(--ion-color-danger) 150%);
- margin: 16px 10px;
+ margin: 0 10px 16px 10px;
cursor: pointer;
}
+
+.cat-selected {
+ border-width: 0 0 1px 0;
+ border-style: solid;
+}
diff --git a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.ts b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts
similarity index 93%
rename from ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.ts
rename to ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts
index 0eb3a192f..3d83481c1 100644
--- a/ui/src/app/pages/apps-routes/app-available-list/app-available-list.page.ts
+++ b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.ts
@@ -8,11 +8,11 @@ import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import { PackageState } from 'src/app/models/patch-db/data-model'
@Component({
- selector: 'app-available-list',
- templateUrl: './app-available-list.page.html',
- styleUrls: ['./app-available-list.page.scss'],
+ selector: 'marketplace-list',
+ templateUrl: './marketplace-list.page.html',
+ styleUrls: ['./marketplace-list.page.scss'],
})
-export class AppAvailableListPage {
+export class MarketplaceListPage {
pageLoading = true
pkgsLoading = true
error = ''
diff --git a/ui/src/app/pages/marketplace-routes/marketplace-routing.module.ts b/ui/src/app/pages/marketplace-routes/marketplace-routing.module.ts
new file mode 100644
index 000000000..ea4fa17b7
--- /dev/null
+++ b/ui/src/app/pages/marketplace-routes/marketplace-routing.module.ts
@@ -0,0 +1,28 @@
+import { NgModule } from '@angular/core'
+import { Routes, RouterModule } from '@angular/router'
+
+const routes: Routes = [
+ {
+ path: '',
+ redirectTo: 'browse',
+ pathMatch: 'full',
+ },
+ {
+ path: 'browse',
+ loadChildren: () => import('./marketplace-list/marketplace-list.module').then(m => m.MarketplaceListPageModule),
+ },
+ {
+ path: ':pkgId',
+ loadChildren: () => import('./marketplace-show/marketplace-show.module').then(m => m.MarketplaceShowPageModule),
+ },
+ {
+ path: ':pkgId/notes',
+ loadChildren: () => import('./app-release-notes/app-release-notes.module').then(m => m.ReleaseNotesModule),
+ },
+]
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule],
+})
+export class MarketplaceRoutingModule { }
\ No newline at end of file
diff --git a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.module.ts b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.module.ts
similarity index 76%
rename from ui/src/app/pages/apps-routes/app-available-show/app-available-show.module.ts
rename to ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.module.ts
index 12921f357..1f9bac22d 100644
--- a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.module.ts
+++ b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.module.ts
@@ -2,19 +2,18 @@ import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { Routes, RouterModule } from '@angular/router'
import { IonicModule } from '@ionic/angular'
-import { AppAvailableShowPage } from './app-available-show.page'
+import { MarketplaceShowPage } from './marketplace-show.page'
import { SharingModule } from 'src/app/modules/sharing.module'
import { PwaBackComponentModule } from 'src/app/components/pwa-back-button/pwa-back.component.module'
import { BadgeMenuComponentModule } from 'src/app/components/badge-menu-button/badge-menu.component.module'
import { StatusComponentModule } from 'src/app/components/status/status.component.module'
import { RecommendationButtonComponentModule } from 'src/app/components/recommendation-button/recommendation-button.component.module'
import { InstallWizardComponentModule } from 'src/app/components/install-wizard/install-wizard.component.module'
-import { InformationPopoverComponentModule } from 'src/app/components/information-popover/information-popover.component.module'
const routes: Routes = [
{
path: '',
- component: AppAvailableShowPage,
+ component: MarketplaceShowPage,
},
]
@@ -29,8 +28,7 @@ const routes: Routes = [
RecommendationButtonComponentModule,
BadgeMenuComponentModule,
InstallWizardComponentModule,
- InformationPopoverComponentModule,
],
- declarations: [AppAvailableShowPage],
+ declarations: [MarketplaceShowPage],
})
-export class AppAvailableShowPageModule { }
+export class MarketplaceShowPageModule { }
diff --git a/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html
new file mode 100644
index 000000000..18b6e9159
--- /dev/null
+++ b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.html
@@ -0,0 +1,156 @@
+
+
+
+
+
+ Listing
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ error }}
+
+
+
+
+
+
+
+
+
+
+
+ Install
+
+
+
+
+
+
+ Update
+
+
+ Downgrade
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ rec.dependentTitle }}
+
+
+
{{ rec.description }}
+
{{ pkg.manifest.title }} version {{ pkg.manifest.version | displayEmver }} is compatible.
+
{{ pkg.manifest.title }} version {{ pkg.manifest.version | displayEmver }} is NOT compatible.
+
+
+
+
+
+
+
+
+
+
+ New in {{ pkg.manifest.version | displayEmver }}
+
+ Release History
+
+
+
+
+
+
+
+
+
+ Description
+
+
+
+ {{ pkg.manifest.description.long }}
+
+
+
+
+
+ Dependencies
+
+
+
+
+
+
+
+
+
+
+ {{ pkg['dependency-metadata'][dep.key].title }}
+ (recommended)
+
+ {{ dep.value.version | displayEmver }}
+
+
+
+ {{ dep.value.description }}
+
+
+
+
+
+
+
+
+ Additional Information
+
+
+ Other versions
+
+
+
+
+
\ No newline at end of file
diff --git a/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.scss b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.scss
new file mode 100644
index 000000000..08bc259ad
--- /dev/null
+++ b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.scss
@@ -0,0 +1,48 @@
+.header {
+ font-family: 'Montserrat';
+ padding: 2%;
+ img {
+ min-width: 16%;
+ max-width: 18%;
+ }
+ .header-text {
+ margin-left: 5%;
+ display: inline-block;
+ vertical-align: top;
+ .header-title {
+ line-height: .65;
+ margin: 0 0 0 -2px;
+ font-size: calc(20px + 3vw)
+ }
+ .header-version {
+ padding: 12px 0;
+ margin: 0;
+ font-size: calc(10px + 1vw)
+ }
+ .header-status {
+ p {
+ margin: 0;
+ font-size: calc(6px + 1vw)
+ }
+ }
+ }
+}
+
+.recommendation-text {
+ font-style: italic;
+}
+
+.recommendation-error {
+ color: var(--ion-color-danger);
+}
+
+ion-item-divider {
+ text-transform: uppercase;
+ margin-top: 22px;
+ font-weight: 400;
+}
+
+#release-notes {
+ overflow: auto;
+ max-height: 160px;
+}
diff --git a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.ts b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts
similarity index 65%
rename from ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.ts
rename to ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts
index f56e91460..da3e9676e 100644
--- a/ui/src/app/pages/apps-routes/app-available-show/app-available-show.page.ts
+++ b/ui/src/app/pages/marketplace-routes/marketplace-show/marketplace-show.page.ts
@@ -1,23 +1,22 @@
import { Component } from '@angular/core'
import { ActivatedRoute } from '@angular/router'
-import { AlertController, ModalController, NavController, PopoverController } from '@ionic/angular'
+import { AlertController, ModalController, NavController } from '@ionic/angular'
import { Recommendation } from 'src/app/components/recommendation-button/recommendation-button.component'
import { wizardModal } from 'src/app/components/install-wizard/install-wizard.component'
import { WizardBaker } from 'src/app/components/install-wizard/prebaked-wizards'
-import { InformationPopoverComponent } from 'src/app/components/information-popover/information-popover.component'
import { Emver } from 'src/app/services/emver.service'
import { displayEmver } from 'src/app/pipes/emver.pipe'
import { pauseFor } from 'src/app/util/misc.util'
import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import { PackageState } from 'src/app/models/patch-db/data-model'
-import { AppAvailableService } from '../app-available.service'
+import { MarketplaceService } from '../marketplace.service'
@Component({
- selector: 'app-available-show',
- templateUrl: './app-available-show.page.html',
- styleUrls: ['./app-available-show.page.scss'],
+ selector: 'marketplace-show',
+ templateUrl: './marketplace-show.page.html',
+ styleUrls: ['./marketplace-show.page.scss'],
})
-export class AppAvailableShowPage {
+export class MarketplaceShowPage {
error = ''
pkgId: string
@@ -26,18 +25,15 @@ export class AppAvailableShowPage {
rec: Recommendation | null = null
showRec = true
- depDefinition = 'Service Dependencies are other services that this service recommends or requires in order to run.'
-
constructor (
private readonly route: ActivatedRoute,
private readonly alertCtrl: AlertController,
private readonly modalCtrl: ModalController,
private readonly wizardBaker: WizardBaker,
private readonly navCtrl: NavController,
- private readonly popoverController: PopoverController,
private readonly emver: Emver,
public readonly patch: PatchDbModel,
- public aaService: AppAvailableService,
+ public marketplaceService: MarketplaceService,
) { }
async ngOnInit () {
@@ -48,38 +44,24 @@ export class AppAvailableShowPage {
async getPkg (version?: string): Promise {
this.pkgId = this.route.snapshot.paramMap.get('pkgId')
try {
- await this.aaService.setPkg(this.pkgId, version)
+ await this.marketplaceService.setPkg(this.pkgId, version)
} catch (e) {
console.error(e)
this.error = e.message
}
}
- async presentPopover (information: string, ev: any) {
- const popover = await this.popoverController.create({
- component: InformationPopoverComponent,
- event: ev,
- translucent: false,
- showBackdrop: true,
- backdropDismiss: true,
- componentProps: {
- information,
- },
- })
- return await popover.present()
- }
-
async presentAlertVersions () {
const alert = await this.alertCtrl.create({
header: 'Versions',
backdropDismiss: false,
- inputs: this.aaService.pkgs[this.pkgId].versions.sort((a, b) => -1 * this.emver.compare(a, b)).map(v => {
+ inputs: this.marketplaceService.pkgs[this.pkgId].versions.sort((a, b) => -1 * this.emver.compare(a, b)).map(v => {
return {
name: v, // for CSS
type: 'radio',
label: displayEmver(v), // appearance on screen
value: v, // literal SEM version value
- checked: this.aaService.pkgs[this.pkgId].manifest.version === v,
+ checked: this.marketplaceService.pkgs[this.pkgId].manifest.version === v,
}
}),
buttons: [
@@ -99,7 +81,7 @@ export class AppAvailableShowPage {
}
async install () {
- const { id, title, version, dependencies, alerts } = this.aaService.pkgs[this.pkgId].manifest
+ const { id, title, version, dependencies, alerts } = this.marketplaceService.pkgs[this.pkgId].manifest
const { cancelled } = await wizardModal(
this.modalCtrl,
this.wizardBaker.install({
@@ -115,7 +97,7 @@ export class AppAvailableShowPage {
}
async update (action: 'update' | 'downgrade') {
- const { id, title, version, dependencies, alerts } = this.aaService.pkgs[this.pkgId].manifest
+ const { id, title, version, dependencies, alerts } = this.marketplaceService.pkgs[this.pkgId].manifest
const value = {
id,
title,
diff --git a/ui/src/app/pages/apps-routes/app-available.service.ts b/ui/src/app/pages/marketplace-routes/marketplace.service.ts
similarity index 93%
rename from ui/src/app/pages/apps-routes/app-available.service.ts
rename to ui/src/app/pages/marketplace-routes/marketplace.service.ts
index fcf15d180..0bc87d496 100644
--- a/ui/src/app/pages/apps-routes/app-available.service.ts
+++ b/ui/src/app/pages/marketplace-routes/marketplace.service.ts
@@ -5,7 +5,7 @@ import { ApiService } from 'src/app/services/api/api.service'
@Injectable({
providedIn: 'root',
})
-export class AppAvailableService {
+export class MarketplaceService {
pkgs: { [id: string]: AvailableShow } = { }
constructor (
diff --git a/ui/src/app/pages/notifications/notifications.page.html b/ui/src/app/pages/notifications/notifications.page.html
index b22b5500c..089829f4b 100644
--- a/ui/src/app/pages/notifications/notifications.page.html
+++ b/ui/src/app/pages/notifications/notifications.page.html
@@ -46,7 +46,7 @@
{{ not['created-at'] | date: 'short' }}
-
+
- {{ not['package-id'] }}
diff --git a/ui/src/app/pages/server-routes/lan/lan.page.html b/ui/src/app/pages/server-routes/lan/lan.page.html
index 0d34a989b..01582a3e8 100644
--- a/ui/src/app/pages/server-routes/lan/lan.page.html
+++ b/ui/src/app/pages/server-routes/lan/lan.page.html
@@ -69,7 +69,6 @@
-
diff --git a/ui/src/app/pages/server-routes/general-settings/general-settings.module.ts b/ui/src/app/pages/server-routes/preferences/preferences.module.ts
similarity index 77%
rename from ui/src/app/pages/server-routes/general-settings/general-settings.module.ts
rename to ui/src/app/pages/server-routes/preferences/preferences.module.ts
index a77b0538e..3d6183464 100644
--- a/ui/src/app/pages/server-routes/general-settings/general-settings.module.ts
+++ b/ui/src/app/pages/server-routes/preferences/preferences.module.ts
@@ -1,7 +1,7 @@
import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { IonicModule } from '@ionic/angular'
-import { GeneralSettingsPage } from './general-settings.page'
+import { PreferencesPage } from './preferences.page'
import { Routes, RouterModule } from '@angular/router'
import { SharingModule } from 'src/app/modules/sharing.module'
import { PwaBackComponentModule } from 'src/app/components/pwa-back-button/pwa-back.component.module'
@@ -9,7 +9,7 @@ import { PwaBackComponentModule } from 'src/app/components/pwa-back-button/pwa-b
const routes: Routes = [
{
path: '',
- component: GeneralSettingsPage,
+ component: PreferencesPage,
},
]
@@ -22,7 +22,7 @@ const routes: Routes = [
PwaBackComponentModule,
],
declarations: [
- GeneralSettingsPage,
+ PreferencesPage,
],
})
-export class GeneralSettingsPageModule { }
+export class PreferencesPageModule { }
diff --git a/ui/src/app/pages/server-routes/general-settings/general-settings.page.html b/ui/src/app/pages/server-routes/preferences/preferences.page.html
similarity index 95%
rename from ui/src/app/pages/server-routes/general-settings/general-settings.page.html
rename to ui/src/app/pages/server-routes/preferences/preferences.page.html
index 103ef7479..f1eeb8ee8 100644
--- a/ui/src/app/pages/server-routes/general-settings/general-settings.page.html
+++ b/ui/src/app/pages/server-routes/preferences/preferences.page.html
@@ -3,7 +3,7 @@
- General Settings
+ Preferences
diff --git a/ui/src/app/pages/server-routes/general-settings/general-settings.page.scss b/ui/src/app/pages/server-routes/preferences/preferences.page.scss
similarity index 100%
rename from ui/src/app/pages/server-routes/general-settings/general-settings.page.scss
rename to ui/src/app/pages/server-routes/preferences/preferences.page.scss
diff --git a/ui/src/app/pages/server-routes/general-settings/general-settings.page.ts b/ui/src/app/pages/server-routes/preferences/preferences.page.ts
similarity index 75%
rename from ui/src/app/pages/server-routes/general-settings/general-settings.page.ts
rename to ui/src/app/pages/server-routes/preferences/preferences.page.ts
index 5f8077617..68fea05f4 100644
--- a/ui/src/app/pages/server-routes/general-settings/general-settings.page.ts
+++ b/ui/src/app/pages/server-routes/preferences/preferences.page.ts
@@ -3,11 +3,11 @@ import { ServerConfigService } from 'src/app/services/server-config.service'
import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
@Component({
- selector: 'general-settings',
- templateUrl: './general-settings.page.html',
- styleUrls: ['./general-settings.page.scss'],
+ selector: 'preferences',
+ templateUrl: './preferences.page.html',
+ styleUrls: ['./preferences.page.scss'],
})
-export class GeneralSettingsPage {
+export class PreferencesPage {
constructor (
private readonly serverConfigService: ServerConfigService,
public readonly patch: PatchDbModel,
diff --git a/ui/src/app/pages/server-routes/server-routing.module.ts b/ui/src/app/pages/server-routes/server-routing.module.ts
index c60509c6b..af45a7906 100644
--- a/ui/src/app/pages/server-routes/server-routing.module.ts
+++ b/ui/src/app/pages/server-routes/server-routing.module.ts
@@ -23,8 +23,8 @@ const routes: Routes = [
loadChildren: () => import('./server-logs/server-logs.module').then(m => m.ServerLogsPageModule),
},
{
- path: 'settings',
- loadChildren: () => import('./general-settings/general-settings.module').then(m => m.GeneralSettingsPageModule),
+ path: 'preferences',
+ loadChildren: () => import('./preferences/preferences.module').then(m => m.PreferencesPageModule),
},
{
path: 'wifi',
diff --git a/ui/src/app/pages/server-routes/server-show/server-show.page.html b/ui/src/app/pages/server-routes/server-show/server-show.page.html
index 14e903d59..81a063600 100644
--- a/ui/src/app/pages/server-routes/server-show/server-show.page.html
+++ b/ui/src/app/pages/server-routes/server-show/server-show.page.html
@@ -7,65 +7,17 @@
-
+
- Backups
-
-
-
- Create Backup
-
-
- Insights
-
-
-
-
- About
-
-
-
-
- Monitor
-
-
-
-
- Logs
-
-
- Settings
-
-
-
- General
-
-
-
-
- LAN
-
-
-
-
- WiFi
-
-
-
-
- Developer Options
-
-
- Power
-
-
-
- Restart
-
-
-
-
- Shutdown
-
-
+
+
+
+ {{ cat.key }}
+
+
+ {{ button.title }}
+
+
+
+
\ No newline at end of file
diff --git a/ui/src/app/pages/server-routes/server-show/server-show.page.scss b/ui/src/app/pages/server-routes/server-show/server-show.page.scss
index 272d5c3dc..e69de29bb 100644
--- a/ui/src/app/pages/server-routes/server-show/server-show.page.scss
+++ b/ui/src/app/pages/server-routes/server-show/server-show.page.scss
@@ -1,12 +0,0 @@
-.notification-button {
- ion-badge {
- position: absolute;
- font-size: 8px;
- bottom: .7rem;
- left: .8rem;
- }
-}
-
-ion-item-divider {
- margin-top: 0px;
-}
\ No newline at end of file
diff --git a/ui/src/app/pages/server-routes/server-show/server-show.page.ts b/ui/src/app/pages/server-routes/server-show/server-show.page.ts
index 52e125d0a..582ae9f4a 100644
--- a/ui/src/app/pages/server-routes/server-show/server-show.page.ts
+++ b/ui/src/app/pages/server-routes/server-show/server-show.page.ts
@@ -1,10 +1,11 @@
import { Component } from '@angular/core'
import { LoadingOptions } from '@ionic/core'
-import { AlertController, ModalController } from '@ionic/angular'
+import { AlertController, NavController } from '@ionic/angular'
import { ApiService } from 'src/app/services/api/api.service'
import { LoaderService } from 'src/app/services/loader.service'
import { PatchDbModel } from 'src/app/models/patch-db/patch-db-model'
import { ServerStatus } from 'src/app/models/patch-db/data-model'
+import { ActivatedRoute } from '@angular/router'
@Component({
selector: 'server-show',
@@ -13,15 +14,21 @@ import { ServerStatus } from 'src/app/models/patch-db/data-model'
})
export class ServerShowPage {
ServerStatus = ServerStatus
+ settings: ServerSettings = { }
constructor (
private readonly alertCtrl: AlertController,
private readonly loader: LoaderService,
private readonly apiService: ApiService,
- private readonly modalCtrl: ModalController,
+ private readonly navCtrl: NavController,
+ private readonly route: ActivatedRoute,
public readonly patch: PatchDbModel,
) { }
+ ngOnInit () {
+ this.setButtons()
+ }
+
async presentAlertRestart () {
const alert = await this.alertCtrl.create({
backdropDismiss: false,
@@ -73,7 +80,7 @@ export class ServerShowPage {
// this.serverModel.markUnreachable()
await this.apiService.restartServer({ })
})
- .catch(e => this.setError(e))
+ .catch(console.error)
}
private async shutdown () {
@@ -83,11 +90,74 @@ export class ServerShowPage {
// this.serverModel.markUnreachable()
await this.apiService.shutdownServer({ })
})
- .catch(e => this.setError(e))
+ .catch(console.error)
}
- setError (e: Error) {
- console.error(e)
+ private setButtons (): void {
+ this.settings = {
+ 'Settings': [
+ {
+ title: 'Preferences',
+ icon: 'cog-outline',
+ action: () => this.navCtrl.navigateForward(['preferences'], { relativeTo: this.route }),
+ },
+ {
+ title: 'LAN',
+ icon: 'home-outline',
+ action: () => this.navCtrl.navigateForward(['lan'], { relativeTo: this.route }),
+ },
+ {
+ title: 'WiFi',
+ icon: 'wifi',
+ action: () => this.navCtrl.navigateForward(['wifi'], { relativeTo: this.route }),
+ },
+ {
+ title: 'Developer Options',
+ icon: 'terminal-outline',
+ action: () => this.navCtrl.navigateForward(['developer'], { relativeTo: this.route }),
+ },
+ ],
+ 'Insights': [
+ {
+ title: 'About',
+ icon: 'information-circle-outline',
+ action: () => this.navCtrl.navigateForward(['specs'], { relativeTo: this.route }),
+ },
+ {
+ title: 'Monitor',
+ icon: 'pulse',
+ action: () => this.navCtrl.navigateForward(['metrics'], { relativeTo: this.route }),
+ },
+ {
+ title: 'Logs',
+ icon: 'newspaper-outline',
+ action: () => this.navCtrl.navigateForward(['logs'], { relativeTo: this.route }),
+ },
+ ],
+ 'Backups': [
+ {
+ title: 'Create Backup',
+ icon: 'save-outline',
+ action: () => this.navCtrl.navigateForward(['backup'], { relativeTo: this.route }),
+ },
+ ],
+ 'Power': [
+ {
+ title: 'Restart',
+ icon: 'reload-outline',
+ action: () => this.presentAlertRestart(),
+ },
+ {
+ title: 'Shutdown',
+ icon: 'power',
+ action: () => this.presentAlertShutdown(),
+ },
+ ],
+ }
+ }
+
+ asIsOrder () {
+ return 0
}
}
@@ -100,4 +170,10 @@ const LoadingSpinner: (m?: string) => LoadingOptions = (m) => {
} as LoadingOptions
}
-
+interface ServerSettings {
+ [key: string]: {
+ title: string
+ icon: string
+ action: Function
+ }[]
+}
diff --git a/ui/src/app/services/api/mock-api.service.ts b/ui/src/app/services/api/mock-api.service.ts
index faa471e86..c20754cb4 100644
--- a/ui/src/app/services/api/mock-api.service.ts
+++ b/ui/src/app/services/api/mock-api.service.ts
@@ -469,7 +469,7 @@ export class MockApiService extends ApiService {
async getMarketplaceData (params: RR.GetMarketplaceDataReq): Promise {
await pauseFor(2000)
return {
- categories: ['featured', 'bitcoin', 'lightning', 'data', 'messaging'],
+ categories: ['featured', 'bitcoin', 'lightning', 'data', 'messaging', 'social', 'alt coin'],
}
}
diff --git a/ui/src/app/services/api/mock-app-fixures.ts b/ui/src/app/services/api/mock-app-fixures.ts
index 5ff7a69ed..8b937e939 100644
--- a/ui/src/app/services/api/mock-app-fixures.ts
+++ b/ui/src/app/services/api/mock-app-fixures.ts
@@ -20,7 +20,7 @@ export module Mock {
},
{
id: 'lnd',
- title: 'Lightning Network Daemon',
+ title: 'LND',
version: '0.11.1',
descriptionShort: 'A BOLT-compliant, lightning network node.',
icon: 'assets/img/service-icons/lnd.png',
@@ -157,7 +157,7 @@ export module Mock {
export const MockManifestLnd: Manifest = {
id: 'lnd',
- title: 'Lightning Network Daemon',
+ title: 'LND',
version: '0.11.1',
description: {
short: 'A bolt spec compliant client.',
diff --git a/ui/src/app/services/pkg-status-rendering.service.ts b/ui/src/app/services/pkg-status-rendering.service.ts
index 0e47bbc08..6ef09d9dd 100644
--- a/ui/src/app/services/pkg-status-rendering.service.ts
+++ b/ui/src/app/services/pkg-status-rendering.service.ts
@@ -20,7 +20,7 @@ function handleInstalledState (status: Status): PkgStatusRendering {
}
if (Object.keys(status['dependency-errors']).length) {
- return { display: 'Dependency Issue', color: 'warning', showDots: false, feStatus: FEStatus.DependencyIssue }
+ return { display: 'Needs Attention', color: 'warning', showDots: false, feStatus: FEStatus.DependencyIssue }
}
switch (status.main.status) {
@@ -36,7 +36,7 @@ function handleRunningState (status: MainStatusRunning): PkgStatusRendering {
if (Object.values(status.health).some(h => h.result === 'failure')) {
return { display: 'Needs Attention', color: 'danger', showDots: false, feStatus: FEStatus.NeedsAttention }
} else if (Object.values(status.health).some(h => h.result === 'starting')) {
- return { display: 'Starting Up', color: 'warning', showDots: true, feStatus: FEStatus.Starting }
+ return { display: 'Starting', color: 'warning', showDots: true, feStatus: FEStatus.Starting }
} else if (Object.values(status.health).some(h => h.result === 'loading')) {
const firstLoading = Object.values(status.health).find(h => h.result === 'loading') as HealthCheckResultLoading
return { display: firstLoading.message, color: 'warning', showDots: true, feStatus: FEStatus.Loading }
diff --git a/ui/src/app/services/startup-alerts.notifier.ts b/ui/src/app/services/startup-alerts.notifier.ts
index 3770dd767..3af4e7a2c 100644
--- a/ui/src/app/services/startup-alerts.notifier.ts
+++ b/ui/src/app/services/startup-alerts.notifier.ts
@@ -183,7 +183,7 @@ export class StartupAlertsNotifier {
{
text: 'View in Marketplace',
handler: () => {
- return this.navCtrl.navigateForward('/services/marketplace').then(() => resolve(false))
+ return this.navCtrl.navigateForward('/marketplace').then(() => resolve(false))
},
},
],
diff --git a/ui/src/global.scss b/ui/src/global.scss
index 5b4c09a6b..bf26f5d38 100644
--- a/ui/src/global.scss
+++ b/ui/src/global.scss
@@ -117,9 +117,12 @@
white-space: normal !important;
}
+ion-card-title {
+ font-family: 'Montserrat';
+}
+
ion-title {
font-family: 'Montserrat';
- font-weight: unset;
}
ion-textarea {
@@ -272,11 +275,6 @@ ion-avatar {
--border-radius: var(--icon-border-radius);
}
-.no-white-space {
- --white-space: 0;
- --box-shadow: 3px 3px 10px var(--ion-color-primary);
-}
-
.notifier-item {
margin: 12px;
margin-top: 0px;
@@ -301,7 +299,6 @@ ion-item-divider {
color: var(--ion-color-medium);
font-size: medium;
padding-left: 10px;
- font-weight: unset;
}
.dots {