Improvements for the manager

static/skywire-manager-src/src/app/app-routing.module.ts

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 
+import { StartComponent } from './components/pages/start/start.component';
 import { LoginComponent } from './components/pages/login/login.component';
 import { NodeListComponent } from './components/pages/node-list/node-list.component';
 import { NodeComponent } from './components/pages/node/node.component';
@@ -15,6 +16,10 @@ import { NodeInfoComponent } from './components/pages/node/node-info/node-info.c
 import { AllLabelsComponent } from './components/pages/settings/all-labels/all-labels.component';
 
 const routes: Routes = [
+  {
+    path: '',
+    component: StartComponent
+  },
   {
     path: 'login',
     component: LoginComponent
@@ -121,7 +126,7 @@ const routes: Routes = [
   },
   {
     path: '**',
-    redirectTo: 'login'
+    redirectTo: ''
   },
 ];
 

static/skywire-manager-src/src/app/app.module.ts

@@ -4,6 +4,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { HttpClientModule } from '@angular/common/http';
 import { AppComponent } from './app.component';
 import { AppRoutingModule } from './app-routing.module';
+import { StartComponent } from './components/pages/start/start.component';
 import { LoginComponent } from './components/pages/login/login.component';
 import { NodeListComponent } from './components/pages/node-list/node-list.component';
 import { NodeComponent } from './components/pages/node/node.component';
@@ -93,6 +94,7 @@ const globalRippleConfig: RippleGlobalOptions = {
 @NgModule({
   declarations: [
     AppComponent,
+    StartComponent,
     LoginComponent,
     NodeListComponent,
     NodeComponent,

static/skywire-manager-src/src/app/components/pages/node-list/node-list.component.ts

@@ -275,14 +275,16 @@ export class NodeListComponent implements OnInit, OnDestroy {
     this.updateTimeSubscription.unsubscribe();
     this.navigationsSubscription.unsubscribe();
     this.languageSubscription.unsubscribe();
-    this.dataFiltererSubscription.unsubscribe();
 
     if (this.updateSubscription) {
       this.updateSubscription.unsubscribe();
     }
 
     this.dataSortedSubscription.unsubscribe();
     this.dataSorter.dispose();
+
+    this.dataFiltererSubscription.unsubscribe();
+    this.dataFilterer.dispose();
   }
 
   /**

static/skywire-manager-src/src/app/components/pages/node/apps/node-apps-list/node-apps-list.component.ts

@@ -142,6 +142,11 @@ export class NodeAppsListComponent implements OnDestroy {
     },
   ];
 
+  /**
+   * Indicates that, after updating the data, it has to be updated again after a small delay.
+   */
+  private refreshAgain = false;
+
   private navigationsSubscription: Subscription;
   private operationSubscriptionsGroup: Subscription[] = [];
 
@@ -193,6 +198,7 @@ export class NodeAppsListComponent implements OnDestroy {
     this.dataSortedSubscription.unsubscribe();
     this.dataFiltererSubscription.unsubscribe();
     this.dataSorter.dispose();
+    this.dataFilterer.dispose();
   }
 
   /**
@@ -238,7 +244,7 @@ export class NodeAppsListComponent implements OnDestroy {
    */
   changeStateOfSelected(startApps: boolean) {
     const elementsToChange: string[] = [];
-    // Ignore all elements shich already have the desired settings applied.
+    // Ignore all elements which already have the desired settings applied.
     this.selections.forEach((val, key) => {
       if (val) {
         if ((startApps && this.appsMap.get(key).status !== 1) || (!startApps && this.appsMap.get(key).status === 1)) {
@@ -384,14 +390,22 @@ export class NodeAppsListComponent implements OnDestroy {
           confirmationDialog.close();
         }
 
-        // Make the parent page reload the data.
-        setTimeout(() => NodeComponent.refreshCurrentDisplayedData(), 50);
+        // Make the parent page reload the data and do it again after a small delay, to catch
+        // slow changes.
+        setTimeout(() => {
+          this.refreshAgain = true;
+          NodeComponent.refreshCurrentDisplayedData();
+        }, 50);
         this.snackbarService.showDone('apps.operation-completed');
       }, (err: OperationError) => {
         err = processServiceError(err);
 
-        // Make the parent page reload the data.
-        setTimeout(() => NodeComponent.refreshCurrentDisplayedData(), 50);
+        // Make the parent page reload the data and do it again after a small delay, to catch
+        // slow changes.
+        setTimeout(() => {
+          this.refreshAgain = true;
+          NodeComponent.refreshCurrentDisplayedData();
+        }, 50);
 
         if (confirmationDialog) {
           confirmationDialog.componentInstance.showDone('confirmation.error-header-text', err.translatableErrorMsg);
@@ -474,6 +488,13 @@ export class NodeAppsListComponent implements OnDestroy {
     }
 
     this.dataSource = this.appsToShow;
+
+    // Refresh the data again after a small delay, if requested.
+    if (this.refreshAgain) {
+      this.refreshAgain = false;
+
+      setTimeout(() => NodeComponent.refreshCurrentDisplayedData(), 2000);
+    }
   }
 
   /**
@@ -532,16 +553,28 @@ export class NodeAppsListComponent implements OnDestroy {
         if (confirmationDialog) {
           confirmationDialog.close();
         }
-        // Make the parent page reload the data.
-        setTimeout(() => NodeComponent.refreshCurrentDisplayedData(), 50);
+
+        // Make the parent page reload the data and do it again after a small delay, to catch
+        // slow changes.
+        setTimeout(() => {
+          this.refreshAgain = true;
+          NodeComponent.refreshCurrentDisplayedData();
+        }, 50);
+
         this.snackbarService.showDone('apps.operation-completed');
       } else {
         this.changeAppsValRecursively(names, changingAutostart, newVal, confirmationDialog);
       }
     }, (err: OperationError) => {
       err = processServiceError(err);
 
-      setTimeout(() => NodeComponent.refreshCurrentDisplayedData(), 50);
+      // Make the parent page reload the data and do it again after a small delay, to catch
+      // slow changes.
+      setTimeout(() => {
+        this.refreshAgain = true;
+        NodeComponent.refreshCurrentDisplayedData();
+      }, 50);
+
       if (confirmationDialog) {
         confirmationDialog.componentInstance.showDone('confirmation.error-header-text', err.translatableErrorMsg);
       } else {

static/skywire-manager-src/src/app/components/pages/node/routing/route-list/route-list.component.ts

@@ -223,6 +223,7 @@ export class RouteListComponent implements OnDestroy {
     this.dataSortedSubscription.unsubscribe();
     this.dataFiltererSubscription.unsubscribe();
     this.dataSorter.dispose();
+    this.dataFilterer.dispose();
   }
 
   /**

static/skywire-manager-src/src/app/components/pages/start/start.component.html

@@ -0,0 +1,3 @@
+<div class="h-100 w-100">
+  <app-loading-indicator></app-loading-indicator>
+</div>

static/skywire-manager-src/src/app/components/pages/start/start.component.ts

@@ -0,0 +1,43 @@
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { Router } from '@angular/router';
+import { Subscription } from 'rxjs';
+
+import { AuthService, AuthStates } from '../../../services/auth.service';
+
+/**
+ * Initial utility page for redirecting the user to the real appropriate initial page.
+ * It redirects to the login page if the user is unauthorized and to the visor list in
+ * all other cases.
+ */
+@Component({
+  selector: 'app-start',
+  templateUrl: './start.component.html',
+  styleUrls: ['./start.component.scss']
+})
+export class StartComponent implements OnInit, OnDestroy {
+  private verificationSubscription: Subscription;
+
+  constructor(
+    private authService: AuthService,
+    private router: Router,
+  ) { }
+
+  ngOnInit() {
+    // Check if the user is unauthorized.
+    this.verificationSubscription = this.authService.checkLogin().subscribe(response => {
+      if (response !== AuthStates.NotLogged) {
+        this.router.navigate(['nodes'], { replaceUrl: true });
+      } else {
+        this.router.navigate(['login'], { replaceUrl: true });
+      }
+    }, () => {
+      // In case of error, go to the visor list. While trying to get the list, additional
+      // comprobations will be performed in that page.
+      this.router.navigate(['nodes'], { replaceUrl: true });
+    });
+  }
+
+  ngOnDestroy() {
+    this.verificationSubscription.unsubscribe();
+  }
+}

static/skywire-manager-src/src/app/services/node.service.ts

@@ -218,16 +218,11 @@ export class NodeService {
 
     // Get for how many ms the saved data is still valid.
     const momentOfLastCorrectUpdate = this.nodeListSubject.value ? this.nodeListSubject.value.momentOfLastCorrectUpdate : 0;
-    const remainingTime = this.calculateRemainingTime(momentOfLastCorrectUpdate);
+    let remainingTime = this.calculateRemainingTime(momentOfLastCorrectUpdate);
+    remainingTime = remainingTime > 0 ? remainingTime : 0;
 
-    if (remainingTime === 0) {
-      // Get the data from the backend.
-      this.nodeListSubject.next(null);
-      this.startDataSubscription(0, true);
-    } else {
-      // Use the data obtained the last time and schedule an update after the appropriate time.
-      this.startDataSubscription(remainingTime, true);
-    }
+    // Use the data obtained the last time and schedule an update after the appropriate time.
+    this.startDataSubscription(remainingTime, true);
   }
 
   /**