diff --git a/src/app/core/services/daemon/daemon-data.service.ts b/src/app/core/services/daemon/daemon-data.service.ts index 61920dc..3fe29c2 100644 --- a/src/app/core/services/daemon/daemon-data.service.ts +++ b/src/app/core/services/daemon/daemon-data.service.ts @@ -377,6 +377,8 @@ export class DaemonDataService { return; } + await this.refreshProcessStats(); + this._gettingDaemonInfo = true; this._daemonInfo = await this.daemonService.getInfo(); this._gettingDaemonInfo = false; @@ -447,8 +449,6 @@ export class DaemonDataService { this._connections = await this.daemonService.getConnections(); this._gettingConnections = false; - await this.refreshProcessStats(); - this._lastRefreshHeight = this._daemonInfo.heightWithoutBootstrap; this._lastRefresh = Date.now(); } catch(error) { diff --git a/src/app/core/services/daemon/daemon.service.ts b/src/app/core/services/daemon/daemon.service.ts index 9151272..9dd249c 100644 --- a/src/app/core/services/daemon/daemon.service.ts +++ b/src/app/core/services/daemon/daemon.service.ts @@ -119,6 +119,7 @@ export class DaemonService { public restarting: boolean = false; public disablingSync: boolean = false; public enablingSync: boolean = false; + public startedAt?: Date; public readonly onDaemonStatusChanged: EventEmitter = new EventEmitter(); public readonly onDaemonStopStart: EventEmitter = new EventEmitter(); @@ -373,21 +374,25 @@ export class DaemonService { this.delay(3000).then(() => { this.isRunning(true).then((running: boolean) => { this.onDaemonStatusChanged.emit(running); + this.startedAt = new Date(); this.starting = false; resolve(); }).catch((error: any) => { console.error(error); this.onDaemonStatusChanged.emit(false); + this.startedAt = undefined; this.starting = false; reject(error); }); }).catch((error: any) => { + this.startedAt = undefined; console.error(error); }); } else { console.log("Daemon not started"); this.onDaemonStatusChanged.emit(false); + this.startedAt = undefined; this.starting = false; reject('Could not start daemon'); } diff --git a/src/app/pages/detail/detail.component.ts b/src/app/pages/detail/detail.component.ts index 1288604..d25aaec 100644 --- a/src/app/pages/detail/detail.component.ts +++ b/src/app/pages/detail/detail.component.ts @@ -5,6 +5,7 @@ import { NavbarService } from '../../shared/components/navbar/navbar.service'; import { DaemonService, DaemonDataService } from '../../core/services'; import { Subscription } from 'rxjs'; import { Connection, Span } from '../../../common'; +import { SimpleBootstrapCard } from '../../shared/utils'; @Component({ selector: 'app-detail', @@ -27,8 +28,6 @@ export class DetailComponent implements AfterViewInit, OnDestroy { public readonly navbarLinks: NavbarLink[]; - //private get syncStatus: string; - //#region Sync Info private get height(): number { @@ -107,7 +106,7 @@ export class DetailComponent implements AfterViewInit, OnDestroy { //#endregion - public cards: Card[]; + public cards: SimpleBootstrapCard[]; private subscriptions: Subscription[] = []; @@ -131,7 +130,7 @@ export class DetailComponent implements AfterViewInit, OnDestroy { } this.ngZone.run(() => { - this.cards = this.createLoadingCards(); + this.cards = this.createCards(); }); })); @@ -208,49 +207,43 @@ export class DetailComponent implements AfterViewInit, OnDestroy { this.refreshSpansTable(); } - private createLoadingCards(): Card[] { - return [ - new Card('Connection Status', this.connectionStatus, true), - new Card('Network Type', this.networkType, true), - new Card('Node Type', this.nodeType, true), - new Card('Sync progress', this.syncProgress, true), - new Card('Scan Height', `${this.height} / ${this.targetHeight}`, true), - new Card('Next needed pruning seed', `${this.nextNeededPruningSeed}`, true), - new Card('Block count', `${this.blockCount}`, true), - new Card('Monero version', this.version, true), - new Card('Blockchain size', `${this.blockchainSize} GB`, true), - new Card('Disk usage', `${this.diskUsage} %`, true), - new Card('Transaction count', `${this.txCount}`, true), - new Card('Pool size', `${this.poolSize}`, true) - ]; - } - - private createCards(): Card[] { + private createCards(): SimpleBootstrapCard[] { if (!this.daemonRunning && !this.daemonService.starting) { return []; } - if (this.daemonData.initializing || this.daemonService.starting) { - return this.createLoadingCards(); + const loading = this.daemonData.initializing || this.daemonService.starting; + + const cards: SimpleBootstrapCard[] = []; + + if (this.daemonService.startedAt) { + cards.push(new SimpleBootstrapCard('Started At', `${this.daemonService.startedAt.toLocaleDateString()} ${this.daemonService.startedAt.toLocaleTimeString()}`)); } - const cards = [ - new Card('Connection Status', this.connectionStatus), - new Card('Network Type', this.networkType), - new Card('Node Type', this.nodeType), - new Card('Sync progress', this.syncProgress), - new Card('Scan Height', `${this.height} / ${this.targetHeight}`), - new Card('Next needed pruning seed', `${this.nextNeededPruningSeed}`), - new Card('Block count', `${this.blockCount}`), - new Card('Monero version', this.version), - new Card('Blockchain size', `${this.blockchainSize} GB`), - new Card('Disk usage', `${this.diskUsage} %`), - new Card('Transaction count', `${this.txCount}`), - new Card('Pool size', `${this.poolSize}`) - ]; + + cards.push( + new SimpleBootstrapCard('Connection Status', this.connectionStatus, loading), + new SimpleBootstrapCard('Network Type', this.networkType, loading), + new SimpleBootstrapCard('Node Type', this.nodeType, loading), + new SimpleBootstrapCard('Sync progress', this.syncProgress, loading), + new SimpleBootstrapCard('Scan Height', `${this.height} / ${this.targetHeight}`, loading), + new SimpleBootstrapCard('Next needed pruning seed', `${this.nextNeededPruningSeed}`, loading), + new SimpleBootstrapCard('Block count', `${this.blockCount}`, loading), + new SimpleBootstrapCard('Monero version', this.version, loading), + new SimpleBootstrapCard('Blockchain size', `${this.blockchainSize} GB`, loading), + new SimpleBootstrapCard('Transaction count', `${this.txCount}`, loading), + new SimpleBootstrapCard('Pool size', `${this.poolSize}`, loading), + new SimpleBootstrapCard('Disk usage', `${this.diskUsage} %`, loading) + ); if (this.daemonData.processStats) { cards.push( - new Card('CPU usage', `${this.daemonData.processStats.cpu.toFixed(2)} %`), - new Card('Memory usage', `${(this.daemonData.processStats.memory / 1024 / 1024).toFixed(2)} MB`) + new SimpleBootstrapCard('CPU usage', `${this.daemonData.processStats.cpu.toFixed(2)} %`), + new SimpleBootstrapCard('Memory usage', `${(this.daemonData.processStats.memory / 1024 / 1024).toFixed(2)} MB`) + ); + } + else { + cards.push( + new SimpleBootstrapCard('CPU usage', ``, true), + new SimpleBootstrapCard('Memory usage', ``, true) ); } @@ -274,15 +267,3 @@ export class DetailComponent implements AfterViewInit, OnDestroy { } } - -class Card { - public header: string; - public content: string; - public loading: boolean; - - constructor(header: string, content: string, loading: boolean = false) { - this.header = header; - this.content = content; - this.loading = loading; - } -} \ No newline at end of file diff --git a/src/styles.scss b/src/styles.scss index db759e9..62776a9 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -29,7 +29,7 @@ $primary: #ff5733; } .sidebar .nav-link { - font-size: .875rem; + font-size: 1.075rem; font-weight: 500; }