From e45c9886378e02511ae2796b73ce67ffd0489071 Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Mon, 18 Feb 2019 17:34:57 -0500
Subject: [PATCH] account credit/balance

---
 jslib                                        |  2 +-
 src/app/settings/user-billing.component.html |  4 +++-
 src/app/settings/user-billing.component.ts   |  8 ++++++++
 src/locales/en/messages.json                 | 12 ++++++++++++
 4 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/jslib b/jslib
index 8b411de034..b95b35e7d9 160000
--- a/jslib
+++ b/jslib
@@ -1 +1 @@
-Subproject commit 8b411de034569b36788239a5948d64f5029d6437
+Subproject commit b95b35e7d9444c668691dd3ee6e78c1904321f22
diff --git a/src/app/settings/user-billing.component.html b/src/app/settings/user-billing.component.html
index 63d1d3f4ce..9f334fdc18 100644
--- a/src/app/settings/user-billing.component.html
+++ b/src/app/settings/user-billing.component.html
@@ -8,7 +8,9 @@
 </div>
 <i class="fa fa-spinner fa-spin text-muted" *ngIf="!firstLoaded && loading" title="{{'loading' | i18n}}"></i>
 <ng-container *ngIf="billing">
-    <h2>{{'paymentMethod' | i18n}}</h2>
+    <h2>{{(isCreditBalance ? 'accountCredit' : 'accountBalance') | i18n}}</h2>
+    <p>{{creditOrBalance | currency:'$'}}</p>
+    <h2 class="spaced-header">{{'paymentMethod' | i18n}}</h2>
     <p *ngIf="!paymentSource">{{'noPaymentMethod' | i18n}}</p>
     <ng-container *ngIf="paymentSource">
         <app-callout type="warning" title="{{'verifyBankAccount' | i18n}}"
diff --git a/src/app/settings/user-billing.component.ts b/src/app/settings/user-billing.component.ts
index 17e0b08032..134f9b9401 100644
--- a/src/app/settings/user-billing.component.ts
+++ b/src/app/settings/user-billing.component.ts
@@ -81,6 +81,14 @@ export class UserBillingComponent implements OnInit {
         }
     }
 
+    get isCreditBalance() {
+        return this.billing == null || this.billing.balance <= 0;
+    }
+
+    get creditOrBalance() {
+        return Math.abs(this.billing != null ? this.billing.balance : 0);
+    }
+
     get paymentSource() {
         return this.billing != null ? this.billing.paymentSource : null;
     }
diff --git a/src/locales/en/messages.json b/src/locales/en/messages.json
index 031c582673..ac1b9c4bde 100644
--- a/src/locales/en/messages.json
+++ b/src/locales/en/messages.json
@@ -1490,6 +1490,18 @@
   "billing": {
     "message": "Billing"
   },
+  "accountCredit": {
+    "message": "Account Credit",
+    "description": "Financial term. In the case of Bitwarden, a positive balance means that you owe money, while a negative balance means that you have a credit (Bitwarden owes you money)."
+  },
+  "accountBalance": {
+    "message": "Account Balance",
+    "description": "Financial term. In the case of Bitwarden, a positive balance means that you owe money, while a negative balance means that you have a credit (Bitwarden owes you money)."
+  },
+  "addCredit": {
+    "message": "Add Credit",
+    "description": "Add more credit to your account's balance."
+  },
   "goPremium": {
     "message": "Go Premium",
     "description": "Another way of saying \"Get a premium membership\""