From 8e23b69038ccad593fc586d804483c9d6a581370 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sat, 12 Oct 2019 13:56:43 +0200
Subject: [PATCH] :speech_balloon: (Money) Add withPadEnd parameter

---
 src/components/AccountCard.vue            |  4 ++-
 src/components/AccountTransactionList.vue | 30 +++++++++++++++++++----
 src/utils/filters.ts                      |  9 +++++--
 3 files changed, 35 insertions(+), 8 deletions(-)

diff --git a/src/components/AccountCard.vue b/src/components/AccountCard.vue
index 635bfae..ada4602 100644
--- a/src/components/AccountCard.vue
+++ b/src/components/AccountCard.vue
@@ -13,7 +13,9 @@
     <div v-if="account.isPublic">
       <awe-icon icon="users" />
     </div>
-    <div class="numeric">{{ totalCost | moneypad(account.mainCurrency) }}</div>
+    <div class="numeric">
+      {{ totalCost | moneypad(account.mainCurrency, false) }}
+    </div>
     {{ account.users && account.users.map((u) => u.alias).join(', ') }}
   </div>
 </template>
diff --git a/src/components/AccountTransactionList.vue b/src/components/AccountTransactionList.vue
index 7029956..8fed839 100644
--- a/src/components/AccountTransactionList.vue
+++ b/src/components/AccountTransactionList.vue
@@ -1,6 +1,9 @@
 <template>
   <div class="account-transaction-list" v-if="account">
-    <div class="field has-addons has-addons-centered is-narrow" v-if="showFilter">
+    <div
+      class="field has-addons has-addons-centered is-narrow"
+      v-if="showFilter"
+    >
       <div class="control" v-show="filteredBy">
         <button type="submit" class="button" @click="filteredBy = ''">
           <awe-icon icon="times" />
@@ -10,7 +13,12 @@
         <div class="select is-fullwidth">
           <select v-model="filteredBy">
             <option value>Tout le monde</option>
-            <option v-for="(user, k) in account.users" :key="k" :value="user.alias">{{ user.alias }}</option>
+            <option
+              v-for="(user, k) in account.users"
+              :key="k"
+              :value="user.alias"
+              >{{ user.alias }}</option
+            >
           </select>
         </div>
       </div>
@@ -40,18 +48,26 @@
             <td class="multiline">
               <router-link
                 :to="{ name: 'transaction', params: { id: transaction._id } }"
-              >{{ transaction.name }}</router-link>
+                >{{ transaction.name }}</router-link
+              >
               <br />
               <span class="date">{{ transaction.date | date }}</span>
             </td>
             <td class="pay-by">{{ transaction.payBy }}</td>
-            <td class="numeric">{{ transaction.amount | moneypad(transaction.mainCurrency) }}</td>
+            <td class="numeric">
+              {{
+                transaction.amount
+                  | moneypad(transaction.mainCurrency, hasMultipleCurrencies)
+              }}
+            </td>
           </tr>
         </tbody>
         <tfoot v-if="foot">
           <tr class="is-selected">
             <td colspan="2" class="total">total</td>
-            <td class="numeric">{{ total | moneypad(account.mainCurrency) }}</td>
+            <td class="numeric">
+              {{ total | moneypad(account.mainCurrency) }}
+            </td>
           </tr>
         </tfoot>
       </table>
@@ -104,6 +120,10 @@ export default class AccountTransactionList extends Vue {
   public get showFilter(): boolean {
     return this.filter && this.isMultiUser
   }
+
+  public get hasMultipleCurrencies(): boolean {
+    return (this.account && this.account.currencies.length > 1) || false
+  }
 }
 </script>
 
diff --git a/src/utils/filters.ts b/src/utils/filters.ts
index edafe89..dcce30b 100644
--- a/src/utils/filters.ts
+++ b/src/utils/filters.ts
@@ -18,13 +18,18 @@ export const money = (
 
 export const moneypad = (
   value: number,
-  currency: ICurrency | null | undefined
+  currency?: ICurrency | null,
+  withPadEnd: boolean = true
 ): string => {
   const m = money(value, currency)
   const s: string[] = m.split('\xa0')
   const cur: string | undefined = s.pop()
 
-  return `${s.join('\xa0')}\xa0${(cur || '').padEnd(3, '\xa0')}`
+  const result = `${s.join('\xa0')}\xa0${cur || ''}`
+  if (withPadEnd) {
+    return result.padEnd(3, '\xa0')
+  }
+  return result
 }
 
 export const date = (value: string, country: string = 'fr-FR') => {