From 63e1c5807e0a2373652348fb0024fdfcbdd0ea0f Mon Sep 17 00:00:00 2001
From: Umar Bolatov <bolatovumar@gmail.com>
Date: Sun, 24 Oct 2021 14:33:47 -0700
Subject: [PATCH] Add number formatting in crowdfund app

---
 BTCPayServer/Views/AppsPublic/ViewCrowdfund.cshtml | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/BTCPayServer/Views/AppsPublic/ViewCrowdfund.cshtml b/BTCPayServer/Views/AppsPublic/ViewCrowdfund.cshtml
index 9b99274d4..835d16d94 100644
--- a/BTCPayServer/Views/AppsPublic/ViewCrowdfund.cshtml
+++ b/BTCPayServer/Views/AppsPublic/ViewCrowdfund.cshtml
@@ -65,7 +65,7 @@
                     {
                         <span v-if="srvModel.targetAmount" class="mt-3" id="crowdfund-header-target">
                             <h3 class="d-inline-block">
-                                <span class="badge bg-info px-3" v-text="`${srvModel.targetAmount} ${targetCurrency}`">@Math.Round(Model.TargetAmount.GetValueOrDefault(0)) @Model.TargetCurrency</span>
+                                <span class="badge bg-info px-3" v-text="`${new Intl.NumberFormat().format(srvModel.targetAmount)} ${targetCurrency}`">@Math.Round(Model.TargetAmount.GetValueOrDefault(0)) @Model.TargetCurrency</span>
                             </h3>
                             @if (Model.ResetEveryAmount > 0 && !Model.NeverReset)
                             {
@@ -123,7 +123,7 @@
                 <div class="card-body">
                     <div class="row py-2 text-center crowdfund-stats">
                         <div class="col-sm border-end p-3 text-center" id="crowdfund-body-raised-amount">
-                            <h3 v-text="`${raisedAmount} ${targetCurrency}`">@Math.Round(Model.Info.CurrentAmount + Model.Info.CurrentPendingAmount) @Model.TargetCurrency</h3>
+                            <h3 v-text="`${new Intl.NumberFormat().format(raisedAmount)} ${targetCurrency}`">@Math.Round(Model.Info.CurrentAmount + Model.Info.CurrentPendingAmount) @Model.TargetCurrency</h3>
                             <h5 class="text-muted fst-italic mb-0">Raised</h5>
                             <b-tooltip target="crowdfund-body-raised-amount" v-if="paymentStats && paymentStats.length > 0" class="only-for-js">
                                 <ul class="p-0 text-uppercase">
@@ -143,7 +143,7 @@
                         </div>
                         
                         <div class="col-sm border-end p-3 text-center" id="crowdfund-body-total-contributors">
-                            <h3 v-text="srvModel.info.totalContributors">@Model.Info.TotalContributors</h3>
+                            <h3 v-text="new Intl.NumberFormat().format(srvModel.info.totalContributors)">@Model.Info.TotalContributors</h3>
                             <h5 class="text-muted fst-italic mb-0">Contributors</h5>
                         </div>
                         @if (Model.StartDate.HasValue || Model.EndDate.HasValue)
@@ -327,7 +327,7 @@
                         <span class="h5">{{perk.title? perk.title : perk.id}}</span>
                         <span class="text-muted"> 
                             <template v-if="perk.price && perk.price.value">
-                                {{perk.price.value.noExponents()}}
+                                {{new Intl.NumberFormat().format(perk.price.value.noExponents())}}
                                 {{targetCurrency}}
                                 <template v-if="perk.price.type == 1">or more</template>
                             </template>
@@ -366,10 +366,10 @@
                     </div>
                 </div>
                 <div class="card-footer d-flex justify-content-between" v-if="perk.sold || perk.inventory != null">
-                    <span v-if="perk.inventory != null && perk.inventory > 0" class="text-center text-muted">{{perk.inventory}} left</span>
+                    <span v-if="perk.inventory != null && perk.inventory > 0" class="text-center text-muted">{{new Intl.NumberFormat().format(perk.inventory)}} left</span>
                     <span v-if="perk.inventory != null && perk.inventory <= 0" class="text-center text-muted">Sold out</span>
-                    <span v-if="perk.sold">{{perk.sold}} Contributor{{perk.sold === 1 ? "": "s"}}</span>
-                    <span v-if="perk.value">{{perk.value}} {{targetCurrency}} total</span>
+                    <span v-if="perk.sold">{{new Intl.NumberFormat().format(perk.sold)}} Contributor{{perk.sold === 1 ? "": "s"}}</span>
+                    <span v-if="perk.value">{{new Intl.NumberFormat().format(perk.value)}} {{targetCurrency}} total</span>
                 </div>
             </form>
         </div>