From d5ff360b18b6bff61f50a523a2c04ef45ca7de0b Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 10 Mar 2022 11:22:17 +0100
Subject: [PATCH 01/22] add TransactionRows/CollapsIcon.vue, add this
 components in transaction slots

---
 frontend/src/components/GdtTransactionList.vue  |  5 +++++
 .../components/TransactionRows/CollapsIcon.vue  | 17 +++++++++++++++++
 .../Transactions/TransactionCreation.vue        |  9 +++------
 .../Transactions/TransactionDecay.vue           |  9 +++------
 .../Transactions/TransactionReceive.vue         |  9 +++------
 .../components/Transactions/TransactionSend.vue |  9 +++------
 6 files changed, 34 insertions(+), 24 deletions(-)
 create mode 100644 frontend/src/components/TransactionRows/CollapsIcon.vue

diff --git a/frontend/src/components/GdtTransactionList.vue b/frontend/src/components/GdtTransactionList.vue
index 0c061ed06..168bf6ae7 100644
--- a/frontend/src/components/GdtTransactionList.vue
+++ b/frontend/src/components/GdtTransactionList.vue
@@ -89,6 +89,11 @@ export default {
 }
 </script>
 <style>
+collaps-icon {
+  width: 95%;
+  position: absolute;
+}
+
 .el-table .cell {
   padding-left: 0px;
   padding-right: 0px;
diff --git a/frontend/src/components/TransactionRows/CollapsIcon.vue b/frontend/src/components/TransactionRows/CollapsIcon.vue
new file mode 100644
index 000000000..5e0f46474
--- /dev/null
+++ b/frontend/src/components/TransactionRows/CollapsIcon.vue
@@ -0,0 +1,17 @@
+<template>
+  <div class="Collaps-Icon">
+    <b-icon
+      :icon="visible ? 'caret-up-square' : 'caret-down-square'"
+      :class="visible ? 'text-black' : 'text-muted'"
+    />
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    visible: {
+      type: Boolean,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index a30a33ca5..f24ce1f7d 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -2,12 +2,7 @@
   <div class="transaction-slot-creation">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <div class="text-right" style="width: 95%; position: absolute">
-        <b-icon
-          :icon="visible ? 'caret-up-square' : 'caret-down-square'"
-          :class="visible ? 'text-black' : 'text-muted'"
-        />
-      </div>
+      <collaps-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
@@ -89,6 +84,7 @@
   </div>
 </template>
 <script>
+import CollapsIcon from '../TransactionRows/CollapsIcon'
 import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -97,6 +93,7 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-creation',
   components: {
+    CollapsIcon,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
diff --git a/frontend/src/components/Transactions/TransactionDecay.vue b/frontend/src/components/Transactions/TransactionDecay.vue
index 0530c47f4..39f62eea8 100644
--- a/frontend/src/components/Transactions/TransactionDecay.vue
+++ b/frontend/src/components/Transactions/TransactionDecay.vue
@@ -2,12 +2,7 @@
   <div class="transaction-slot-decay">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <div class="text-right" style="width: 95%; position: absolute">
-        <b-icon
-          :icon="visible ? 'caret-up-square' : 'caret-down-square'"
-          :class="visible ? 'text-black' : 'text-muted'"
-        />
-      </div>
+      <collaps-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
@@ -45,11 +40,13 @@
   </div>
 </template>
 <script>
+import CollapsIcon from '../TransactionRows/CollapsIcon'
 import DecayInformationDecay from '../DecayInformations/DecayInformation-Decay'
 
 export default {
   name: 'slot-decay',
   components: {
+    CollapsIcon,
     DecayInformationDecay,
   },
   props: {
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 08c49d808..3c6c2cb08 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -2,12 +2,7 @@
   <div class="transaction-slot-receive">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <div class="text-right" style="width: 95%; position: absolute">
-        <b-icon
-          :icon="visible ? 'caret-up-square' : 'caret-down-square'"
-          :class="visible ? 'text-black' : 'text-muted'"
-        />
-      </div>
+      <collaps-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
@@ -92,6 +87,7 @@
   </div>
 </template>
 <script>
+import CollapsIcon from '../TransactionRows/CollapsIcon'
 import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -100,6 +96,7 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-receive',
   components: {
+    CollapsIcon,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index 67248fc3f..7d28e7a9d 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -2,12 +2,7 @@
   <div class="transaction-slot-send">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <div class="text-right" style="width: 95%; position: absolute">
-        <b-icon
-          :icon="visible ? 'caret-up-square' : 'caret-down-square'"
-          :class="visible ? 'text-black' : 'text-muted'"
-        />
-      </div>
+      <collaps-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
@@ -89,6 +84,7 @@
   </div>
 </template>
 <script>
+import CollapsIcon from '../TransactionRows/CollapsIcon'
 import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
 import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -96,6 +92,7 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-send',
   components: {
+    CollapsIcon,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,

From 0ca944e40aef74a43af7a4bbf2ad83bc10f6a616 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 10 Mar 2022 13:10:13 +0100
Subject: [PATCH 02/22] add components CollapsIcon, TypeIcon,  AmountAndName,
 Memo, Date

---
 .../TransactionRows/AmountAndName.vue         | 34 +++++++++++
 .../{CollapsIcon.vue => CollapseIcon.vue}     |  0
 .../src/components/TransactionRows/Date.vue   | 25 ++++++++
 .../src/components/TransactionRows/Memo.vue   | 22 +++++++
 .../components/TransactionRows/TypeIcon.vue   | 20 +++++++
 .../Transactions/TransactionCreation.vue      | 56 +++++-------------
 .../Transactions/TransactionDecay.vue         | 40 ++++---------
 .../Transactions/TransactionReceive.vue       | 59 +++++--------------
 .../Transactions/TransactionSend.vue          | 58 ++++++------------
 9 files changed, 160 insertions(+), 154 deletions(-)
 create mode 100644 frontend/src/components/TransactionRows/AmountAndName.vue
 rename frontend/src/components/TransactionRows/{CollapsIcon.vue => CollapseIcon.vue} (100%)
 create mode 100644 frontend/src/components/TransactionRows/Date.vue
 create mode 100644 frontend/src/components/TransactionRows/Memo.vue
 create mode 100644 frontend/src/components/TransactionRows/TypeIcon.vue

diff --git a/frontend/src/components/TransactionRows/AmountAndName.vue b/frontend/src/components/TransactionRows/AmountAndName.vue
new file mode 100644
index 000000000..ed36ec301
--- /dev/null
+++ b/frontend/src/components/TransactionRows/AmountAndName.vue
@@ -0,0 +1,34 @@
+<template>
+  <div class="amount-and-name">
+    <b-row>
+      <b-col cols="5">
+        <div class="text-right">
+          <span class="gdd-transaction-list-item-amount">
+            {{ amount | GDD }}
+          </span>
+        </div>
+      </b-col>
+      <b-col cols="7">
+        <div class="gdd-transaction-list-item-name">
+          {{ linkedUser ? linkedUser.firstName + ' ' + linkedUser.lastName : text }}
+        </div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+<script>
+export default {
+  name: 'AmountAndName',
+  props: {
+    amount: {
+      type: Number,
+    },
+    linkedUser: {
+      type: Object,
+    },
+    text: {
+      type: String,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/TransactionRows/CollapsIcon.vue b/frontend/src/components/TransactionRows/CollapseIcon.vue
similarity index 100%
rename from frontend/src/components/TransactionRows/CollapsIcon.vue
rename to frontend/src/components/TransactionRows/CollapseIcon.vue
diff --git a/frontend/src/components/TransactionRows/Date.vue b/frontend/src/components/TransactionRows/Date.vue
new file mode 100644
index 000000000..7883507db
--- /dev/null
+++ b/frontend/src/components/TransactionRows/Date.vue
@@ -0,0 +1,25 @@
+<template>
+  <div class="transaction-rows-date">
+    <b-row>
+      <b-col cols="5">
+        <div class="text-right">{{ $t('form.date') }}</div>
+      </b-col>
+      <b-col cols="7">
+        <div class="gdd-transaction-list-item-date">
+          {{ $d(new Date(balanceDate), 'long') }}
+          {{ $i18n.locale === 'de' ? 'Uhr' : '' }}
+        </div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+<script>
+export default {
+  name: 'Transaction-Rows-Date',
+  props: {
+    balanceDate: {
+      type: String,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/TransactionRows/Memo.vue b/frontend/src/components/TransactionRows/Memo.vue
new file mode 100644
index 000000000..a25892e80
--- /dev/null
+++ b/frontend/src/components/TransactionRows/Memo.vue
@@ -0,0 +1,22 @@
+<template>
+  <div class="memo">
+    <b-row>
+      <b-col cols="5">
+        <div class="text-right">{{ $t('form.memo') }}</div>
+      </b-col>
+      <b-col cols="7">
+        <div class="gdd-transaction-list-message">{{ memo }}</div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+<script>
+export default {
+  name: 'Memo',
+  props: {
+    memo: {
+      type: String,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/TransactionRows/TypeIcon.vue b/frontend/src/components/TransactionRows/TypeIcon.vue
new file mode 100644
index 000000000..00dedd77a
--- /dev/null
+++ b/frontend/src/components/TransactionRows/TypeIcon.vue
@@ -0,0 +1,20 @@
+<template>
+  <div class="type-icon">
+    <div class="gdd-transaction-list-item-icon">
+      <b-icon :icon="icon" :class="color" class="m-mb-1 font2em" />
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'Type-Icon',
+  props: {
+    icon: {
+      type: String,
+    },
+    color: {
+      type: String,
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index f24ce1f7d..07bed52dd 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -2,56 +2,24 @@
   <div class="transaction-slot-creation">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <collaps-icon class="text-right" :visible="visible" />
+      <collapse-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
           <!-- ICON  -->
           <b-col cols="1">
-            <div class="gdd-transaction-list-item-icon">
-              <b-icon icon="gift" class="gradido-global-color-accent m-mb-1 font2em" />
-            </div>
+            <type-icon color="gradido-global-color-accent" icon="gift" />
           </b-col>
 
           <b-col cols="11">
-            <!-- Betrag / Name Email -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">
-                  <span class="gdd-transaction-list-item-amount">
-                    {{ amount | GDD }}
-                  </span>
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-name">
-                  {{ linkedUser.firstName + ' ' + linkedUser.lastName }}
-                </div>
-              </b-col>
-            </b-row>
+            <!-- Amount / Name || Text -->
+            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.memo') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-message">{{ memo }}</div>
-              </b-col>
-            </b-row>
+            <memo :memo="memo" />
 
             <!-- Datum -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.date') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-date">
-                  {{ $d(new Date(balanceDate), 'long') }}
-                  {{ $i18n.locale === 'de' ? 'Uhr' : '' }}
-                </div>
-              </b-col>
-            </b-row>
+            <date :balanceDate="balanceDate" />
 
             <!-- Decay -->
             <b-row v-if="decay">
@@ -84,7 +52,11 @@
   </div>
 </template>
 <script>
-import CollapsIcon from '../TransactionRows/CollapsIcon'
+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 DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -93,7 +65,11 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-creation',
   components: {
-    CollapsIcon,
+    CollapseIcon,
+    TypeIcon,
+    AmountAndName,
+    Memo,
+    Date,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
diff --git a/frontend/src/components/Transactions/TransactionDecay.vue b/frontend/src/components/Transactions/TransactionDecay.vue
index 39f62eea8..74cc30347 100644
--- a/frontend/src/components/Transactions/TransactionDecay.vue
+++ b/frontend/src/components/Transactions/TransactionDecay.vue
@@ -2,33 +2,18 @@
   <div class="transaction-slot-decay">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <collaps-icon class="text-right" :visible="visible" />
+      <collapse-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
           <!-- ICON  -->
           <b-col cols="1">
-            <div class="gdd-transaction-list-item-icon">
-              <b-icon icon="droplet-half" class="gradido-global-color-gray m-mb-1 font2em" />
-            </div>
+            <type-icon color="gradido-global-color-gray" icon="droplet-half" />
           </b-col>
 
           <b-col cols="11">
-            <!-- Betrag / Name Email -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">
-                  <span class="gdd-transaction-list-item-amount">
-                    {{ amount | GDD }}
-                  </span>
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-name">
-                  {{ $t('decay.decay_since_last_transaction') }}
-                </div>
-              </b-col>
-            </b-row>
+            <!-- Amount / Name || Text -->
+            <amount-and-name :amount="amount" :text="$t('decay.decay_since_last_transaction')" />
           </b-col>
         </b-row>
       </div>
@@ -40,13 +25,17 @@
   </div>
 </template>
 <script>
-import CollapsIcon from '../TransactionRows/CollapsIcon'
+import CollapseIcon from '../TransactionRows/CollapseIcon'
+import TypeIcon from '../TransactionRows/TypeIcon'
+import AmountAndName from '../TransactionRows/AmountAndName.vue'
 import DecayInformationDecay from '../DecayInformations/DecayInformation-Decay'
 
 export default {
   name: 'slot-decay',
   components: {
-    CollapsIcon,
+    CollapseIcon,
+    TypeIcon,
+    AmountAndName,
     DecayInformationDecay,
   },
   props: {
@@ -56,18 +45,9 @@ export default {
     balance: {
       type: String,
     },
-    balanceDate: {
-      type: String,
-    },
     decay: {
       type: Object,
     },
-    id: {
-      type: Number,
-    },
-    typeId: {
-      type: String,
-    },
   },
   data() {
     return {
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 3c6c2cb08..d177235fa 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -2,59 +2,24 @@
   <div class="transaction-slot-receive">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <collaps-icon class="text-right" :visible="visible" />
+      <collapse-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
           <!-- ICON  -->
           <b-col cols="1">
-            <div class="gdd-transaction-list-item-icon">
-              <b-icon
-                icon="arrow-right-circle"
-                class="gradido-global-color-accent m-mb-1 font2em"
-              />
-            </div>
+            <type-icon color="gradido-global-color-accent" icon="arrow-right-circle" />
           </b-col>
 
           <b-col cols="11">
-            <!-- Betrag / Name Email -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">
-                  <span class="gdd-transaction-list-item-amount">
-                    {{ amount | GDD }}
-                  </span>
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-name">
-                  {{ linkedUser.firstName + ' ' + linkedUser.lastName }}
-                </div>
-              </b-col>
-            </b-row>
+            <!-- Amount / Name || Text -->
+            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.memo') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-message">{{ memo }}</div>
-              </b-col>
-            </b-row>
+            <memo :memo="memo" />
 
             <!-- Datum -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.date') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-date">
-                  {{ $d(new Date(balanceDate), 'long') }}
-                  {{ $i18n.locale === 'de' ? 'Uhr' : '' }}
-                </div>
-              </b-col>
-            </b-row>
+            <date :balanceDate="balanceDate" />
 
             <!-- Decay -->
             <b-row v-if="decay">
@@ -87,7 +52,11 @@
   </div>
 </template>
 <script>
-import CollapsIcon from '../TransactionRows/CollapsIcon'
+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 DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -96,7 +65,11 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-receive',
   components: {
-    CollapsIcon,
+    CollapseIcon,
+    TypeIcon,
+    AmountAndName,
+    Memo,
+    Date,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index 7d28e7a9d..0c7eb7227 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -2,56 +2,24 @@
   <div class="transaction-slot-send">
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
-      <collaps-icon class="text-right" :visible="visible" />
+      <collapse-icon class="text-right" :visible="visible" />
 
       <div>
         <b-row>
           <!-- ICON  -->
           <b-col cols="1">
-            <div class="gdd-transaction-list-item-icon">
-              <b-icon icon="arrow-left-circle" class="text-danger m-mb-1 font2em" />
-            </div>
+            <type-icon color="text-danger" icon="arrow-left-circle" />
           </b-col>
 
           <b-col cols="11">
-            <!-- Betrag / Name Email -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">
-                  <span class="gdd-transaction-list-item-amount">
-                    {{ amount | GDD }}
-                  </span>
-                </div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-name">
-                  {{ linkedUser.firstName + ' ' + linkedUser.lastName }}
-                </div>
-              </b-col>
-            </b-row>
+            <!-- Amount / Name  -->
+            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
-            <!-- Nachricht Memo -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.memo') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-message">{{ memo }}</div>
-              </b-col>
-            </b-row>
+            <!-- Memo -->
+            <memo :memo="memo" />
 
             <!-- Datum -->
-            <b-row>
-              <b-col cols="5">
-                <div class="text-right">{{ $t('form.date') }}</div>
-              </b-col>
-              <b-col cols="7">
-                <div class="gdd-transaction-list-item-date">
-                  {{ $d(new Date(balanceDate), 'long') }}
-                  {{ $i18n.locale === 'de' ? 'Uhr' : '' }}
-                </div>
-              </b-col>
-            </b-row>
+            <date :balanceDate="balanceDate" />
 
             <!-- Decay -->
             <b-row v-if="decay">
@@ -84,7 +52,11 @@
   </div>
 </template>
 <script>
-import CollapsIcon from '../TransactionRows/CollapsIcon'
+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 DecayInformationLong from '../DecayInformations/DecayInformation-Long'
 import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
@@ -92,7 +64,11 @@ import DecayInformationDecayStartblock from '../DecayInformations/DecayInformati
 export default {
   name: 'slot-send',
   components: {
-    CollapsIcon,
+    CollapseIcon,
+    TypeIcon,
+    AmountAndName,
+    Memo,
+    Date,
     DecayInformationShort,
     DecayInformationLong,
     DecayInformationBeforeStartblock,

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 03/22] 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,

From e80d42a0b0a48e551b3f3a323d301e75b116648a Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 10 Mar 2022 14:25:41 +0100
Subject: [PATCH 04/22] add components DateRow, DecayRow

---
 frontend/src/components/Transactions/TransactionCreation.vue | 2 ++
 frontend/src/components/Transactions/TransactionReceive.vue  | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 0a7cb11bd..3cef1f110 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -46,6 +46,7 @@ import TypeIcon from '../TransactionRows/TypeIcon'
 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'
@@ -58,6 +59,7 @@ export default {
     AmountAndName,
     Memo,
     DateRow,
+    DecayRow,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
     DecayInformationDecayStartblock,
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 980cff3ea..3d4c8ccb1 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -46,6 +46,7 @@ import TypeIcon from '../TransactionRows/TypeIcon'
 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'
@@ -58,6 +59,7 @@ export default {
     AmountAndName,
     Memo,
     DateRow,
+    DecayRow,
     DecayInformationLong,
     DecayInformationBeforeStartblock,
     DecayInformationDecayStartblock,

From 26b4c8ecafcded67a72f7740fa42635d939e5e95 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 10 Mar 2022 14:54:00 +0100
Subject: [PATCH 05/22] add component for DecayInformations/DecayInformation
 for SEND, RECEIVE, CREATION typeId

---
 .../DecayInformations/DecayInformation.vue    | 48 +++++++++++++++++++
 .../Transactions/TransactionCreation.vue      | 18 +++----
 .../Transactions/TransactionReceive.vue       | 18 +++----
 .../Transactions/TransactionSend.vue          | 24 +++-------
 4 files changed, 67 insertions(+), 41 deletions(-)
 create mode 100644 frontend/src/components/DecayInformations/DecayInformation.vue

diff --git a/frontend/src/components/DecayInformations/DecayInformation.vue b/frontend/src/components/DecayInformations/DecayInformation.vue
new file mode 100644
index 000000000..ae76a5bb4
--- /dev/null
+++ b/frontend/src/components/DecayInformations/DecayInformation.vue
@@ -0,0 +1,48 @@
+<template>
+  <div class="decay-information-box">
+    <decay-information-before-startblock v-if="decay.start === null" />
+    <decay-information-decay-startblock
+      v-else-if="isStartBlock"
+      :amount="amount"
+      :decay="decay"
+      :typeId="typeId"
+    />
+    <decay-information-long v-else :amount="amount" :decay="decay" :typeId="typeId" />
+  </div>
+</template>
+<script>
+import DecayInformationLong from '../DecayInformations/DecayInformation-Long'
+import DecayInformationBeforeStartblock from '../DecayInformations/DecayInformation-BeforeStartblock'
+import DecayInformationDecayStartblock from '../DecayInformations/DecayInformation-DecayStartblock'
+
+export default {
+  components: {
+    DecayInformationLong,
+    DecayInformationBeforeStartblock,
+    DecayInformationDecayStartblock,
+  },
+  props: {
+    amount: {
+      type: String,
+      required: true,
+    },
+    decay: {
+      type: Object,
+      required: true,
+    },
+    typeId: {
+      type: String,
+      required: true,
+    },
+    decayStartBlock: {
+      type: Date,
+      required: true,
+    },
+  },
+  computed: {
+    isStartBlock() {
+      return new Date(this.decay.start).getTime() === this.decayStartBlock.getTime()
+    },
+  },
+}
+</script>
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 3cef1f110..8801e4f20 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -28,14 +28,12 @@
       </div>
 
       <b-collapse :class="visible ? 'bg-secondary' : ''" class="pb-4 pt-5" v-model="visible">
-        <decay-information-before-startblock v-if="decay.start === null" />
-        <decay-information-decay-startblock
-          v-else-if="isStartBlock"
-          :amount="amount"
-          :decay="decay"
+        <decay-information
           :typeId="typeId"
+          :decay="decay"
+          :amount="amount"
+          :decayStartBlock="decayStartBlock"
         />
-        <decay-information-long v-else :amount="amount" :decay="decay" :typeId="typeId" />
       </b-collapse>
     </div>
   </div>
@@ -47,9 +45,7 @@ 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'
+import DecayInformation from '../DecayInformations/DecayInformation'
 
 export default {
   name: 'slot-creation',
@@ -60,9 +56,7 @@ export default {
     Memo,
     DateRow,
     DecayRow,
-    DecayInformationLong,
-    DecayInformationBeforeStartblock,
-    DecayInformationDecayStartblock,
+    DecayInformation,
   },
   props: {
     amount: {
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 3d4c8ccb1..215b7cee3 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -28,14 +28,12 @@
       </div>
 
       <b-collapse :class="visible ? 'bg-secondary' : ''" class="pb-4 pt-5" v-model="visible">
-        <decay-information-before-startblock v-if="decay.start === null" />
-        <decay-information-decay-startblock
-          v-else-if="isStartBlock"
-          :amount="amount"
-          :decay="decay"
+        <decay-information
           :typeId="typeId"
+          :decay="decay"
+          :amount="amount"
+          :decayStartBlock="decayStartBlock"
         />
-        <decay-information-long v-else :amount="amount" :decay="decay" :typeId="typeId" />
       </b-collapse>
     </div>
   </div>
@@ -47,9 +45,7 @@ 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'
+import DecayInformation from '../DecayInformations/DecayInformation'
 
 export default {
   name: 'slot-receive',
@@ -60,9 +56,7 @@ export default {
     Memo,
     DateRow,
     DecayRow,
-    DecayInformationLong,
-    DecayInformationBeforeStartblock,
-    DecayInformationDecayStartblock,
+    DecayInformation,
   },
   props: {
     amount: {
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index d9f0ed858..b59d2571f 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -28,14 +28,12 @@
       </div>
 
       <b-collapse :class="visible ? 'bg-secondary' : ''" class="pb-4 pt-5" v-model="visible">
-        <decay-information-before-startblock v-if="decay.start === null" />
-        <decay-information-decay-startblock
-          v-else-if="isStartBlock"
-          :amount="amount"
-          :decay="decay"
+        <decay-information
           :typeId="typeId"
+          :decay="decay"
+          :amount="amount"
+          :decayStartBlock="decayStartBlock"
         />
-        <decay-information-long v-else :amount="amount" :decay="decay" :typeId="typeId" />
       </b-collapse>
     </div>
   </div>
@@ -47,9 +45,8 @@ 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'
+import DecayInformation from '../DecayInformations/DecayInformation'
+
 export default {
   name: 'slot-send',
   components: {
@@ -59,9 +56,7 @@ export default {
     Memo,
     DateRow,
     DecayRow,
-    DecayInformationLong,
-    DecayInformationBeforeStartblock,
-    DecayInformationDecayStartblock,
+    DecayInformation,
   },
   props: {
     amount: {
@@ -95,10 +90,5 @@ export default {
       visible: false,
     }
   },
-  computed: {
-    isStartBlock() {
-      return new Date(this.decay.start).getTime() === this.decayStartBlock.getTime()
-    },
-  },
 }
 </script>

From e34654edda0856b3dd9c6b53f890d606b5a3b158 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 08:13:02 +0100
Subject: [PATCH 06/22] change tests for GddTransactionList

---
 .../src/components/GddTransactionList.spec.js    | 16 +++-------------
 1 file changed, 3 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/GddTransactionList.spec.js b/frontend/src/components/GddTransactionList.spec.js
index 01566ef13..a301e4da5 100644
--- a/frontend/src/components/GddTransactionList.spec.js
+++ b/frontend/src/components/GddTransactionList.spec.js
@@ -256,7 +256,7 @@ describe('GddTransactionList', () => {
 
         it('shows the date of the transaction', () => {
           expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
-            'Mon Feb 28 2022 13:55:47 GMT+0000 (Coordinated Universal Time)',
+            'Mon Feb 28 2022 13:55:47',
           )
         })
 
@@ -285,12 +285,7 @@ describe('GddTransactionList', () => {
 
         it('has a bi-gift icon', () => {
           expect(transaction.findAll('svg').at(1).classes()).toEqual([
-            'bi-gift',
             'gradido-global-color-accent',
-            'm-mb-1',
-            'font2em',
-            'b-icon',
-            'bi',
           ])
         })
 
@@ -321,7 +316,7 @@ describe('GddTransactionList', () => {
 
         it('shows the date of the transaction', () => {
           expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
-            'Fri Feb 25 2022 07:29:26 GMT+0000 (Coordinated Universal Time)',
+            'Fri Feb 25 2022 07:29:26',
           )
         })
       })
@@ -347,12 +342,7 @@ describe('GddTransactionList', () => {
 
         it('has gradido-global-color-accent color', () => {
           expect(transaction.findAll('svg').at(1).classes()).toEqual([
-            'bi-arrow-right-circle',
             'gradido-global-color-accent',
-            'm-mb-1',
-            'font2em',
-            'b-icon',
-            'bi',
           ])
         })
 
@@ -383,7 +373,7 @@ describe('GddTransactionList', () => {
 
         it('shows the date of the transaction', () => {
           expect(transaction.findAll('.gdd-transaction-list-item-date').at(0).text()).toContain(
-            'Wed Feb 23 2022 10:55:30 GMT+0000 (Coordinated Universal Time)',
+            'Wed Feb 23 2022 10:55:30',
           )
         })
 

From ebcc73c153a4a25400494fc2284170b842b9d92b Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 10:34:39 +0100
Subject: [PATCH 07/22] change review from Ulf, rename File Memo.vue to
 MemoRow.vue, add required on props

---
 frontend/src/components/GddTransactionList.vue     |  4 ++++
 frontend/src/components/GdtTransactionList.vue     |  5 -----
 .../components/TransactionRows/AmountAndName.vue   | 14 ++++++++++++--
 .../components/TransactionRows/CollapseIcon.vue    |  1 +
 .../src/components/TransactionRows/DateRow.vue     |  1 +
 .../src/components/TransactionRows/DecayRow.vue    |  1 +
 .../TransactionRows/{Memo.vue => MemoRow.vue}      |  5 +++--
 .../src/components/TransactionRows/TypeIcon.vue    |  2 ++
 .../Transactions/TransactionCreation.vue           |  6 +++---
 .../components/Transactions/TransactionReceive.vue |  6 +++---
 .../components/Transactions/TransactionSend.vue    |  6 +++---
 11 files changed, 33 insertions(+), 18 deletions(-)
 rename frontend/src/components/TransactionRows/{Memo.vue => MemoRow.vue} (83%)

diff --git a/frontend/src/components/GddTransactionList.vue b/frontend/src/components/GddTransactionList.vue
index c3f3d4d7e..3b4cd961d 100644
--- a/frontend/src/components/GddTransactionList.vue
+++ b/frontend/src/components/GddTransactionList.vue
@@ -108,6 +108,10 @@ export default {
 }
 </script>
 <style>
+collaps-icon {
+  width: 95%;
+  position: absolute;
+}
 .el-table .cell {
   padding-left: 0px;
   padding-right: 0px;
diff --git a/frontend/src/components/GdtTransactionList.vue b/frontend/src/components/GdtTransactionList.vue
index 168bf6ae7..0c061ed06 100644
--- a/frontend/src/components/GdtTransactionList.vue
+++ b/frontend/src/components/GdtTransactionList.vue
@@ -89,11 +89,6 @@ export default {
 }
 </script>
 <style>
-collaps-icon {
-  width: 95%;
-  position: absolute;
-}
-
 .el-table .cell {
   padding-left: 0px;
   padding-right: 0px;
diff --git a/frontend/src/components/TransactionRows/AmountAndName.vue b/frontend/src/components/TransactionRows/AmountAndName.vue
index 24cbe8d1c..36a079846 100644
--- a/frontend/src/components/TransactionRows/AmountAndName.vue
+++ b/frontend/src/components/TransactionRows/AmountAndName.vue
@@ -10,7 +10,7 @@
       </b-col>
       <b-col cols="7">
         <div class="gdd-transaction-list-item-name">
-          {{ linkedUser ? linkedUser.firstName + ' ' + linkedUser.lastName : text }}
+          {{ itemText }}
         </div>
       </b-col>
     </b-row>
@@ -18,16 +18,26 @@
 </template>
 <script>
 export default {
-  name: 'AmountAndName',
+  name: 'Amount-And-Name',
   props: {
     amount: {
       type: String,
+      required: true,
     },
     linkedUser: {
       type: Object,
+      required: false,
     },
     text: {
       type: String,
+      required: false,
+    },
+  },
+  computed: {
+    itemText() {
+      return this.linkedUser
+        ? this.linkedUser.firstName + ' ' + this.linkedUser.lastName
+        : this.text
     },
   },
 }
diff --git a/frontend/src/components/TransactionRows/CollapseIcon.vue b/frontend/src/components/TransactionRows/CollapseIcon.vue
index a51efd640..f2032243f 100644
--- a/frontend/src/components/TransactionRows/CollapseIcon.vue
+++ b/frontend/src/components/TransactionRows/CollapseIcon.vue
@@ -12,6 +12,7 @@ export default {
   props: {
     visible: {
       type: Boolean,
+      required: true,
     },
   },
 }
diff --git a/frontend/src/components/TransactionRows/DateRow.vue b/frontend/src/components/TransactionRows/DateRow.vue
index 7883507db..87f2d2dcd 100644
--- a/frontend/src/components/TransactionRows/DateRow.vue
+++ b/frontend/src/components/TransactionRows/DateRow.vue
@@ -19,6 +19,7 @@ export default {
   props: {
     balanceDate: {
       type: String,
+      required: true,
     },
   },
 }
diff --git a/frontend/src/components/TransactionRows/DecayRow.vue b/frontend/src/components/TransactionRows/DecayRow.vue
index d8b969706..f805379d4 100644
--- a/frontend/src/components/TransactionRows/DecayRow.vue
+++ b/frontend/src/components/TransactionRows/DecayRow.vue
@@ -24,6 +24,7 @@ export default {
   props: {
     decay: {
       type: Object,
+      required: false,
     },
   },
 }
diff --git a/frontend/src/components/TransactionRows/Memo.vue b/frontend/src/components/TransactionRows/MemoRow.vue
similarity index 83%
rename from frontend/src/components/TransactionRows/Memo.vue
rename to frontend/src/components/TransactionRows/MemoRow.vue
index a25892e80..61e025d1d 100644
--- a/frontend/src/components/TransactionRows/Memo.vue
+++ b/frontend/src/components/TransactionRows/MemoRow.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="memo">
+  <div class="memo-row">
     <b-row>
       <b-col cols="5">
         <div class="text-right">{{ $t('form.memo') }}</div>
@@ -12,10 +12,11 @@
 </template>
 <script>
 export default {
-  name: 'Memo',
+  name: 'Memo-Row',
   props: {
     memo: {
       type: String,
+      required: false,
     },
   },
 }
diff --git a/frontend/src/components/TransactionRows/TypeIcon.vue b/frontend/src/components/TransactionRows/TypeIcon.vue
index 00dedd77a..199a6436c 100644
--- a/frontend/src/components/TransactionRows/TypeIcon.vue
+++ b/frontend/src/components/TransactionRows/TypeIcon.vue
@@ -11,9 +11,11 @@ export default {
   props: {
     icon: {
       type: String,
+      required: true,
     },
     color: {
       type: String,
+      required: true,
     },
   },
 }
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 8801e4f20..980360cb4 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -16,7 +16,7 @@
             <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
-            <memo :memo="memo" />
+            <memo-row :memo="memo" />
 
             <!-- Datum -->
             <date-row :balanceDate="balanceDate" />
@@ -42,7 +42,7 @@
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
 import AmountAndName from '../TransactionRows/AmountAndName'
-import Memo from '../TransactionRows/Memo'
+import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
 import DecayInformation from '../DecayInformations/DecayInformation'
@@ -53,7 +53,7 @@ export default {
     CollapseIcon,
     TypeIcon,
     AmountAndName,
-    Memo,
+    MemoRow,
     DateRow,
     DecayRow,
     DecayInformation,
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 215b7cee3..b57fcc3b1 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -16,7 +16,7 @@
             <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
-            <memo :memo="memo" />
+            <memo-row :memo="memo" />
 
             <!-- Datum -->
             <date-row :balanceDate="balanceDate" />
@@ -42,7 +42,7 @@
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
 import AmountAndName from '../TransactionRows/AmountAndName'
-import Memo from '../TransactionRows/Memo'
+import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
 import DecayInformation from '../DecayInformations/DecayInformation'
@@ -53,7 +53,7 @@ export default {
     CollapseIcon,
     TypeIcon,
     AmountAndName,
-    Memo,
+    MemoRow,
     DateRow,
     DecayRow,
     DecayInformation,
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index b59d2571f..8ce6e44d0 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -16,7 +16,7 @@
             <amount-and-name :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Memo -->
-            <memo :memo="memo" />
+            <memo-row :memo="memo" />
 
             <!-- Datum -->
             <date-row :balanceDate="balanceDate" />
@@ -42,7 +42,7 @@
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
 import AmountAndName from '../TransactionRows/AmountAndName'
-import Memo from '../TransactionRows/Memo'
+import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
 import DecayInformation from '../DecayInformations/DecayInformation'
@@ -53,7 +53,7 @@ export default {
     CollapseIcon,
     TypeIcon,
     AmountAndName,
-    Memo,
+    MemoRow,
     DateRow,
     DecayRow,
     DecayInformation,

From 216a06f40e8ce57293cd0a98e0d6f355ba6bdf29 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 11:45:16 +0100
Subject: [PATCH 08/22] change icons and colors tested

---
 .../src/components/GddTransactionList.spec.js | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/GddTransactionList.spec.js b/frontend/src/components/GddTransactionList.spec.js
index a301e4da5..f102c5ee9 100644
--- a/frontend/src/components/GddTransactionList.spec.js
+++ b/frontend/src/components/GddTransactionList.spec.js
@@ -285,14 +285,24 @@ describe('GddTransactionList', () => {
 
         it('has a bi-gift icon', () => {
           expect(transaction.findAll('svg').at(1).classes()).toEqual([
+            'bi-gift',
+            'm-mb-1',
+            'font2em',
+            'b-icon',
+            'bi',
             'gradido-global-color-accent',
           ])
         })
 
         it('has gradido-global-color-accent color', () => {
-          expect(transaction.findAll('svg').at(1).classes()).toContain(
+          expect(transaction.findAll('svg').at(1).classes()).toEqual([
+            'bi-gift',
+            'm-mb-1',
+            'font2em',
+            'b-icon',
+            'bi',
             'gradido-global-color-accent',
-          )
+          ])
         })
 
         // operators are renderd by GDD filter
@@ -342,6 +352,11 @@ describe('GddTransactionList', () => {
 
         it('has gradido-global-color-accent color', () => {
           expect(transaction.findAll('svg').at(1).classes()).toEqual([
+            'bi-arrow-right-circle',
+            'm-mb-1',
+            'font2em',
+            'b-icon',
+            'bi',
             'gradido-global-color-accent',
           ])
         })

From 277d0a4b38771967849b8aa1f3e20d1a44503e05 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 12:41:13 +0100
Subject: [PATCH 09/22] set rights

---
 backend/src/auth/RIGHTS.ts                              | 1 +
 backend/src/auth/ROLES.ts                               | 1 +
 backend/src/graphql/resolver/TransactionLinkResolver.ts | 6 ++++++
 3 files changed, 8 insertions(+)

diff --git a/backend/src/auth/RIGHTS.ts b/backend/src/auth/RIGHTS.ts
index 4b9036eed..da6bc90cc 100644
--- a/backend/src/auth/RIGHTS.ts
+++ b/backend/src/auth/RIGHTS.ts
@@ -21,6 +21,7 @@ export enum RIGHTS {
   CREATE_TRANSACTION_LINK = 'CREATE_TRANSACTION_LINK',
   DELETE_TRANSACTION_LINK = 'DELETE_TRANSACTION_LINK',
   QUERY_TRANSACTION_LINK = 'QUERY_TRANSACTION_LINK',
+  REDEEM_TRANSACTION_LINK = 'REDEEM_TRANSACTION_LINK',
   // Admin
   SEARCH_USERS = 'SEARCH_USERS',
   CREATE_PENDING_CREATION = 'CREATE_PENDING_CREATION',
diff --git a/backend/src/auth/ROLES.ts b/backend/src/auth/ROLES.ts
index 2a86b5bab..8a1c61bff 100644
--- a/backend/src/auth/ROLES.ts
+++ b/backend/src/auth/ROLES.ts
@@ -20,6 +20,7 @@ export const ROLE_USER = new Role('user', [
   RIGHTS.HAS_ELOPAGE,
   RIGHTS.CREATE_TRANSACTION_LINK,
   RIGHTS.DELETE_TRANSACTION_LINK,
+  RIGHTS.REDEEM_TRANSACTION_LINK,
 ])
 export const ROLE_ADMIN = new Role('admin', Object.values(RIGHTS)) // all rights
 
diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index 071444de9..e78fccf10 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -122,4 +122,10 @@ export class TransactionLinkResolver {
     }
     return new TransactionLink(transactionLink, new User(user), userRedeem)
   }
+
+  /*
+  @Authorized([RIGHTS.REDEEM_TRANSACTION_LINK])
+  @Mutation(() => Boolean)
+  async redeemTransactionLink(@Arg('id') id: number, @Ctx() context: any)
+  */
 }

From 81cd858eb4a8177e807f3b96a771d4934bd37f9a Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 13:47:04 +0100
Subject: [PATCH 10/22] call transaction resolver to redeem transactoin link.
 Optional senderId  parameter for sendCoins to redeem links

---
 .../src/graphql/arg/TransactionSendArgs.ts    |  5 ++-
 .../resolver/TransactionLinkResolver.ts       | 41 +++++++++++++++++--
 .../graphql/resolver/TransactionResolver.ts   |  6 ++-
 3 files changed, 46 insertions(+), 6 deletions(-)

diff --git a/backend/src/graphql/arg/TransactionSendArgs.ts b/backend/src/graphql/arg/TransactionSendArgs.ts
index e75921383..d85f6d14e 100644
--- a/backend/src/graphql/arg/TransactionSendArgs.ts
+++ b/backend/src/graphql/arg/TransactionSendArgs.ts
@@ -1,4 +1,4 @@
-import { ArgsType, Field } from 'type-graphql'
+import { ArgsType, Field, Int } from 'type-graphql'
 import Decimal from 'decimal.js-light'
 
 @ArgsType()
@@ -11,4 +11,7 @@ export default class TransactionSendArgs {
 
   @Field(() => String)
   memo: string
+
+  @Field(() => Int, { nullable: true })
+  senderId?: number
 }
diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index e78fccf10..c19a42ca5 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -13,6 +13,7 @@ import { RIGHTS } from '@/auth/RIGHTS'
 import { randomBytes } from 'crypto'
 import { User } from '@model/User'
 import { calculateDecay } from '@/util/decay'
+import { TransactionResolver } from './TransactionResolver'
 
 // TODO: do not export, test it inside the resolver
 export const transactionLinkCode = (date: Date): string => {
@@ -123,9 +124,43 @@ export class TransactionLinkResolver {
     return new TransactionLink(transactionLink, new User(user), userRedeem)
   }
 
-  /*
   @Authorized([RIGHTS.REDEEM_TRANSACTION_LINK])
   @Mutation(() => Boolean)
-  async redeemTransactionLink(@Arg('id') id: number, @Ctx() context: any)
-  */
+  async redeemTransactionLink(@Arg('id') id: number, @Ctx() context: any): Promise<boolean> {
+    const userRepository = getCustomRepository(UserRepository)
+    const user = await userRepository.findByPubkeyHex(context.pubKey)
+    const transactionLink = await dbTransactionLink.findOneOrFail({ id })
+
+    const now = new Date()
+
+    if (user.id === transactionLink.userId) {
+      throw new Error('Cannot redeem own transaction link.')
+    }
+
+    if (transactionLink.validUntil.getTime() < now.getTime()) {
+      throw new Error('Transaction Link is not valid anymore.')
+    }
+
+    if (transactionLink.redeemedBy) {
+      throw new Error('Transaction Link already redeemed.')
+    }
+
+    const transactionResolver = new TransactionResolver()
+    transactionResolver.sendCoins(
+      {
+        email: user.email,
+        amount: transactionLink.amount,
+        memo: transactionLink.memo,
+        senderId: transactionLink.userId,
+      },
+      context,
+    )
+    transactionLink.redeemedAt = now
+    transactionLink.redeemedBy = user.id
+    transactionLink.save().catch(() => {
+      throw new Error('Could not update transaction link.')
+    })
+
+    return true
+  }
 }
diff --git a/backend/src/graphql/resolver/TransactionResolver.ts b/backend/src/graphql/resolver/TransactionResolver.ts
index 1d1a00c39..ac7d03f17 100644
--- a/backend/src/graphql/resolver/TransactionResolver.ts
+++ b/backend/src/graphql/resolver/TransactionResolver.ts
@@ -145,12 +145,14 @@ export class TransactionResolver {
   @Authorized([RIGHTS.SEND_COINS])
   @Mutation(() => String)
   async sendCoins(
-    @Args() { email, amount, memo }: TransactionSendArgs,
+    @Args() { email, amount, memo, senderId = 0 }: TransactionSendArgs,
     @Ctx() context: any,
   ): Promise<boolean> {
     // TODO this is subject to replay attacks
     const userRepository = getCustomRepository(UserRepository)
-    const senderUser = await userRepository.findByPubkeyHex(context.pubKey)
+    const senderUser = senderId
+      ? await dbUser.findOneOrFail({ id: senderId })
+      : await userRepository.findByPubkeyHex(context.pubKey)
     if (senderUser.pubKey.length !== 32) {
       throw new Error('invalid sender public key')
     }

From 13fe4300d29f5887e5ca7e34d1c45f47020d03bb Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 15:19:01 +0100
Subject: [PATCH 11/22] extract transaction process in function

---
 .../src/graphql/arg/TransactionSendArgs.ts    |   5 +-
 .../resolver/TransactionLinkResolver.ts       |  18 +--
 .../graphql/resolver/TransactionResolver.ts   | 146 ++++++++++--------
 3 files changed, 87 insertions(+), 82 deletions(-)

diff --git a/backend/src/graphql/arg/TransactionSendArgs.ts b/backend/src/graphql/arg/TransactionSendArgs.ts
index d85f6d14e..e75921383 100644
--- a/backend/src/graphql/arg/TransactionSendArgs.ts
+++ b/backend/src/graphql/arg/TransactionSendArgs.ts
@@ -1,4 +1,4 @@
-import { ArgsType, Field, Int } from 'type-graphql'
+import { ArgsType, Field } from 'type-graphql'
 import Decimal from 'decimal.js-light'
 
 @ArgsType()
@@ -11,7 +11,4 @@ export default class TransactionSendArgs {
 
   @Field(() => String)
   memo: string
-
-  @Field(() => Int, { nullable: true })
-  senderId?: number
 }
diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index c19a42ca5..3eb64b2b0 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -13,7 +13,8 @@ import { RIGHTS } from '@/auth/RIGHTS'
 import { randomBytes } from 'crypto'
 import { User } from '@model/User'
 import { calculateDecay } from '@/util/decay'
-import { TransactionResolver } from './TransactionResolver'
+import { executeTransaction } from './TransactionResolver'
+import { User as dbUser } from '@entity/User'
 
 // TODO: do not export, test it inside the resolver
 export const transactionLinkCode = (date: Date): string => {
@@ -130,10 +131,11 @@ export class TransactionLinkResolver {
     const userRepository = getCustomRepository(UserRepository)
     const user = await userRepository.findByPubkeyHex(context.pubKey)
     const transactionLink = await dbTransactionLink.findOneOrFail({ id })
+    const linkedUser = await dbUser.findOneOrFail({ id: transactionLink.userId })
 
     const now = new Date()
 
-    if (user.id === transactionLink.userId) {
+    if (user.id === linkedUser.id) {
       throw new Error('Cannot redeem own transaction link.')
     }
 
@@ -145,16 +147,8 @@ export class TransactionLinkResolver {
       throw new Error('Transaction Link already redeemed.')
     }
 
-    const transactionResolver = new TransactionResolver()
-    transactionResolver.sendCoins(
-      {
-        email: user.email,
-        amount: transactionLink.amount,
-        memo: transactionLink.memo,
-        senderId: transactionLink.userId,
-      },
-      context,
-    )
+    await executeTransaction(transactionLink.amount, transactionLink.memo, linkedUser, user)
+
     transactionLink.redeemedAt = now
     transactionLink.redeemedBy = user.id
     transactionLink.save().catch(() => {
diff --git a/backend/src/graphql/resolver/TransactionResolver.ts b/backend/src/graphql/resolver/TransactionResolver.ts
index ac7d03f17..3008fc8d5 100644
--- a/backend/src/graphql/resolver/TransactionResolver.ts
+++ b/backend/src/graphql/resolver/TransactionResolver.ts
@@ -34,6 +34,83 @@ import { virtualDecayTransaction } from '@/util/virtualDecayTransaction'
 import Decimal from 'decimal.js-light'
 import { calculateDecay } from '@/util/decay'
 
+export const executeTransaction = async (
+  amount: Decimal,
+  memo: string,
+  sender: dbUser,
+  recipient: dbUser,
+): Promise<boolean> => {
+  if (sender.id === recipient.id) {
+    throw new Error('Sender and Recipient are the same.')
+  }
+
+  // validate amount
+  const receivedCallDate = new Date()
+  const sendBalance = await calculateBalance(sender.id, amount.mul(-1), receivedCallDate)
+  if (!sendBalance) {
+    throw new Error("user hasn't enough GDD or amount is < 0")
+  }
+
+  const queryRunner = getConnection().createQueryRunner()
+  await queryRunner.connect()
+  await queryRunner.startTransaction('READ UNCOMMITTED')
+  try {
+    // transaction
+    const transactionSend = new dbTransaction()
+    transactionSend.typeId = TransactionTypeId.SEND
+    transactionSend.memo = memo
+    transactionSend.userId = sender.id
+    transactionSend.linkedUserId = recipient.id
+    transactionSend.amount = amount.mul(-1)
+    transactionSend.balance = sendBalance.balance
+    transactionSend.balanceDate = receivedCallDate
+    transactionSend.decay = sendBalance.decay.decay
+    transactionSend.decayStart = sendBalance.decay.start
+    transactionSend.previous = sendBalance.lastTransactionId
+    await queryRunner.manager.insert(dbTransaction, transactionSend)
+
+    const transactionReceive = new dbTransaction()
+    transactionReceive.typeId = TransactionTypeId.RECEIVE
+    transactionReceive.memo = memo
+    transactionReceive.userId = recipient.id
+    transactionReceive.linkedUserId = sender.id
+    transactionReceive.amount = amount
+    const receiveBalance = await calculateBalance(recipient.id, amount, receivedCallDate)
+    transactionReceive.balance = receiveBalance ? receiveBalance.balance : amount
+    transactionReceive.balanceDate = receivedCallDate
+    transactionReceive.decay = receiveBalance ? receiveBalance.decay.decay : new Decimal(0)
+    transactionReceive.decayStart = receiveBalance ? receiveBalance.decay.start : null
+    transactionReceive.previous = receiveBalance ? receiveBalance.lastTransactionId : null
+    transactionReceive.linkedTransactionId = transactionSend.id
+    await queryRunner.manager.insert(dbTransaction, transactionReceive)
+
+    // Save linked transaction id for send
+    transactionSend.linkedTransactionId = transactionReceive.id
+    await queryRunner.manager.update(dbTransaction, { id: transactionSend.id }, transactionSend)
+
+    await queryRunner.commitTransaction()
+  } catch (e) {
+    await queryRunner.rollbackTransaction()
+    throw new Error(`Transaction was not successful: ${e}`)
+  } finally {
+    await queryRunner.release()
+  }
+
+  // send notification email
+  // TODO: translate
+  await sendTransactionReceivedEmail({
+    senderFirstName: sender.firstName,
+    senderLastName: sender.lastName,
+    recipientFirstName: recipient.firstName,
+    recipientLastName: recipient.lastName,
+    email: recipient.email,
+    amount,
+    memo,
+  })
+
+  return true
+}
+
 @Resolver()
 export class TransactionResolver {
   @Authorized([RIGHTS.TRANSACTION_LIST])
@@ -145,23 +222,15 @@ export class TransactionResolver {
   @Authorized([RIGHTS.SEND_COINS])
   @Mutation(() => String)
   async sendCoins(
-    @Args() { email, amount, memo, senderId = 0 }: TransactionSendArgs,
+    @Args() { email, amount, memo }: TransactionSendArgs,
     @Ctx() context: any,
   ): Promise<boolean> {
     // TODO this is subject to replay attacks
     const userRepository = getCustomRepository(UserRepository)
-    const senderUser = senderId
-      ? await dbUser.findOneOrFail({ id: senderId })
-      : await userRepository.findByPubkeyHex(context.pubKey)
+    const senderUser = await userRepository.findByPubkeyHex(context.pubKey)
     if (senderUser.pubKey.length !== 32) {
       throw new Error('invalid sender public key')
     }
-    // validate amount
-    const receivedCallDate = new Date()
-    const sendBalance = await calculateBalance(senderUser.id, amount.mul(-1), receivedCallDate)
-    if (!sendBalance) {
-      throw new Error("user hasn't enough GDD or amount is < 0")
-    }
 
     // validate recipient user
     const recipientUser = await dbUser.findOne({ email: email }, { withDeleted: true })
@@ -175,62 +244,7 @@ export class TransactionResolver {
       throw new Error('invalid recipient public key')
     }
 
-    const queryRunner = getConnection().createQueryRunner()
-    await queryRunner.connect()
-    await queryRunner.startTransaction('READ UNCOMMITTED')
-    try {
-      // transaction
-      const transactionSend = new dbTransaction()
-      transactionSend.typeId = TransactionTypeId.SEND
-      transactionSend.memo = memo
-      transactionSend.userId = senderUser.id
-      transactionSend.linkedUserId = recipientUser.id
-      transactionSend.amount = amount.mul(-1)
-      transactionSend.balance = sendBalance.balance
-      transactionSend.balanceDate = receivedCallDate
-      transactionSend.decay = sendBalance.decay.decay
-      transactionSend.decayStart = sendBalance.decay.start
-      transactionSend.previous = sendBalance.lastTransactionId
-      await queryRunner.manager.insert(dbTransaction, transactionSend)
-
-      const transactionReceive = new dbTransaction()
-      transactionReceive.typeId = TransactionTypeId.RECEIVE
-      transactionReceive.memo = memo
-      transactionReceive.userId = recipientUser.id
-      transactionReceive.linkedUserId = senderUser.id
-      transactionReceive.amount = amount
-      const receiveBalance = await calculateBalance(recipientUser.id, amount, receivedCallDate)
-      transactionReceive.balance = receiveBalance ? receiveBalance.balance : amount
-      transactionReceive.balanceDate = receivedCallDate
-      transactionReceive.decay = receiveBalance ? receiveBalance.decay.decay : new Decimal(0)
-      transactionReceive.decayStart = receiveBalance ? receiveBalance.decay.start : null
-      transactionReceive.previous = receiveBalance ? receiveBalance.lastTransactionId : null
-      transactionReceive.linkedTransactionId = transactionSend.id
-      await queryRunner.manager.insert(dbTransaction, transactionReceive)
-
-      // Save linked transaction id for send
-      transactionSend.linkedTransactionId = transactionReceive.id
-      await queryRunner.manager.update(dbTransaction, { id: transactionSend.id }, transactionSend)
-
-      await queryRunner.commitTransaction()
-    } catch (e) {
-      await queryRunner.rollbackTransaction()
-      throw new Error(`Transaction was not successful: ${e}`)
-    } finally {
-      await queryRunner.release()
-    }
-
-    // send notification email
-    // TODO: translate
-    await sendTransactionReceivedEmail({
-      senderFirstName: senderUser.firstName,
-      senderLastName: senderUser.lastName,
-      recipientFirstName: recipientUser.firstName,
-      recipientLastName: recipientUser.lastName,
-      email: recipientUser.email,
-      amount,
-      memo,
-    })
+    await executeTransaction(amount, memo, senderUser, recipientUser)
 
     return true
   }

From 13c61984de19f099e5bfc569d37015c0ae0e393c Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 15:27:02 +0100
Subject: [PATCH 12/22] liniting

---
 backend/src/graphql/resolver/TransactionLinkResolver.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index 048c804e4..7aeb72fc1 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -15,7 +15,6 @@ import { randomBytes } from 'crypto'
 import { User } from '@model/User'
 import { calculateDecay } from '@/util/decay'
 import { executeTransaction } from './TransactionResolver'
-import { User as dbUser } from '@entity/User'
 import { Order } from '@enum/Order'
 
 // TODO: do not export, test it inside the resolver

From 826ad7019c2196db02eef43b5d0e5c1146b22a01 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 15:33:36 +0100
Subject: [PATCH 13/22] add TODO

---
 backend/src/graphql/resolver/TransactionLinkResolver.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index 7aeb72fc1..835b84cbf 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -158,6 +158,7 @@ export class TransactionLinkResolver {
 
     await executeTransaction(transactionLink.amount, transactionLink.memo, linkedUser, user)
 
+    // TODO: Rollback transaction when updating links fails
     transactionLink.redeemedAt = now
     transactionLink.redeemedBy = user.id
     transactionLink.save().catch(() => {

From b3f7fd28a18280a5e00e5bc40f70654c2714d527 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 15:54:59 +0100
Subject: [PATCH 14/22] add transactionLinkId Column to transactions table

---
 .../0032-add-transaction-link-to-transaction.ts    | 14 ++++++++++++++
 1 file changed, 14 insertions(+)
 create mode 100644 database/migrations/0032-add-transaction-link-to-transaction.ts

diff --git a/database/migrations/0032-add-transaction-link-to-transaction.ts b/database/migrations/0032-add-transaction-link-to-transaction.ts
new file mode 100644
index 000000000..0de8c5a43
--- /dev/null
+++ b/database/migrations/0032-add-transaction-link-to-transaction.ts
@@ -0,0 +1,14 @@
+/* MIGRATION TO ADD transactionLinkId FIELDTO TRANSACTION */
+
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+export async function upgrade(queryFn: (query: string, values?: any[]) => Promise<Array<any>>) {
+  await queryFn(
+    'ALTER TABLE `transactions` ADD COLUMN `transactionLinkId` int UNSIGNED DEFAULT NULL;',
+  )
+}
+
+export async function downgrade(queryFn: (query: string, values?: any[]) => Promise<Array<any>>) {
+  await queryFn('ALTER TABLE `transactions` DROP COLUMN `transactionLinkId`;')
+}

From ef4bbbdb2624a9d71fb44345bbb79151ee650986 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 15:57:09 +0100
Subject: [PATCH 15/22] yarn lint --fix

---
 frontend/src/components/Transactions/TransactionReceive.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index 689a447d8..b57fcc3b1 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -3,7 +3,7 @@
     <div @click="visible = !visible">
       <!-- Collaps Icon  -->
       <collapse-icon class="text-right" :visible="visible" />
-      
+
       <div>
         <b-row>
           <!-- ICON  -->

From 6d284c8170e9cc41cc3042de6204d3a1a4880f3f Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 15:58:16 +0100
Subject: [PATCH 16/22] new DB version

---
 backend/src/config/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/backend/src/config/index.ts b/backend/src/config/index.ts
index b1fb8e397..79101856c 100644
--- a/backend/src/config/index.ts
+++ b/backend/src/config/index.ts
@@ -10,7 +10,7 @@ Decimal.set({
 })
 
 const constants = {
-  DB_VERSION: '0031-remove_sendEmail_from_transaction_link',
+  DB_VERSION: '0032-add-transaction-link-to-transaction',
   DECAY_START_TIME: new Date('2021-05-13 17:46:31'), // GMT+0
 }
 

From e7554030b8ce1b72e30bed0fb198bac3f9c8e22b Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 16:01:35 +0100
Subject: [PATCH 17/22] add transactionLinkId to transaction entity

---
 .../Transaction.ts                            | 94 +++++++++++++++++++
 database/entity/Transaction.ts                |  2 +-
 ...032-add-transaction-link-to-transaction.ts |  4 +-
 3 files changed, 97 insertions(+), 3 deletions(-)
 create mode 100644 database/entity/0032-add-transaction-link-to-transaction/Transaction.ts

diff --git a/database/entity/0032-add-transaction-link-to-transaction/Transaction.ts b/database/entity/0032-add-transaction-link-to-transaction/Transaction.ts
new file mode 100644
index 000000000..398fa03db
--- /dev/null
+++ b/database/entity/0032-add-transaction-link-to-transaction/Transaction.ts
@@ -0,0 +1,94 @@
+import Decimal from 'decimal.js-light'
+import { BaseEntity, Entity, PrimaryGeneratedColumn, Column } from 'typeorm'
+import { DecimalTransformer } from '../../src/typeorm/DecimalTransformer'
+
+@Entity('transactions')
+export class Transaction extends BaseEntity {
+  @PrimaryGeneratedColumn('increment', { unsigned: true })
+  id: number
+
+  @Column({ name: 'user_id', unsigned: true, nullable: false })
+  userId: number
+
+  @Column({ type: 'int', unsigned: true, nullable: true, default: null })
+  previous: number | null
+
+  @Column({ name: 'type_id', unsigned: true, nullable: false })
+  typeId: number
+
+  @Column({
+    type: 'decimal',
+    precision: 40,
+    scale: 20,
+    nullable: false,
+    transformer: DecimalTransformer,
+  })
+  amount: Decimal
+
+  @Column({
+    type: 'decimal',
+    precision: 40,
+    scale: 20,
+    nullable: false,
+    transformer: DecimalTransformer,
+  })
+  balance: Decimal
+
+  @Column({
+    name: 'balance_date',
+    type: 'datetime',
+    default: () => 'CURRENT_TIMESTAMP',
+    nullable: false,
+  })
+  balanceDate: Date
+
+  @Column({
+    type: 'decimal',
+    precision: 40,
+    scale: 20,
+    nullable: false,
+    transformer: DecimalTransformer,
+  })
+  decay: Decimal
+
+  @Column({
+    name: 'decay_start',
+    type: 'datetime',
+    nullable: true,
+    default: null,
+  })
+  decayStart: Date | null
+
+  @Column({ length: 255, nullable: false, collation: 'utf8mb4_unicode_ci' })
+  memo: string
+
+  @Column({ name: 'creation_date', type: 'datetime', nullable: true, default: null })
+  creationDate: Date | null
+
+  @Column({
+    name: 'linked_user_id',
+    type: 'int',
+    unsigned: true,
+    nullable: true,
+    default: null,
+  })
+  linkedUserId?: number | null
+
+  @Column({
+    name: 'linked_transaction_id',
+    type: 'int',
+    unsigned: true,
+    nullable: true,
+    default: null,
+  })
+  linkedTransactionId?: number | null
+
+  @Column({
+    name: 'transaction_link_id',
+    type: 'int',
+    unsigned: true,
+    nullable: true,
+    default: null,
+  })
+  transactionLinkId?: number | null
+}
diff --git a/database/entity/Transaction.ts b/database/entity/Transaction.ts
index 56c77c557..3515202d0 100644
--- a/database/entity/Transaction.ts
+++ b/database/entity/Transaction.ts
@@ -1 +1 @@
-export { Transaction } from './0029-clean_transaction_table/Transaction'
+export { Transaction } from './0032-add-transaction-link-to-transaction/Transaction'
diff --git a/database/migrations/0032-add-transaction-link-to-transaction.ts b/database/migrations/0032-add-transaction-link-to-transaction.ts
index 0de8c5a43..82c104f04 100644
--- a/database/migrations/0032-add-transaction-link-to-transaction.ts
+++ b/database/migrations/0032-add-transaction-link-to-transaction.ts
@@ -5,10 +5,10 @@
 
 export async function upgrade(queryFn: (query: string, values?: any[]) => Promise<Array<any>>) {
   await queryFn(
-    'ALTER TABLE `transactions` ADD COLUMN `transactionLinkId` int UNSIGNED DEFAULT NULL;',
+    'ALTER TABLE `transactions` ADD COLUMN `transaction_link_id` int UNSIGNED DEFAULT NULL;',
   )
 }
 
 export async function downgrade(queryFn: (query: string, values?: any[]) => Promise<Array<any>>) {
-  await queryFn('ALTER TABLE `transactions` DROP COLUMN `transactionLinkId`;')
+  await queryFn('ALTER TABLE `transactions` DROP COLUMN `transaction_link_id`;')
 }

From 06d45c1e517ec5ac101fc8975a6faab96c159e85 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 16:12:13 +0100
Subject: [PATCH 18/22] add transaction link id to transaction model

---
 backend/src/graphql/model/Transaction.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/backend/src/graphql/model/Transaction.ts b/backend/src/graphql/model/Transaction.ts
index 29a8a4bbd..684224175 100644
--- a/backend/src/graphql/model/Transaction.ts
+++ b/backend/src/graphql/model/Transaction.ts
@@ -30,6 +30,7 @@ export class Transaction {
     this.creationDate = transaction.creationDate
     this.linkedUser = linkedUser
     this.linkedTransactionId = transaction.linkedTransactionId
+    this.transactionLinkId = transaction.transactionLinkId
   }
 
   @Field(() => Number)
@@ -67,4 +68,8 @@ export class Transaction {
 
   @Field(() => Number, { nullable: true })
   linkedTransactionId?: number | null
+
+  // Links to the TransactionLink when transaction was created by a link
+  @Field(() => Number, { nullable: true })
+  transactionLinkId?: number | null
 }

From 7cb2b1ece2c2ac980aa0ef4c0ccb800e2ec67961 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 16:12:49 +0100
Subject: [PATCH 19/22] test GddTransactionList.spec.js pagenation

---
 frontend/src/components/GddTransactionList.spec.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/src/components/GddTransactionList.spec.js b/frontend/src/components/GddTransactionList.spec.js
index f102c5ee9..320fd094f 100644
--- a/frontend/src/components/GddTransactionList.spec.js
+++ b/frontend/src/components/GddTransactionList.spec.js
@@ -405,6 +405,7 @@ describe('GddTransactionList', () => {
         return {
           amount: '3.14',
           balanceDate: '2021-04-29T17:26:40+00:00',
+          decay: {},
           memo: 'Kreiszahl PI',
           linkedUser: {
             firstName: 'Bibi',
@@ -423,6 +424,7 @@ describe('GddTransactionList', () => {
           transactions,
           transactionCount: 42,
           showPagination: true,
+          decayStartBlock: new Date(),
         })
         paginationButtons = wrapper.find('div.pagination-buttons')
       })

From e79a583ee2c109ac6651045c7b885f76b4542ff1 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 16:29:54 +0100
Subject: [PATCH 20/22] insert transactionLinkId in transaction made by
 redeemed link, update transaction link within commit transaction

---
 .../graphql/resolver/TransactionLinkResolver.ts   | 15 +++++++--------
 .../src/graphql/resolver/TransactionResolver.ts   | 14 ++++++++++++++
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/backend/src/graphql/resolver/TransactionLinkResolver.ts b/backend/src/graphql/resolver/TransactionLinkResolver.ts
index 835b84cbf..9e2af6111 100644
--- a/backend/src/graphql/resolver/TransactionLinkResolver.ts
+++ b/backend/src/graphql/resolver/TransactionLinkResolver.ts
@@ -156,14 +156,13 @@ export class TransactionLinkResolver {
       throw new Error('Transaction Link already redeemed.')
     }
 
-    await executeTransaction(transactionLink.amount, transactionLink.memo, linkedUser, user)
-
-    // TODO: Rollback transaction when updating links fails
-    transactionLink.redeemedAt = now
-    transactionLink.redeemedBy = user.id
-    transactionLink.save().catch(() => {
-      throw new Error('Could not update transaction link.')
-    })
+    await executeTransaction(
+      transactionLink.amount,
+      transactionLink.memo,
+      linkedUser,
+      user,
+      transactionLink,
+    )
 
     return true
   }
diff --git a/backend/src/graphql/resolver/TransactionResolver.ts b/backend/src/graphql/resolver/TransactionResolver.ts
index 20b56af7e..d2bfd7f28 100644
--- a/backend/src/graphql/resolver/TransactionResolver.ts
+++ b/backend/src/graphql/resolver/TransactionResolver.ts
@@ -23,6 +23,7 @@ import { TransactionLinkRepository } from '@repository/TransactionLink'
 
 import { User as dbUser } from '@entity/User'
 import { Transaction as dbTransaction } from '@entity/Transaction'
+import { TransactionLink as dbTransactionLink } from '@entity/TransactionLink'
 
 import { apiPost } from '@/apis/HttpRequest'
 import { TransactionTypeId } from '@enum/TransactionTypeId'
@@ -39,6 +40,7 @@ export const executeTransaction = async (
   memo: string,
   sender: dbUser,
   recipient: dbUser,
+  transactionLink?: dbTransactionLink | null,
 ): Promise<boolean> => {
   if (sender.id === recipient.id) {
     throw new Error('Sender and Recipient are the same.')
@@ -67,6 +69,7 @@ export const executeTransaction = async (
     transactionSend.decay = sendBalance.decay.decay
     transactionSend.decayStart = sendBalance.decay.start
     transactionSend.previous = sendBalance.lastTransactionId
+    transactionSend.transactionLinkId = transactionLink ? transactionLink.id : null
     await queryRunner.manager.insert(dbTransaction, transactionSend)
 
     const transactionReceive = new dbTransaction()
@@ -82,12 +85,23 @@ export const executeTransaction = async (
     transactionReceive.decayStart = receiveBalance ? receiveBalance.decay.start : null
     transactionReceive.previous = receiveBalance ? receiveBalance.lastTransactionId : null
     transactionReceive.linkedTransactionId = transactionSend.id
+    transactionReceive.transactionLinkId = transactionLink ? transactionLink.id : null
     await queryRunner.manager.insert(dbTransaction, transactionReceive)
 
     // Save linked transaction id for send
     transactionSend.linkedTransactionId = transactionReceive.id
     await queryRunner.manager.update(dbTransaction, { id: transactionSend.id }, transactionSend)
 
+    if (transactionLink) {
+      transactionLink.redeemedAt = receivedCallDate
+      transactionLink.redeemedBy = recipient.id
+      await queryRunner.manager.update(
+        dbTransactionLink,
+        { id: transactionLink.id },
+        transactionLink,
+      )
+    }
+
     await queryRunner.commitTransaction()
   } catch (e) {
     await queryRunner.rollbackTransaction()

From 470cb368bfd52bd37570a1c51737af7f909bf837 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Fri, 11 Mar 2022 16:50:36 +0100
Subject: [PATCH 21/22] add AFTER statement to sql

---
 database/migrations/0032-add-transaction-link-to-transaction.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/database/migrations/0032-add-transaction-link-to-transaction.ts b/database/migrations/0032-add-transaction-link-to-transaction.ts
index 82c104f04..79cdf195a 100644
--- a/database/migrations/0032-add-transaction-link-to-transaction.ts
+++ b/database/migrations/0032-add-transaction-link-to-transaction.ts
@@ -5,7 +5,7 @@
 
 export async function upgrade(queryFn: (query: string, values?: any[]) => Promise<Array<any>>) {
   await queryFn(
-    'ALTER TABLE `transactions` ADD COLUMN `transaction_link_id` int UNSIGNED DEFAULT NULL;',
+    'ALTER TABLE `transactions` ADD COLUMN `transaction_link_id` int UNSIGNED DEFAULT NULL AFTER `linked_transaction_id`;',
   )
 }
 

From 1d366bcb5d75aa977f52373fd63e0c77209f2266 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Fri, 11 Mar 2022 16:38:11 +0100
Subject: [PATCH 22/22] change review from ulf

---
 .../{AmountAndName.vue => AmountAndNameRow.vue}          | 4 ++--
 frontend/src/components/TransactionRows/CollapseIcon.vue | 2 +-
 frontend/src/components/TransactionRows/DateRow.vue      | 4 ++--
 frontend/src/components/TransactionRows/DecayRow.vue     | 2 +-
 frontend/src/components/TransactionRows/MemoRow.vue      | 2 +-
 frontend/src/components/TransactionRows/TypeIcon.vue     | 2 +-
 .../src/components/Transactions/TransactionCreation.vue  | 6 +++---
 .../src/components/Transactions/TransactionDecay.vue     | 9 ++++++---
 .../src/components/Transactions/TransactionReceive.vue   | 6 +++---
 frontend/src/components/Transactions/TransactionSend.vue | 6 +++---
 10 files changed, 23 insertions(+), 20 deletions(-)
 rename frontend/src/components/TransactionRows/{AmountAndName.vue => AmountAndNameRow.vue} (92%)

diff --git a/frontend/src/components/TransactionRows/AmountAndName.vue b/frontend/src/components/TransactionRows/AmountAndNameRow.vue
similarity index 92%
rename from frontend/src/components/TransactionRows/AmountAndName.vue
rename to frontend/src/components/TransactionRows/AmountAndNameRow.vue
index 36a079846..fd9be6bf8 100644
--- a/frontend/src/components/TransactionRows/AmountAndName.vue
+++ b/frontend/src/components/TransactionRows/AmountAndNameRow.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="amount-and-name">
+  <div class="amount-and-name-row">
     <b-row>
       <b-col cols="5">
         <div class="text-right">
@@ -18,7 +18,7 @@
 </template>
 <script>
 export default {
-  name: 'Amount-And-Name',
+  name: 'AmountAndNameRow',
   props: {
     amount: {
       type: String,
diff --git a/frontend/src/components/TransactionRows/CollapseIcon.vue b/frontend/src/components/TransactionRows/CollapseIcon.vue
index f2032243f..7582d8eb0 100644
--- a/frontend/src/components/TransactionRows/CollapseIcon.vue
+++ b/frontend/src/components/TransactionRows/CollapseIcon.vue
@@ -8,7 +8,7 @@
 </template>
 <script>
 export default {
-  name: 'Collapse-Icon',
+  name: 'CollapseIcon',
   props: {
     visible: {
       type: Boolean,
diff --git a/frontend/src/components/TransactionRows/DateRow.vue b/frontend/src/components/TransactionRows/DateRow.vue
index 87f2d2dcd..5daccfa69 100644
--- a/frontend/src/components/TransactionRows/DateRow.vue
+++ b/frontend/src/components/TransactionRows/DateRow.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="transaction-rows-date">
+  <div class="date-row">
     <b-row>
       <b-col cols="5">
         <div class="text-right">{{ $t('form.date') }}</div>
@@ -15,7 +15,7 @@
 </template>
 <script>
 export default {
-  name: 'Transaction-Rows-Date',
+  name: 'DateRow',
   props: {
     balanceDate: {
       type: String,
diff --git a/frontend/src/components/TransactionRows/DecayRow.vue b/frontend/src/components/TransactionRows/DecayRow.vue
index f805379d4..92d79ef4b 100644
--- a/frontend/src/components/TransactionRows/DecayRow.vue
+++ b/frontend/src/components/TransactionRows/DecayRow.vue
@@ -17,7 +17,7 @@
 <script>
 import DecayInformationShort from '../DecayInformations/DecayInformation-Short'
 export default {
-  name: 'Decay-Row',
+  name: 'DecayRow',
   components: {
     DecayInformationShort,
   },
diff --git a/frontend/src/components/TransactionRows/MemoRow.vue b/frontend/src/components/TransactionRows/MemoRow.vue
index 61e025d1d..ef79fb38e 100644
--- a/frontend/src/components/TransactionRows/MemoRow.vue
+++ b/frontend/src/components/TransactionRows/MemoRow.vue
@@ -12,7 +12,7 @@
 </template>
 <script>
 export default {
-  name: 'Memo-Row',
+  name: 'MemoRow',
   props: {
     memo: {
       type: String,
diff --git a/frontend/src/components/TransactionRows/TypeIcon.vue b/frontend/src/components/TransactionRows/TypeIcon.vue
index 199a6436c..ff8aa8647 100644
--- a/frontend/src/components/TransactionRows/TypeIcon.vue
+++ b/frontend/src/components/TransactionRows/TypeIcon.vue
@@ -7,7 +7,7 @@
 </template>
 <script>
 export default {
-  name: 'Type-Icon',
+  name: 'TypeIcon',
   props: {
     icon: {
       type: String,
diff --git a/frontend/src/components/Transactions/TransactionCreation.vue b/frontend/src/components/Transactions/TransactionCreation.vue
index 777942f63..33b048c07 100644
--- a/frontend/src/components/Transactions/TransactionCreation.vue
+++ b/frontend/src/components/Transactions/TransactionCreation.vue
@@ -12,7 +12,7 @@
 
           <b-col cols="11">
             <!-- Amount / Name || Text -->
-            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
+            <amount-and-name-row :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
             <memo-row :memo="memo" />
@@ -40,7 +40,7 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName'
+import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
 import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
@@ -51,7 +51,7 @@ export default {
   components: {
     CollapseIcon,
     TypeIcon,
-    AmountAndName,
+    AmountAndNameRow,
     MemoRow,
     DateRow,
     DecayRow,
diff --git a/frontend/src/components/Transactions/TransactionDecay.vue b/frontend/src/components/Transactions/TransactionDecay.vue
index 01f4a9c63..d6c210d9d 100644
--- a/frontend/src/components/Transactions/TransactionDecay.vue
+++ b/frontend/src/components/Transactions/TransactionDecay.vue
@@ -12,7 +12,10 @@
 
           <b-col cols="11">
             <!-- Amount / Name || Text -->
-            <amount-and-name :amount="amount" :text="$t('decay.decay_since_last_transaction')" />
+            <amount-and-name-row
+              :amount="amount"
+              :text="$t('decay.decay_since_last_transaction')"
+            />
           </b-col>
         </b-row>
       </div>
@@ -26,7 +29,7 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName.vue'
+import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
 import DecayInformationDecay from '../DecayInformations/DecayInformation-Decay'
 
 export default {
@@ -34,7 +37,7 @@ export default {
   components: {
     CollapseIcon,
     TypeIcon,
-    AmountAndName,
+    AmountAndNameRow,
     DecayInformationDecay,
   },
   props: {
diff --git a/frontend/src/components/Transactions/TransactionReceive.vue b/frontend/src/components/Transactions/TransactionReceive.vue
index b57fcc3b1..8766fbfa3 100644
--- a/frontend/src/components/Transactions/TransactionReceive.vue
+++ b/frontend/src/components/Transactions/TransactionReceive.vue
@@ -13,7 +13,7 @@
 
           <b-col cols="11">
             <!-- Amount / Name || Text -->
-            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
+            <amount-and-name-row :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Nachricht Memo -->
             <memo-row :memo="memo" />
@@ -41,7 +41,7 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName'
+import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
 import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
@@ -52,7 +52,7 @@ export default {
   components: {
     CollapseIcon,
     TypeIcon,
-    AmountAndName,
+    AmountAndNameRow,
     MemoRow,
     DateRow,
     DecayRow,
diff --git a/frontend/src/components/Transactions/TransactionSend.vue b/frontend/src/components/Transactions/TransactionSend.vue
index 8ce6e44d0..0ae8495f5 100644
--- a/frontend/src/components/Transactions/TransactionSend.vue
+++ b/frontend/src/components/Transactions/TransactionSend.vue
@@ -13,7 +13,7 @@
 
           <b-col cols="11">
             <!-- Amount / Name  -->
-            <amount-and-name :amount="amount" :linkedUser="linkedUser" />
+            <amount-and-name-row :amount="amount" :linkedUser="linkedUser" />
 
             <!-- Memo -->
             <memo-row :memo="memo" />
@@ -41,7 +41,7 @@
 <script>
 import CollapseIcon from '../TransactionRows/CollapseIcon'
 import TypeIcon from '../TransactionRows/TypeIcon'
-import AmountAndName from '../TransactionRows/AmountAndName'
+import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
 import MemoRow from '../TransactionRows/MemoRow'
 import DateRow from '../TransactionRows/DateRow'
 import DecayRow from '../TransactionRows/DecayRow'
@@ -52,7 +52,7 @@ export default {
   components: {
     CollapseIcon,
     TypeIcon,
-    AmountAndName,
+    AmountAndNameRow,
     MemoRow,
     DateRow,
     DecayRow,