From dd2b8c8c949de4c6d5b6d11e5f5396cd2cc4122a Mon Sep 17 00:00:00 2001 From: Senyoret1 <34079003+Senyoret1@users.noreply.github.com> Date: Sun, 23 Oct 2022 18:07:41 -0400 Subject: [PATCH] Bug fixes for the UI --- .../components/pages/node/node.component.ts | 41 ++++++++++++++----- .../app/services/proxy-discovery.service.ts | 4 ++ 2 files changed, 34 insertions(+), 11 deletions(-) diff --git a/static/skywire-manager-src/src/app/components/pages/node/node.component.ts b/static/skywire-manager-src/src/app/components/pages/node/node.component.ts index 570c38aea0..625b19411d 100644 --- a/static/skywire-manager-src/src/app/components/pages/node/node.component.ts +++ b/static/skywire-manager-src/src/app/components/pages/node/node.component.ts @@ -1,8 +1,9 @@ import { Component, OnDestroy, OnInit, NgZone, Injector } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { Subscription } from 'rxjs/internal/Subscription'; -import { Observable, ReplaySubject, timer } from 'rxjs'; +import { Observable, of, ReplaySubject, timer } from 'rxjs'; import { HttpErrorResponse } from '@angular/common/http'; +import { delay } from 'rxjs/operators'; import { NodeService, BackendData } from '../../../services/node.service'; import { Node } from '../../../app.datatypes'; @@ -57,10 +58,15 @@ export class NodeComponent implements OnInit, OnDestroy { * Keeps track of the browser URL. */ private lastUrl: string; + /** + * Allows to know if a route event already fired. + */ + private initialRouteEventFired = false; private dataSubscription: Subscription; private updateTimeSubscription: Subscription; private navigationsSubscription: Subscription; + private initSubscription: Subscription; // Vars for keeping track of the data updating. secondsSinceLastUpdate = 0; @@ -111,17 +117,9 @@ export class NodeComponent implements OnInit, OnDestroy { this.navigationsSubscription = router.events.subscribe(event => { if (event['urlAfterRedirects']) { - NodeComponent.currentNodeKey = this.route.snapshot.params['key']; - if (this.nodeActionsHelper) { - this.nodeActionsHelper.setCurrentNodeKey(NodeComponent.currentNodeKey); - } this.lastUrl = event['urlAfterRedirects'] as string; - this.updateTabBar(); - this.navigationsSubscription.unsubscribe(); - - // Load the data. - this.nodeService.startRequestingSpecificNode(NodeComponent.currentNodeKey); - this.startGettingData(); + this.processRouteUpdate(); + this.initialRouteEventFired = true; } }); } @@ -134,6 +132,26 @@ export class NodeComponent implements OnInit, OnDestroy { this.secondsSinceLastUpdate = Math.floor((Date.now() - this.lastUpdate) / 1000); })); }); + + this.initSubscription = of(0).pipe(delay(500)).subscribe(() => { + if (!this.initialRouteEventFired) { + this.lastUrl = window.location.href; + this.processRouteUpdate(); + } + }); + } + + private processRouteUpdate() { + NodeComponent.currentNodeKey = this.route.snapshot.params['key']; + if (this.nodeActionsHelper) { + this.nodeActionsHelper.setCurrentNodeKey(NodeComponent.currentNodeKey); + } + this.updateTabBar(); + this.navigationsSubscription.unsubscribe(); + + // Load the data. + this.nodeService.startRequestingSpecificNode(NodeComponent.currentNodeKey); + this.startGettingData(); } private updateTabBar() { @@ -311,6 +329,7 @@ export class NodeComponent implements OnInit, OnDestroy { this.dataSubscription.unsubscribe(); this.updateTimeSubscription.unsubscribe(); this.navigationsSubscription.unsubscribe(); + this.initSubscription.unsubscribe(); NodeComponent.currentInstanceInternal = undefined; NodeComponent.currentNodeKey = undefined; diff --git a/static/skywire-manager-src/src/app/services/proxy-discovery.service.ts b/static/skywire-manager-src/src/app/services/proxy-discovery.service.ts index 493949503c..7711a68a57 100644 --- a/static/skywire-manager-src/src/app/services/proxy-discovery.service.ts +++ b/static/skywire-manager-src/src/app/services/proxy-discovery.service.ts @@ -34,6 +34,10 @@ export class ProxyDiscoveryService { // In case of error, retry. retryWhen(errors => errors.pipe(delay(4000))), map((result: any[]) => { + if (!result) { + result = []; + } + // Process the data. result.forEach(proxy => { const currentEntry = new ProxyDiscoveryEntry();