From 30c345aa4f70b679e4b57d4399805b02022f9fad Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 10 Mar 2022 13:37:02 +0100
Subject: [PATCH] add components DateRow, DecayRow

---
 .../TransactionRows/AmountAndName.vue         |  2 +-
 .../TransactionRows/CollapseIcon.vue          |  3 +-
 .../TransactionRows/{Date.vue => DateRow.vue} |  0
 .../components/TransactionRows/DecayRow.vue   | 30 +++++++++++++++++++
 .../Transactions/TransactionCreation.vue      | 25 ++++------------
 .../Transactions/TransactionReceive.vue       | 25 ++++------------
 .../Transactions/TransactionSend.vue          | 27 +++++------------
 7 files changed, 53 insertions(+), 59 deletions(-)
 rename frontend/src/components/TransactionRows/{Date.vue => DateRow.vue} (100%)
 create mode 100644 frontend/src/components/TransactionRows/DecayRow.vue

diff --git a/frontend/src/components/TransactionRows/AmountAndName.vue b/frontend/src/components/TransactionRows/AmountAndName.vue
index ed36ec301..24cbe8d1c 100644
--- a/frontend/src/components/TransactionRows/AmountAndName.vue
+++ b/frontend/src/components/TransactionRows/AmountAndName.vue
@@ -21,7 +21,7 @@ export default {
   name: 'AmountAndName',
   props: {
     amount: {
-      type: Number,
+      type: String,
     },
     linkedUser: {
       type: Object,
diff --git a/frontend/src/components/TransactionRows/CollapseIcon.vue b/frontend/src/components/TransactionRows/CollapseIcon.vue
index 5e0f46474..a51efd640 100644
--- a/frontend/src/components/TransactionRows/CollapseIcon.vue
+++ b/frontend/src/components/TransactionRows/CollapseIcon.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="Collaps-Icon">
+  <div class="collapse-icon">
     <b-icon
       :icon="visible ? 'caret-up-square' : 'caret-down-square'"
       :class="visible ? 'text-black' : 'text-muted'"
@@ -8,6 +8,7 @@
 </template>
 <script>
 export default {
+  name: 'Collapse-Icon',
   props: {
     visible: {
       type: Boolean,
diff --git a/frontend/src/components/TransactionRows/Date.vue b/frontend/src/components/TransactionRows/DateRow.vue
similarity index 100%
rename from frontend/src/components/TransactionRows/Date.vue
rename to frontend/src/components/TransactionRows/DateRow.vue
diff --git a/frontend/src/components/TransactionRows/DecayRow.vue b/frontend/src/components/TransactionRows/DecayRow.vue
new file mode 100644
index 000000000..d8b969706
--- /dev/null
+++ b/frontend/src/components/TransactionRows/DecayRow.vue
@@ -0,0 +1,30 @@
+<template>
+  <div class="decay-row">
+    <b-row v-if="decay">
+      <b-col cols="5">
+        <div class="text-right">
+          <b-icon icon="droplet-half" height="15" class="mb-1" />
+        </div>
+      </b-col>
+      <b-col cols="7">
+        <div class="gdd-transaction-list-item-decay">
+          <decay-information-short decaytyp="short" :decay="decay" />
+        </div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+<script>
+import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
+export default {
+  name: 'Decay-Row',
+  components: {
+    DecayInformationShort,
+  },
+  props: {
+    decay: {
+      type: Object,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 07bed52dd..0a7cb11bd 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -19,21 +19,10 @@
             <memo :memo="memo" />
 
             <!-- Datum -->
-            <date :balanceDate="balanceDate" />
+            <date-row :balanceDate="balanceDate" />
 
             <!-- Decay -->
-            <b-row v-if="decay">
-              <b-col cols="5">
-                <div class="text-right">
-                  <b-icon icon="droplet-half" height="15" class="mb-1" />
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-decay">
-                  <decay-information-short decaytyp="short" :decay="decay" />
-                </div>
-              </b-col>
-            </b-row>
+            <decay-row :decay="decay" />
           </b-col>
         </b-row>
       </div>
@@ -54,10 +43,9 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName.vue'
-import Memo from '../TransactionRows/Memo.vue'
-import Date from '../TransactionRows/Date.vue'
-import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
+import AmountAndName from '../TransactionRows/AmountAndName'
+import Memo from '../TransactionRows/Memo'
+import DateRow from '../TransactionRows/DateRow'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
 import DecayInformationDecayStartblock from '../DecayInformations/DecayInformation-DecayStartblock'
@@ -69,8 +57,7 @@ export default {
     TypeIcon,
     AmountAndName,
     Memo,
-    Date,
-    DecayInformationShort,
+    DateRow,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
     DecayInformationDecayStartblock,
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index d177235fa..980cff3ea 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -19,21 +19,10 @@
             <memo :memo="memo" />
 
             <!-- Datum -->
-            <date :balanceDate="balanceDate" />
+            <date-row :balanceDate="balanceDate" />
 
             <!-- Decay -->
-            <b-row v-if="decay">
-              <b-col cols="5">
-                <div class="text-right">
-                  <b-icon icon="droplet-half" height="15" class="mb-1" />
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-decay">
-                  <decay-information-short decaytyp="short" :decay="decay" />
-                </div>
-              </b-col>
-            </b-row>
+            <decay-row :decay="decay" />
           </b-col>
         </b-row>
       </div>
@@ -54,10 +43,9 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName.vue'
-import Memo from '../TransactionRows/Memo.vue'
-import Date from '../TransactionRows/Date.vue'
-import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
+import AmountAndName from '../TransactionRows/AmountAndName'
+import Memo from '../TransactionRows/Memo'
+import DateRow from '../TransactionRows/DateRow'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
 import DecayInformationDecayStartblock from '../DecayInformations/DecayInformation-DecayStartblock'
@@ -69,8 +57,7 @@ export default {
     TypeIcon,
     AmountAndName,
     Memo,
-    Date,
-    DecayInformationShort,
+    DateRow,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
     DecayInformationDecayStartblock,
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index 0c7eb7227..d9f0ed858 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -19,21 +19,10 @@
             <memo :memo="memo" />
 
             <!-- Datum -->
-            <date :balanceDate="balanceDate" />
+            <date-row :balanceDate="balanceDate" />
 
             <!-- Decay -->
-            <b-row v-if="decay">
-              <b-col cols="5">
-                <div class="text-right">
-                  <b-icon icon="droplet-half" height="15" class="mb-1" />
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-decay">
-                  <decay-information-short decaytyp="short" :decay="decay" />
-                </div>
-              </b-col>
-            </b-row>
+            <decay-row :decay="decay" />
           </b-col>
         </b-row>
       </div>
@@ -54,10 +43,10 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName.vue'
-import Memo from '../TransactionRows/Memo.vue'
-import Date from '../TransactionRows/Date.vue'
-import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
+import AmountAndName from '../TransactionRows/AmountAndName'
+import Memo from '../TransactionRows/Memo'
+import DateRow from '../TransactionRows/DateRow'
+import DecayRow from '../TransactionRows/DecayRow'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
 import DecayInformationDecayStartblock from '../DecayInformations/DecayInformation-DecayStartblock'
@@ -68,8 +57,8 @@ export default {
     TypeIcon,
     AmountAndName,
     Memo,
-    Date,
-    DecayInformationShort,
+    DateRow,
+    DecayRow,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
     DecayInformationDecayStartblock,