From dc1ffafdf303fba276091a29b7ce8cca72608a3d Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Tue, 11 Dec 2018 15:16:45 -0500
Subject: [PATCH] hasLoaded spinners

---
 src/app/tools/reused-passwords-report.component.html   | 9 +++++++--
 src/app/tools/reused-passwords-report.component.ts     | 5 +++--
 src/app/tools/unsecured-websites-report.component.html | 9 +++++++--
 src/app/tools/unsecured-websites-report.component.ts   | 5 +++--
 4 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/app/tools/reused-passwords-report.component.html b/src/app/tools/reused-passwords-report.component.html
index 6b7a251340..49556e36f8 100644
--- a/src/app/tools/reused-passwords-report.component.html
+++ b/src/app/tools/reused-passwords-report.component.html
@@ -1,8 +1,13 @@
 <div class="page-header">
-    <h1>{{'reusedPasswordsReport' | i18n}}</h1>
+    <h1>
+        {{'reusedPasswordsReport' | i18n}}
+        <small *ngIf="hasLoaded && loading">
+            <i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
+        </small>
+    </h1>
 </div>
 <p>{{'reusedPasswordsReportDesc' | i18n}}</p>
-<div *ngIf="loading">
+<div *ngIf="!hasLoaded && loading">
     <i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
 </div>
 <div class="mt-4" *ngIf="!loading">
diff --git a/src/app/tools/reused-passwords-report.component.ts b/src/app/tools/reused-passwords-report.component.ts
index 4fd3985072..8733c2872e 100644
--- a/src/app/tools/reused-passwords-report.component.ts
+++ b/src/app/tools/reused-passwords-report.component.ts
@@ -32,7 +32,7 @@ export class ReusedPasswordsReportComponent implements OnInit {
     constructor(private ciphersService: CipherService, private componentFactoryResolver: ComponentFactoryResolver) { }
 
     async ngOnInit() {
-        this.load();
+        await this.load();
         this.hasLoaded = true;
     }
 
@@ -52,8 +52,9 @@ export class ReusedPasswordsReportComponent implements OnInit {
                 this.passwordUseMap.set(c.login.password, 1);
             }
         });
-        this.ciphers = ciphersWithPasswords.filter((c) =>
+        const reusedPasswordCiphers = ciphersWithPasswords.filter((c) =>
             this.passwordUseMap.has(c.login.password) && this.passwordUseMap.get(c.login.password) > 1);
+        this.ciphers = reusedPasswordCiphers;
         this.loading = false;
     }
 
diff --git a/src/app/tools/unsecured-websites-report.component.html b/src/app/tools/unsecured-websites-report.component.html
index d1e95a0fec..7c50f256fc 100644
--- a/src/app/tools/unsecured-websites-report.component.html
+++ b/src/app/tools/unsecured-websites-report.component.html
@@ -1,8 +1,13 @@
 <div class="page-header">
-    <h1>{{'unsecuredWebsitesReport' | i18n}}</h1>
+    <h1>
+        {{'unsecuredWebsitesReport' | i18n}}
+        <small *ngIf="hasLoaded && loading">
+            <i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
+        </small>
+    </h1>
 </div>
 <p>{{'unsecuredWebsitesReportDesc' | i18n}}</p>
-<div *ngIf="loading">
+<div *ngIf="!hasLoaded && loading">
     <i class="fa fa-spinner fa-spin text-muted" title="{{'loading' | i18n}}"></i>
 </div>
 <div class="mt-4" *ngIf="!loading">
diff --git a/src/app/tools/unsecured-websites-report.component.ts b/src/app/tools/unsecured-websites-report.component.ts
index c337d26046..e7998ef8df 100644
--- a/src/app/tools/unsecured-websites-report.component.ts
+++ b/src/app/tools/unsecured-websites-report.component.ts
@@ -31,19 +31,20 @@ export class UnsecuredWebsitesReportComponent implements OnInit {
     constructor(private ciphersService: CipherService, private componentFactoryResolver: ComponentFactoryResolver) { }
 
     async ngOnInit() {
-        this.load();
+        await this.load();
         this.hasLoaded = true;
     }
 
     async load() {
         this.loading = true;
         const allCiphers = await this.ciphersService.getAllDecrypted();
-        this.ciphers = allCiphers.filter((c) => {
+        const unsecuredCiphers = allCiphers.filter((c) => {
             if (c.type !== CipherType.Login || !c.login.hasUris) {
                 return false;
             }
             return c.login.uris.find((u) => u.uri.indexOf('http://') === 0) != null;
         });
+        this.ciphers = unsecuredCiphers;
         this.loading = false;
     }