From b3fe55a895f06257e62f72a73e573936ce81ff6c Mon Sep 17 00:00:00 2001
From: Drew Ansbacher <drew.ansbacher@gmail.com>
Date: Thu, 30 Dec 2021 11:27:17 -0700
Subject: [PATCH] Bugfix/metrics leak (#1008)

* metrics leak potential fix:

* typo

* max of that or zero

* page movement

* animation edit

Co-authored-by: Drew Ansbacher <drew.ansbacher@spiredigital.com>
---
 .../apps-routes/app-metrics/app-metrics.page.html      |  1 +
 .../pages/apps-routes/app-metrics/app-metrics.page.ts  |  3 ++-
 .../marketplace-list/marketplace-list.page.html        |  2 +-
 .../server-metrics/server-metrics.page.html            |  1 +
 .../server-metrics/server-metrics.page.scss            |  2 +-
 .../server-metrics/server-metrics.page.ts              |  3 ++-
 ui/src/app/pages/server-routes/wifi/wifi.page.ts       |  4 ++--
 ui/src/global.scss                                     | 10 ++++++++++
 8 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.html b/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.html
index 9d8365124..c5d99df39 100644
--- a/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.html
+++ b/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.html
@@ -4,6 +4,7 @@
       <ion-back-button [defaultHref]="'/services/' + pkgId"></ion-back-button>
     </ion-buttons>
     <ion-title>Monitor</ion-title>
+    <ion-title slot="end"><ion-spinner name="dots" class="fader"></ion-spinner></ion-title>
   </ion-toolbar>
 </ion-header>
 
diff --git a/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.ts b/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.ts
index 9b4beda0f..f7163cb89 100644
--- a/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.ts
+++ b/ui/src/app/pages/apps-routes/app-metrics/app-metrics.page.ts
@@ -45,8 +45,9 @@ export class AppMetricsPage {
   async startDaemon (): Promise<void> {
     this.going = true
     while (this.going) {
+      const startTime = Date.now()
       await this.getMetrics()
-      await pauseFor(250)
+      await pauseFor(Math.max(4000 - (Date.now() - startTime), 0))
     }
   }
 
diff --git a/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
index c36158a20..63d4ad2ca 100644
--- a/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
+++ b/ui/src/app/pages/marketplace-routes/marketplace-list/marketplace-list.page.html
@@ -98,7 +98,7 @@
         <ion-col *ngFor="let pkg of pkgs" sizeXs="12" sizeSm="12" sizeMd="6">
           <ion-item [routerLink]="['/marketplace', pkg.manifest.id]">
             <ion-thumbnail slot="start">
-              <img [src]="pkg.icon" />
+              <img [src]="'/marketplace' + pkg.icon" />
             </ion-thumbnail>
             <ion-label>
               <h2 style="font-family: 'Montserrat'; font-weight: bold;">{{ pkg.manifest.title }}</h2>
diff --git a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.html b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.html
index 80c0ca6cf..96251175b 100644
--- a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.html
+++ b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.html
@@ -4,6 +4,7 @@
       <ion-back-button defaultHref="embassy"></ion-back-button>
     </ion-buttons>
     <ion-title>Monitor</ion-title>
+    <ion-title slot="end"><ion-spinner name="dots" class="fader"></ion-spinner></ion-title>
   </ion-toolbar>
 </ion-header>
 
diff --git a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.scss b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.scss
index bee398a1b..eea898305 100644
--- a/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.scss
+++ b/ui/src/app/pages/server-routes/server-metrics/server-metrics.page.scss
@@ -1,3 +1,3 @@
 .metric-note {
   font-size: 16px;
-}
+}
\ No newline at end of file
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 59f77310c..4a9703155 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
@@ -43,8 +43,9 @@ export class ServerMetricsPage {
   private async startDaemon (): Promise<void> {
     this.going = true
     while (this.going) {
+      const startTime = Date.now()
       await this.getMetrics()
-      await pauseFor(250)
+      await pauseFor(4000 - Math.max(Date.now() - startTime, 0))
     }
   }
 
diff --git a/ui/src/app/pages/server-routes/wifi/wifi.page.ts b/ui/src/app/pages/server-routes/wifi/wifi.page.ts
index 94d0125ca..5674ffeb7 100644
--- a/ui/src/app/pages/server-routes/wifi/wifi.page.ts
+++ b/ui/src/app/pages/server-routes/wifi/wifi.page.ts
@@ -228,7 +228,7 @@ export class WifiPage {
   private async connect (ssid: string): Promise<void> {
     const loader = await this.loadingCtrl.create({
       spinner: 'lines',
-      message: 'Connecting. This could take while...',
+      message: 'Connecting. This could take a while...',
       cssClass: 'loader',
     })
     await loader.present()
@@ -287,7 +287,7 @@ export class WifiPage {
   private async saveAndConnect (ssid: string, password: string): Promise<void> {
     const loader = await this.loadingCtrl.create({
       spinner: 'lines',
-      message: 'Connecting. This could take while...',
+      message: 'Connecting. This could take a while...',
       cssClass: 'loader',
     })
     await loader.present()
diff --git a/ui/src/global.scss b/ui/src/global.scss
index fd2bdbe61..5853f6b57 100644
--- a/ui/src/global.scss
+++ b/ui/src/global.scss
@@ -336,3 +336,13 @@ h2 {
     content: "...";
   }
 }
+
+@keyframes flickerAnimation {
+  0%   { opacity:1; }
+  20%  { opacity:0; }
+  60%  { opacity:0; }
+  100% { opacity:1; }
+}
+.fader {
+  animation: flickerAnimation 4s infinite;
+}