-
-
-
- ![]()
-
-
-
-
-
-
-
- Configure
-
-
- Stop
-
-
- Fix
-
-
- Start
-
-
-
-
-
- Launch Web Interface
-
-
-
-
-
-
- {{ manifest.title }}
-
-
- {{ manifest.version | displayEmver }}
-
-
-
+
+
+
+ ![]()
+
+
+
+
+
+
+
+ Configure
+
+
+ Stop
+
+
+ Fix
+
+
+ Start
+
+
+
+
+
+ Launch Web Interface
+
+
+
+
+
+ {{ manifest.title }}
+
+
+ {{ manifest.version | displayEmver }}
+
+
+
+
+{{ button.title }}
+
+
-
-
-
- ![]()
-
-
-
+
+
+
+
+
+ Dependencies
+
+
+
+
-
-
-
-
- Uninstall
-
-
-
+
+
+
+
+ {{ localDep ? (localDep | manifest).title : pkg.installed.status['dependency-errors'][dep.key]?.title }}
-{{ manifest.dependencies[dep.key].version | displayEmver }}
-
+
+
+
+ ![]()
+
+
+
-
- View
-
-
-
-
- Install
+
+ View
-
-
- Start
+
+
+ Install
-
- Update
-
-
- Configure
-
-
-
+
+ Start
+
+
+ Update
+
+
+ Configure
+
+
-
-
-
- {{ localDep ? (localDep | manifest).title : pkg.installed.status['dependency-errors'][dep.key]?.title }}
+{{ manifest.dependencies[dep.key].version | displayEmver }}
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ prop.key }}
+{{ prop.key }}
+{{ prop.value }}
+
+
+ {{ health.key }}
+No properties.
+No values.
+
+
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 5efc1ee9e..f6c81ffd5 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
@@ -1,15 +1,14 @@
import { Component } from '@angular/core'
import { ActivatedRoute } from '@angular/router'
import { ApiService } from 'src/app/services/api/api.service'
-import { isEmptyObject, pauseFor } from 'src/app/util/misc.util'
-import { BehaviorSubject, Subject } from 'rxjs'
+import { Subscription } from 'rxjs'
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 * as JsonPointer from 'json-pointer'
import { FEStatus } from 'src/app/services/pkg-status-rendering.service'
@Component({
@@ -23,10 +22,11 @@ export class AppPropertiesPage {
pkgId: string
pointer: string
qrCode: string
- properties$ = new BehaviorSubject({ })
- hasProperties$ = new BehaviorSubject(null)
+ properties: PackageProperties
+ node: PackageProperties
unmasked: { [key: string]: boolean } = { }
FeStatus = FEStatus
+ subs: Subscription[]
constructor (
private readonly route: ActivatedRoute,
@@ -36,28 +36,27 @@ export class AppPropertiesPage {
private readonly popoverCtrl: PopoverController,
private readonly propertyStore: PropertyStore,
private readonly navCtrl: NavController,
- public patch: PatchDbModel,
+ public readonly patch: PatchDbModel,
) { }
- ngOnInit () {
+ async ngOnInit () {
this.pkgId = this.route.snapshot.paramMap.get('pkgId')
- this.pointer = this.route.queryParams['pointer']
- this.getProperties().then(() => this.loading = false)
+ await this.getProperties()
- this.propertyStore.watch$().subscribe(m => {
- const properties = JSONpointer.get(m, this.pointer || '')
- this.properties$.next(properties)
- })
- this.properties$.subscribe(m => {
- this.hasProperties$.next(!isEmptyObject(m))
- })
- this.route.queryParams.subscribe(queryParams => {
- if (queryParams['pointer'] === this.pointer) return
- this.pointer = queryParams['pointer']
- const properties = JSONpointer.get(this.propertyStore.properties$.getValue(), this.pointer || '')
- this.properties$.next(properties)
- })
+ this.subs = [
+ this.route.queryParams.subscribe(queryParams => {
+ if (queryParams['pointer'] === this.pointer) return
+ this.pointer = queryParams['pointer']
+ this.node = JsonPointer.get(this.properties, this.pointer || '')
+ }),
+ ]
+
+ this.loading = false
+ }
+
+ ngOnDestroy () {
+ this.subs.forEach(sub => sub.unsubscribe())
}
async doRefresh (event: any) {
@@ -118,8 +117,8 @@ export class AppPropertiesPage {
private async getProperties (): Promise {
try {
- const properties = await this.apiService.getPackageProperties({ id: this.pkgId })
- this.propertyStore.update(properties)
+ this.properties = await this.apiService.getPackageProperties({ id: this.pkgId })
+ this.node = JsonPointer.get(this.properties, this.pointer || '')
} catch (e) {
console.error(e)
this.error = e.message
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 dbbad4726..1fe38bda2 100644
--- a/ui/src/app/pages/apps-routes/apps-routing.module.ts
+++ b/ui/src/app/pages/apps-routes/apps-routing.module.ts
@@ -39,6 +39,14 @@ const routes: Routes = [
path: 'installed/:pkgId/logs',
loadChildren: () => import('./app-logs/app-logs.module').then(m => m.AppLogsPageModule),
},
+ {
+ path: 'installed/:pkgId/manifest',
+ loadChildren: () => import('./app-manifest/app-manifest.module').then(m => m.AppManifestPageModule),
+ },
+ {
+ path: 'installed/:pkgId/metrics',
+ loadChildren: () => import('./app-metrics/app-metrics.module').then(m => m.AppMetricsPageModule),
+ },
{
path: 'installed/:pkgId/properties',
loadChildren: () => import('./app-properties/app-properties.module').then(m => m.AppPropertiesPageModule),
diff --git a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.ts b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.ts
index 5b3c085c3..e2c91f316 100644
--- a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.ts
+++ b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.ts
@@ -1,5 +1,5 @@
import { Component } from '@angular/core'
-import { ServerMetrics } from 'src/app/services/api/api-types'
+import { Metrics } from 'src/app/services/api/api-types'
import { ApiService } from 'src/app/services/api/api.service'
import { pauseFor } from 'src/app/util/misc.util'
@@ -12,7 +12,7 @@ export class ServerMetricsPage {
error = ''
loading = true
going = false
- metrics: ServerMetrics = { }
+ metrics: Metrics = { }
constructor (
private readonly apiService: ApiService,
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 92f085640..14e903d59 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
@@ -12,60 +12,60 @@
Backups
- Create Backup Create Backup
Insights
- About About
- Monitor Monitor
- Logs Logs
Settings
- General General
- LAN LAN
- WiFi WiFi
- Developer Options Developer Options
Power
- Restart Restart
- Shutdown Shutdown
\ No newline at end of file
diff --git a/ui/src/app/pipes/empty.pipe.ts b/ui/src/app/pipes/empty.pipe.ts
index e78c1581f..bc72cf602 100644
--- a/ui/src/app/pipes/empty.pipe.ts
+++ b/ui/src/app/pipes/empty.pipe.ts
@@ -5,7 +5,8 @@ import { isEmptyObject } from '../util/misc.util'
name: 'empty',
})
export class EmptyPipe implements PipeTransform {
- transform (obj: { }): boolean {
- return isEmptyObject(obj)
+ transform (val: object | [] = { }): boolean {
+ if (Array.isArray(val)) return !val.length
+ return isEmptyObject(val)
}
}
\ No newline at end of file
diff --git a/ui/src/app/pipes/typeof.pipe.ts b/ui/src/app/pipes/typeof.pipe.ts
index 6881690bf..46060c9a1 100644
--- a/ui/src/app/pipes/typeof.pipe.ts
+++ b/ui/src/app/pipes/typeof.pipe.ts
@@ -5,6 +5,12 @@ import { Pipe, PipeTransform } from '@angular/core'
})
export class TypeofPipe implements PipeTransform {
transform (value: any): any {
+ if (value === null) {
+ return 'null'
+ } else if (Array.isArray(value)) {
+ return 'array'
+ }
+
return typeof value
}
}
\ No newline at end of file
diff --git a/ui/src/app/services/api/api-types.ts b/ui/src/app/services/api/api-types.ts
index 65d8f13df..5e4620558 100644
--- a/ui/src/app/services/api/api-types.ts
+++ b/ui/src/app/services/api/api-types.ts
@@ -28,7 +28,7 @@ export module RR {
export type GetServerLogsRes = Log[]
export type GetServerMetricsReq = { } // server.metrics
- export type GetServerMetricsRes = ServerMetrics
+ export type GetServerMetricsRes = Metrics
export type UpdateServerReq = WithExpire<{ }> // server.update
export type UpdateServerRes = WithRevision
@@ -219,7 +219,7 @@ export interface ActionResponse {
qr: boolean
}
-export interface ServerMetrics {
+export interface Metrics {
[key: string]: {
[key: string]: {
value: string | number | null
diff --git a/ui/src/app/services/api/mock-app-fixures.ts b/ui/src/app/services/api/mock-app-fixures.ts
index a33706055..859335bae 100644
--- a/ui/src/app/services/api/mock-app-fixures.ts
+++ b/ui/src/app/services/api/mock-app-fixures.ts
@@ -67,17 +67,7 @@ export module Mock {
inject: false,
'shm-size': '',
},
- 'health-check': {
- type: 'docker',
- image: '',
- system: true,
- entrypoint: '',
- args: [''],
- mounts: { },
- 'io-format': DockerIoFormat.Yaml,
- inject: false,
- 'shm-size': '',
- },
+ 'health-checks': { },
config: null,
volumes: { },
'min-os-version': '0.2.12',
@@ -198,17 +188,7 @@ export module Mock {
inject: false,
'shm-size': '',
},
- 'health-check': {
- type: 'docker',
- image: '',
- system: true,
- entrypoint: '',
- args: [''],
- mounts: { },
- 'io-format': DockerIoFormat.Yaml,
- inject: false,
- 'shm-size': '',
- },
+ 'health-checks': { },
config: null,
volumes: { },
'min-os-version': '0.2.12',
@@ -353,17 +333,7 @@ export module Mock {
inject: false,
'shm-size': '',
},
- 'health-check': {
- type: 'docker',
- image: '',
- system: true,
- entrypoint: '',
- args: [''],
- mounts: { },
- 'io-format': DockerIoFormat.Yaml,
- inject: false,
- 'shm-size': '',
- },
+ 'health-checks': { },
config: null,
volumes: { },
'min-os-version': '0.2.12',
@@ -991,7 +961,7 @@ export module Mock {
},
},
},
- 'Another Property': {
+ 'Another Value': {
type: 'string',
description: 'Some more information about the service.',
copyable: false,
diff --git a/ui/src/app/services/http.service.ts b/ui/src/app/services/http.service.ts
index fedde0893..428cf220f 100644
--- a/ui/src/app/services/http.service.ts
+++ b/ui/src/app/services/http.service.ts
@@ -22,7 +22,7 @@ export class HttpService {
this.fullUrl = `${window.location.protocol}//${window.location.hostname}:${port}/${url}/${version}`
}
- watch401$ (): Observable<{ }> {
+ watchUnauth$ (): Observable<{ }> {
return this.unauthorizedApiResponse$.asObservable()
}
@@ -36,7 +36,10 @@ export class HttpService {
const res = await this.httpRequest>(httpOpts)
- if (isRpcError(res)) throw new RpcError(res.error)
+ if (isRpcError(res)) {
+ if (res.error.code === 34) this.unauthorizedApiResponse$.next(true)
+ throw new RpcError(res.error)
+ }
if (isRpcSuccess(res)) return res.result
}
diff --git a/ui/src/app/services/pkg-status-rendering.service.ts b/ui/src/app/services/pkg-status-rendering.service.ts
index 7c5ffc731..d1545359f 100644
--- a/ui/src/app/services/pkg-status-rendering.service.ts
+++ b/ui/src/app/services/pkg-status-rendering.service.ts
@@ -1,4 +1,4 @@
-import { PackageDataEntry, PackageMainStatus, PackageState, Status } from '../models/patch-db/data-model'
+import { HealthCheckResultWarmingUp, MainStatus, MainStatusRunning, PackageDataEntry, PackageMainStatus, PackageState, Status } from '../models/patch-db/data-model'
import { ConnectionState } from './connection.service'
export function renderPkgStatus (pkg: PackageDataEntry, connection: ConnectionState): PkgStatusRendering {
@@ -19,16 +19,26 @@ function handleInstalledState (status: Status): PkgStatusRendering {
return { display: 'Needs Config', color: 'warning', showDots: false, feStatus: FEStatus.NeedsConfig }
}
- if (Object.values(status['dependency-errors']).length) {
+ if (Object.keys(status['dependency-errors']).length) {
return { display: 'Dependency Issue', color: 'warning', showDots: false, feStatus: FEStatus.DependencyIssue }
}
switch (status.main.status) {
- case PackageMainStatus.Running: return { display: 'Running', color: 'success', showDots: false, feStatus: FEStatus.Running }
case PackageMainStatus.Stopping: return { display: 'Stopping', color: 'dark', showDots: true, feStatus: FEStatus.Stopping }
case PackageMainStatus.Stopped: return { display: 'Stopped', color: 'medium', showDots: false, feStatus: FEStatus.Stopped }
case PackageMainStatus.BackingUp: return { display: 'Backing Up', color: 'warning', showDots: true, feStatus: FEStatus.BackingUp }
case PackageMainStatus.Restoring: return { display: 'Restoring', color: 'primary', showDots: true, feStatus: FEStatus.Restoring }
+ case PackageMainStatus.Running: return handleRunningState(status.main)
+ }
+}
+
+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 === 'warming-up')) {
+ return { display: 'Starting Up', color: 'warning', showDots: true, feStatus: FEStatus.StartingUp }
+ } else {
+ return { display: 'Running', color: 'success', showDots: false, feStatus: FEStatus.Running }
}
}
@@ -52,6 +62,8 @@ export enum FEStatus {
BackingUp = 'backing-up',
Restoring = 'restoring',
// FE
+ NeedsAttention = 'needs-attention',
+ StartingUp = 'starting-up',
Connecting = 'connecting',
DependencyIssue = 'dependency-issue',
NeedsConfig = 'needs-config',
diff --git a/ui/ui-config.json b/ui/ui-config.json
index 7f06abd3a..65a58f496 100644
--- a/ui/ui-config.json
+++ b/ui/ui-config.json
@@ -10,7 +10,7 @@
},
"mocks": {
"enabled": true,
- "connection": "poll",
+ "connection": "ws",
"rpcPort": "5959",
"wsPort": "5960",
"maskAs": "tor",