From 09de5294435b183fb51111fcb1f8f7f0f986520e Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Tue, 8 Mar 2022 04:21:47 +0100
Subject: [PATCH] feat: Use Vue Filter for Amounts

---
 .../components/DecayInformations/DecayInformation-Short.vue | 2 +-
 .../src/components/Transactions/TransactionCreation.vue     | 2 +-
 frontend/src/components/Transactions/TransactionDecay.vue   | 3 +--
 frontend/src/components/Transactions/TransactionReceive.vue | 2 +-
 frontend/src/components/Transactions/TransactionSend.vue    | 3 +--
 frontend/src/filters/amount.js                              | 6 ++++++
 frontend/src/main.js                                        | 2 ++
 7 files changed, 13 insertions(+), 7 deletions(-)
 create mode 100644 frontend/src/filters/amount.js

diff --git a/frontend/src/components/DecayInformations/DecayInformation-Short.vue b/frontend/src/components/DecayInformations/DecayInformation-Short.vue
index 8dba700d5..990ded29b 100644
--- a/frontend/src/components/DecayInformations/DecayInformation-Short.vue
+++ b/frontend/src/components/DecayInformations/DecayInformation-Short.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="decayinformation-short">
-    <span>− {{ decay ? $n(Number(decay.decay) * -1, 'decimal') : '' }}</span>
+    <span v-if="decay.decay">{{ decay.decay | amount}}</span>
   </div>
 </template>
 <script>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 69d1b8b13..7c31d6d0c 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -25,7 +25,7 @@
                 <div class="text-right">
                   <span class="gdd-transaction-list-item-operator">+</span>
                   <span class="gdd-transaction-list-item-amount">
-                    {{ $n(amount, 'decimal') }}
+                    {{ amount | amount }}
                   </span>
                 </div>
               </b-col>
diff --git a/frontend/src/components/Transactions/TransactionDecay.vue b/frontend/src/components/Transactions/TransactionDecay.vue
index ab5a0f561..d45681ed8 100644
--- a/frontend/src/components/Transactions/TransactionDecay.vue
+++ b/frontend/src/components/Transactions/TransactionDecay.vue
@@ -23,9 +23,8 @@
             <b-row>
               <b-col cols="5">
                 <div class="text-right">
-                  <span class="gdd-transaction-list-item-operator">−</span>
                   <span class="gdd-transaction-list-item-amount">
-                    {{ $n(Number(amount) * -1, 'decimal') }}
+                    {{ amount | amount }}
                   </span>
                 </div>
               </b-col>
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 43159a059..3ba1f6a31 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -28,7 +28,7 @@
                 <div class="text-right">
                   <span class="gdd-transaction-list-item-operator">+</span>
                   <span class="gdd-transaction-list-item-amount">
-                    {{ $n(amount, 'decimal') }}
+                    {{ amount | amount }}
                   </span>
                 </div>
               </b-col>
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index baaa346c5..438b8b08c 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -23,9 +23,8 @@
             <b-row>
               <b-col cols="5">
                 <div class="text-right">
-                  <span class="gdd-transaction-list-item-operator">−</span>
                   <span class="gdd-transaction-list-item-amount">
-                    {{ $n(Number(amount) * -1, 'decimal') }}
+                    {{ amount | amount }}
                   </span>
                 </div>
               </b-col>
diff --git a/frontend/src/filters/amount.js b/frontend/src/filters/amount.js
new file mode 100644
index 000000000..b8f9a79a0
--- /dev/null
+++ b/frontend/src/filters/amount.js
@@ -0,0 +1,6 @@
+import i18n from '@/i18n.js'
+
+export const amount = (value) => {
+  if (!value) return ''
+  return i18n.n(value.toString(), 'decimal').replace('-', '− ')
+}
diff --git a/frontend/src/main.js b/frontend/src/main.js
index bcf80fbef..78f4098e4 100755
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -4,6 +4,7 @@ import App from './App.vue'
 import i18n from './i18n.js'
 import { loadAllRules } from './validation-rules'
 import { toasters } from './mixins/toaster'
+import { amount } from './filters/amount'
 
 import 'regenerator-runtime'
 
@@ -20,6 +21,7 @@ Vue.use(DashboardPlugin)
 Vue.config.productionTip = false
 
 Vue.mixin(toasters)
+Vue.filter('amount', amount)
 
 loadAllRules(i18n)