feat(pages): show response time

src/app/pages/pages.component.ts

@@ -1,6 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { NbMenuItem, NbSidebarService } from '@nebular/theme';
 import { ResponsiveSizeInfoRx } from 'ngx-responsive';
+import { ForamtDuration } from '../utils/format-duration';
+import { ConnectionService } from './connection.service';
 import { CurrentUserService } from './current-user.service';
 import { MENU_ITEMS } from './pages-menu';
 
@@ -57,6 +59,7 @@ export class PagesComponent implements OnInit {
 	constructor(
 		private sidebarService: NbSidebarService,
 		private currUserService: CurrentUserService,
+		private rstService: ConnectionService,
 		private resp: ResponsiveSizeInfoRx
 	) {
 		resp.connect();
@@ -65,6 +68,8 @@ export class PagesComponent implements OnInit {
 
 	mainSideBarFixed = true;
 
+	currUser = '';
+
 	toggleNav() {
 		this.sidebarService.toggle(false, 'nav');
 	}
@@ -78,7 +83,8 @@ export class PagesComponent implements OnInit {
 		this.currUserService.currentUserFlow$.getSupersetOutput().subscribe(node => {
 			if (node[1].length !== 0) return;
 			const userGroup = this.menu[0];
-			userGroup.title = node[0].name;
+			this.currUser = node[0].name;
+			userGroup.title = this.currUser;
 			userGroup.children = node[0].users
 				.filter(x => x.name !== node[0].name) // disable show current user in child item
 				.map(
@@ -99,5 +105,15 @@ export class PagesComponent implements OnInit {
 				link: 'user',
 			});
 		});
+		this.rstService.rst$.getOutput().subscribe(x => {
+			if (x[1].length !== 0) {
+				this.menu[0].title = this.currUser + ' ∞';
+				return;
+			}
+			this.menu[0].title = `${this.currUser} ${ForamtDuration.humanize(x[0]['response-time'], {
+				units: ['m', 's', 'ms'],
+				largest: 2,
+			})}`;
+		});
 	}
 }