From 5bd9a9a81d5773e07d61ab35ac8b817c6e7ccbb3 Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Mon, 11 Jun 2018 10:26:02 -0400
Subject: [PATCH] loaded state for orgs

---
 src/app/vault/organizations.component.html | 17 +++++++++++------
 src/app/vault/organizations.component.ts   | 18 +++++++++---------
 2 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/src/app/vault/organizations.component.html b/src/app/vault/organizations.component.html
index 0fa0b77d60..1ca71999cc 100644
--- a/src/app/vault/organizations.component.html
+++ b/src/app/vault/organizations.component.html
@@ -1,9 +1,14 @@
-<ul class="fa-ul card-ul carets">
-    <li *ngFor="let o of organizations">
-        <a href="#" class="text-body" appStopClick appBlurClick (click)="selectOrganization(o)">
-            <i class="fa-li fa fa-caret-right"></i> {{o.name}}</a>
-    </li>
-</ul>
+<p *ngIf="!loaded" class="text-muted">
+    <i class="fa fa-spinner fa-spin"></i>
+</p>
+<ng-container *ngIf="loaded">
+    <ul class="fa-ul card-ul carets">
+        <li *ngFor="let o of organizations">
+            <a href="#" class="text-body" appStopClick appBlurClick (click)="selectOrganization(o)">
+                <i class="fa-li fa fa-caret-right"></i> {{o.name}}</a>
+        </li>
+    </ul>
+</ng-container>
 <button (click)="newOrganization()" class="btn btn-block btn-outline-primary">
     <i class="fa fa-plus fa-fw"></i>
     {{'newOrganization' | i18n}}
diff --git a/src/app/vault/organizations.component.ts b/src/app/vault/organizations.component.ts
index 3367d60a69..e7e67e5bd6 100644
--- a/src/app/vault/organizations.component.ts
+++ b/src/app/vault/organizations.component.ts
@@ -4,28 +4,28 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { UserService } from 'jslib/abstractions/user.service';
 
+import { Organization } from 'jslib/models/domain/organization';
+
 @Component({
     selector: 'app-vault-organizations',
     templateUrl: 'organizations.component.html',
 })
 export class OrganizationsComponent {
-    @Output() onOrganizationClicked = new EventEmitter<any>();
-    organizations: any;
+    @Output() onOrganizationClicked = new EventEmitter<Organization>();
+    organizations: Organization[];
+    loaded: boolean = false;
 
-    constructor(private userService: UserService, private analytics: Angulartics2,
-        private toasterService: ToasterService) {
+    constructor(private userService: UserService) {
     }
 
     async load() {
         this.organizations = await this.userService.getAllOrganizations();
+        this.loaded = true;
     }
 
-    selectOrganization(o: any) {
-        this.onOrganizationClicked.emit(0);
+    selectOrganization(o: Organization) {
+        this.onOrganizationClicked.emit(o);
     }
 }