From e9eb3331fe91b3f9c568c445e0a86a038fe19989 Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Wed, 19 May 2021 14:33:23 +0200
Subject: [PATCH 1/6] Transactions list clearer + date visible

---
 .../src/views/Pages/AccountOverview.spec.js   |  2 +-
 frontend/src/views/Pages/AccountOverview.vue  | 14 ++--
 .../{GddTable.vue => GddTransactionList.vue}  | 71 +++++++++----------
 ...ooter.vue => GddTransactionListFooter.vue} |  2 +-
 .../Pages/UserProfileTransactionList.vue      | 25 +++----
 5 files changed, 54 insertions(+), 60 deletions(-)
 rename frontend/src/views/Pages/AccountOverview/{GddTable.vue => GddTransactionList.vue} (72%)
 rename frontend/src/views/Pages/AccountOverview/{GddTableFooter.vue => GddTransactionListFooter.vue} (91%)

diff --git a/frontend/src/views/Pages/AccountOverview.spec.js b/frontend/src/views/Pages/AccountOverview.spec.js
index 68d91ee98..d28b295d8 100644
--- a/frontend/src/views/Pages/AccountOverview.spec.js
+++ b/frontend/src/views/Pages/AccountOverview.spec.js
@@ -32,7 +32,7 @@ describe('AccountOverview', () => {
     })
 
     it('has a transactions table', () => {
-      expect(wrapper.find('gdd-table-stub').exists()).toBeTruthy()
+      expect(wrapper.find('gdd-transaction-list-stub').exists()).toBeTruthy()
     })
   })
 })
diff --git a/frontend/src/views/Pages/AccountOverview.vue b/frontend/src/views/Pages/AccountOverview.vue
index 5c7b9fb76..cf05b846a 100644
--- a/frontend/src/views/Pages/AccountOverview.vue
+++ b/frontend/src/views/Pages/AccountOverview.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <base-header class="pb-lg-4 pt-lg-2 bg-transparent"></base-header>
-    <b-container fluid class="p-lg-2 mt-lg-5">
+    <b-container fluid class="p-0 p-lg-2 mt-lg-5">
       <gdd-status
         v-if="showContext"
         :pending="pending"
@@ -29,7 +29,7 @@
         </template>
       </gdd-send>
       <hr />
-      <gdd-table
+      <gdd-transaction-list
         v-if="showContext"
         :transactions="transactions"
         :max="5"
@@ -37,15 +37,15 @@
         :transactionCount="transactionCount"
         @update-transactions="$emit('update-transactions')"
       />
-      <gdd-table-footer v-if="showContext" :count="transactionCount" />
+      <gdd-transaction-list-footer v-if="showContext" :count="transactionCount" />
     </b-container>
   </div>
 </template>
 <script>
 import GddStatus from './AccountOverview/GddStatus.vue'
 import GddSend from './AccountOverview/GddSend.vue'
-import GddTable from './AccountOverview/GddTable.vue'
-import GddTableFooter from './AccountOverview/GddTableFooter.vue'
+import GddTransactionList from './AccountOverview/GddTransactionList.vue'
+import GddTransactionListFooter from './AccountOverview/GddTransactionListFooter.vue'
 import TransactionForm from './AccountOverview/GddSend/TransactionForm.vue'
 import TransactionConfirmation from './AccountOverview/GddSend/TransactionConfirmation.vue'
 import TransactionResult from './AccountOverview/GddSend/TransactionResult.vue'
@@ -63,8 +63,8 @@ export default {
   components: {
     GddStatus,
     GddSend,
-    GddTable,
-    GddTableFooter,
+    GddTransactionList,
+    GddTransactionListFooter,
     TransactionForm,
     TransactionConfirmation,
     TransactionResult,
diff --git a/frontend/src/views/Pages/AccountOverview/GddTable.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
similarity index 72%
rename from frontend/src/views/Pages/AccountOverview/GddTable.vue
rename to frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
index f516f7cbb..7a7c5cb7f 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTable.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
@@ -6,43 +6,36 @@
         :key="item.id"
         style="background-color: #ebebeba3 !important"
       >
-        <div class="d-flex w-100 justify-content-between">
-          <b-icon
-            v-if="item.type === 'send'"
-            icon="arrow-left-circle"
-            class="m-1 text-danger"
-            font-scale="2"
-            style="color: red"
-          ></b-icon>
-          <b-icon
-            v-else-if="item.type === 'receive'"
-            icon="arrow-right-circle"
-            class="m-1"
-            font-scale="2"
-            style="color: green"
-          ></b-icon>
-          <b-icon
-            v-else-if="item.type === 'creation'"
-            icon="gift"
-            class="m-1"
-            font-scale="2"
-            style="color: orange"
-          ></b-icon>
-          <b-icon
-            v-else
-            icon="droplet-half"
-            class="m-1"
-            font-scale="2"
-            style="color: orange"
-          ></b-icon>
-          <h1 class="">
+        <div class="d-flex">
+          <div style="width: 10%">
+            <b-icon
+              v-if="item.type === 'send'"
+              icon="arrow-left-circle"
+              class="m-mb-1 text-danger font2em"
+            ></b-icon>
+            <b-icon
+              v-else-if="item.type === 'receive'"
+              icon="arrow-right-circle"
+              class="m-md-1 text-success font2em"
+            ></b-icon>
+            <b-icon
+              v-else-if="item.type === 'creation'"
+              icon="gift"
+              class="m-md-1 font2em"
+              style="color: green"
+            ></b-icon>
+            <b-icon v-else icon="droplet-half" class="m-md-1 font2em" style="color: gray"></b-icon>
+          </div>
+          <div class="font1_2em pl-2" style="width: 30%">
+            {{ $n(item.balance) }}
             <span v-if="item.type === 'receive' || item.type === 'creation'">+</span>
             <span v-else>-</span>
-            {{ $n(item.balance) }}
-            <small>GDD</small>
-          </h1>
-          <h2 class="text-muted">{{ item.name }}</h2>
-          <b-button v-b-toggle="'a' + item.transaction_id" variant="secondary">
+          </div>
+          <div class="font1_2em" style="width: 50%">
+            {{ item.name }} -
+            <div class="text-sm">{{ $moment(item.date).format('DD.MM.YYYY - HH:mm:ss') }}</div>
+          </div>
+          <b-button v-b-toggle="'a' + item.transaction_id" class="btn-sm">
             <b>i</b>
           </b-button>
         </div>
@@ -97,7 +90,7 @@
 
 <script>
 export default {
-  name: 'GddTable',
+  name: 'gdd-transaction-list',
   props: {
     transactions: { default: [] },
     max: { type: Number, default: 1000 },
@@ -125,6 +118,12 @@ export default {
 }
 </script>
 <style>
+.font1_2em {
+  font-size: 1.2em;
+}
+.font2em {
+  font-size: 1.5em;
+}
 .el-table .cell {
   padding-left: 0px;
   padding-right: 0px;
diff --git a/frontend/src/views/Pages/AccountOverview/GddTableFooter.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionListFooter.vue
similarity index 91%
rename from frontend/src/views/Pages/AccountOverview/GddTableFooter.vue
rename to frontend/src/views/Pages/AccountOverview/GddTransactionListFooter.vue
index 74f254ebb..0e30d85dc 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTableFooter.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionListFooter.vue
@@ -13,7 +13,7 @@
 
 <script>
 export default {
-  name: 'GddTableFooter',
+  name: 'GddTransactionListFooter',
   props: {
     count: { count: Number },
   },
diff --git a/frontend/src/views/Pages/UserProfileTransactionList.vue b/frontend/src/views/Pages/UserProfileTransactionList.vue
index 6b1a32d48..1b5b30f7b 100644
--- a/frontend/src/views/Pages/UserProfileTransactionList.vue
+++ b/frontend/src/views/Pages/UserProfileTransactionList.vue
@@ -1,29 +1,24 @@
 <template>
   <div>
     <div
-      class="header pb-8 pt-lg-4 d-flex align-items-center profile-header"
+      class="header pb-sm-1 pb-md-7 d-flex align-items-center profile-header"
       style="max-height: 200px"
     ></div>
-    <b-container fluid class="mt--6">
-      <b-row>
-        <b-col class="order-xl-1">
-          <gdd-table
-            :timestamp="timestamp"
-            :transactionCount="transactionCount"
-            :transactions="transactions"
-            @update-transactions="updateTransactions"
-          />
-        </b-col>
-      </b-row>
-    </b-container>
+
+    <gdd-transaction-list
+      :timestamp="timestamp"
+      :transactionCount="transactionCount"
+      :transactions="transactions"
+      @update-transactions="updateTransactions"
+    />
   </div>
 </template>
 <script>
-import GddTable from '../../views/Pages/AccountOverview/GddTable.vue'
+import GddTransactionList from './AccountOverview/GddTransactionList.vue'
 
 export default {
   components: {
-    GddTable,
+    GddTransactionList,
   },
   props: {
     transactions: {

From 8b9aa31339b230721d04bce07882683dbc3c9eed Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Wed, 19 May 2021 17:13:34 +0200
Subject: [PATCH 2/6] remove changes from other PR

---
 frontend/src/locales/de.json               |  4 +-
 frontend/src/locales/en.json               |  4 +-
 frontend/src/routes/routes.js              |  8 ----
 frontend/src/views/Pages/ResetPassword.vue |  4 --
 frontend/src/views/Pages/thx.vue           | 46 +---------------------
 5 files changed, 4 insertions(+), 62 deletions(-)

diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
index b840fc34b..84236f71d 100644
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@@ -84,9 +84,7 @@
     },
     "thx": {
       "title": "Danke!",
-      "email": "Wir haben dir eine eMail gesendet.",
-      "reset": "Dein Passwort wurde geändert",
-      "register": "Du bist jetzt regisriert"      
+      "subtitle": "Wir haben dir eine eMail gesendet."
     },
     "overview":{
       "account_overview":"Kontoübersicht",
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index 4a7a8b09f..9a4a42314 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -84,9 +84,7 @@
     },
     "thx": {
       "title": "Thank you!",
-      "email": "We have sent you an email.",
-      "reset": "Your password has been changed",
-      "register": "You are registred now"      
+      "subtitle": "We have sent you an email."
     },
     "overview":{
       "account_overview":"Account overview",
diff --git a/frontend/src/routes/routes.js b/frontend/src/routes/routes.js
index 0021aa1ed..e9bcf38c8 100755
--- a/frontend/src/routes/routes.js
+++ b/frontend/src/routes/routes.js
@@ -49,14 +49,6 @@ const routes = [
   {
     path: '/thx',
     component: () => import('../views/Pages/thx.vue'),
-    beforeEnter: (to, from, next) => {
-      const validFrom = ['/password', '/reset', '/register']
-      if (!validFrom.includes(from.path)) {
-        next({ path: '/login' })
-      } else {
-        next()
-      }
-    },
   },
   {
     path: '/password',
diff --git a/frontend/src/views/Pages/ResetPassword.vue b/frontend/src/views/Pages/ResetPassword.vue
index c24a33257..de5f256d6 100644
--- a/frontend/src/views/Pages/ResetPassword.vue
+++ b/frontend/src/views/Pages/ResetPassword.vue
@@ -107,10 +107,6 @@ export default {
       const result = await loginAPI.changePassword(this.sessionId, this.email, this.password)
       if (result.success) {
         this.password = ''
-        this.$store.dispatch('login', {
-          sessionId: result.result.data.session_id,
-          email: result.result.data.user.email,
-        })
         this.$router.push('/thx')
       } else {
         alert(result.result.message)
diff --git a/frontend/src/views/Pages/thx.vue b/frontend/src/views/Pages/thx.vue
index 53db302a9..db0b967d6 100644
--- a/frontend/src/views/Pages/thx.vue
+++ b/frontend/src/views/Pages/thx.vue
@@ -5,54 +5,12 @@
       <b-container>
         <div class="header-body text-center mb-7">
           <p class="h1">{{ $t('site.thx.title') }}</p>
-          <p class="h4">{{ $t(displaySetup.subtitle) }}</p>
+          <p class="h4">{{ $t('site.thx.subtitle') }}</p>
           <hr />
-          <b-button :to="displaySetup.linkTo">{{ $t(displaySetup.button) }}</b-button>
+          <b-button to="/login">{{ $t('login') }}</b-button>
         </div>
       </b-container>
     </div>
     <!-- Page content -->
   </div>
 </template>
-<script>
-const textFields = {
-  '/password': {
-    subtitle: 'site.thx.email',
-    button: 'login',
-    linkTo: '/login',
-  },
-  '/reset': {
-    subtitle: 'site.thx.reset',
-    button: 'site.login.signin',
-    linkTo: '/overview',
-  },
-  '/register': {
-    subtitle: 'site.thx.register',
-    button: 'site.login.signin',
-    linkTo: '/overview',
-  },
-}
-
-export default {
-  name: 'Thx',
-  data() {
-    return {
-      comingFrom: null,
-      displaySetup: {},
-    }
-  },
-  beforeRouteEnter(to, from, next) {
-    next((vm) => {
-      vm.comingFrom = from.path
-    })
-  },
-  methods: {
-    setupDisplay() {
-      this.displaySetup = textFields[this.comingFrom]
-    },
-  },
-  created() {
-    this.setupDisplay()
-  },
-}
-</script>

From 9f8abd2a8642a2f10a99f98b567c9781bb101cf7 Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Thu, 20 May 2021 09:44:56 +0200
Subject: [PATCH 3/6] add geticon and getClass for send type from transaction
 request

---
 frontend/src/App.vue                          | 33 +++++++----
 frontend/src/routes/routes.js                 |  4 +-
 .../AccountOverview/GddTransactionList.vue    | 59 +++++++++----------
 .../{UserProfileCard.vue => UserProfile.vue}  |  0
 4 files changed, 50 insertions(+), 46 deletions(-)
 rename frontend/src/views/Pages/{UserProfileCard.vue => UserProfile.vue} (100%)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index d44d64ab3..a6613bec1 100755
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -49,40 +49,49 @@ a,
 .copyright {
   color: #5a7b02;
 }
-gradido-global-color-text {
+.font1_2em {
+  font-size: 1.2em;
+}
+.font2em {
+  font-size: 1.5em;
+}
+.gradido-global-color-text {
   color: #3d443b;
 }
-gradido-global-color-accent {
+.gradido-global-color-accent {
   color: #047006;
 }
-gradido-global-color-6e0a9c9e {
+.gradido-global-color-6e0a9c9e {
   color: #000;
 }
-gradido-global-color-2d0fb154 {
+.gradido-global-color-2d0fb154 {
   color: #047006;
 }
-gradido-global-color-16efe88c {
+.gradido-global-color-16efe88c {
   color: #7ebc55;
 }
-gradido-global-color-1939326 {
+.gradido-global-color-1939326 {
   color: #f6fff6;
 }
-gradido-global-color-9d79fc1 {
+.gradido-global-color-9d79fc1 {
   color: #047006;
 }
-gradido-global-color-6347f4d {
+.gradido-global-color-6347f4d {
   color: #5a7b02;
 }
-gradido-global-color-4fbc19a {
+.gradido-global-color-4fbc19a {
   color: #014034;
 }
-gradido-global-color-d341874 {
+.gradido-global-color-d341874 {
   color: #b6d939;
 }
-gradido-global-color-619d338 {
+.gradido-global-color-619d338 {
   color: #8ebfb1;
 }
-gradido-global-color-44819a9 {
+.gradido-global-color-44819a9 {
   color: #026873;
 }
+.gradido-global-color-gray {
+  color: #858383;
+}
 </style>
diff --git a/frontend/src/routes/routes.js b/frontend/src/routes/routes.js
index 0021aa1ed..d96f4fb62 100755
--- a/frontend/src/routes/routes.js
+++ b/frontend/src/routes/routes.js
@@ -16,7 +16,7 @@ const routes = [
   },
   {
     path: '/profile',
-    component: () => import('../views/Pages/UserProfileCard.vue'),
+    component: () => import('../views/Pages/UserProfile.vue'),
     meta: {
       requiresAuth: true,
     },
@@ -53,8 +53,6 @@ const routes = [
       const validFrom = ['/password', '/reset', '/register']
       if (!validFrom.includes(from.path)) {
         next({ path: '/login' })
-      } else {
-        next()
       }
     },
   },
diff --git a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
index 7a7c5cb7f..cd12c4e5a 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
@@ -8,36 +8,20 @@
       >
         <div class="d-flex">
           <div style="width: 10%">
-            <b-icon
-              v-if="item.type === 'send'"
-              icon="arrow-left-circle"
-              class="m-mb-1 text-danger font2em"
-            ></b-icon>
-            <b-icon
-              v-else-if="item.type === 'receive'"
-              icon="arrow-right-circle"
-              class="m-md-1 text-success font2em"
-            ></b-icon>
-            <b-icon
-              v-else-if="item.type === 'creation'"
-              icon="gift"
-              class="m-md-1 font2em"
-              style="color: green"
-            ></b-icon>
-            <b-icon v-else icon="droplet-half" class="m-md-1 font2em" style="color: gray"></b-icon>
+            <b-icon :icon="getIcon(item)" :class="getClass(item)" />
           </div>
-          <div class="font1_2em pl-2" style="width: 30%">
+          <div class="font1_2em pl-2" style="width: 20%">
             {{ $n(item.balance) }}
-            <span v-if="item.type === 'receive' || item.type === 'creation'">+</span>
-            <span v-else>-</span>
           </div>
-          <div class="font1_2em" style="width: 50%">
+          <div class="font1_2em text-left pl-2" style="width: 65%">
             {{ item.name }} -
             <div class="text-sm">{{ $moment(item.date).format('DD.MM.YYYY - HH:mm:ss') }}</div>
           </div>
-          <b-button v-b-toggle="'a' + item.transaction_id" class="btn-sm">
-            <b>i</b>
-          </b-button>
+          <div class="font1_2em text-right" style="width: 5%">
+            <b-button v-b-toggle="'a' + item.transaction_id" class="btn-sm">
+              <b>i</b>
+            </b-button>
+          </div>
         </div>
         <b-collapse :id="'a' + item.transaction_id" class="mt-2">
           <b-card>
@@ -81,7 +65,7 @@
           </b-card>
         </b-collapse>
       </b-list-group-item>
-      <div v-if="transactions.length === 0" class="mt-lg-4 text-center">
+      <div v-if="transactions.length !== 0" class="mt-4 text-center">
         <span>{{ $t('transaction.nullTransactions') }}</span>
       </div>
     </b-list-group>
@@ -89,6 +73,13 @@
 </template>
 
 <script>
+const iconsByType = {
+  send: { icon: 'arrow-left-circle', classes: 'text-danger' },
+  receive: { icon: 'arrow-right-circle', classes: 'gradido-global-color-accent' },
+  creation: { icon: 'gift', classes: 'gradido-global-color-accent' },
+  decay: { icon: 'droplet-half', classes: 'gradido-global-color-gray' },
+}
+
 export default {
   name: 'gdd-transaction-list',
   props: {
@@ -114,16 +105,22 @@ export default {
     updateTransactions() {
       this.$emit('update-transactions')
     },
+    getIcon(item) {
+      const icon = iconsByType[item.type]
+      if (icon) return icon.icon
+      const thing = new Error('no item to given type')
+      thing()
+    },
+    getClass(item) {
+      const icon = iconsByType[item.type]
+      if (icon) return icon.classes + ' m-mb-1 font2em'
+      const thing = new Error('no item to given type')
+      thing()
+    },
   },
 }
 </script>
 <style>
-.font1_2em {
-  font-size: 1.2em;
-}
-.font2em {
-  font-size: 1.5em;
-}
 .el-table .cell {
   padding-left: 0px;
   padding-right: 0px;
diff --git a/frontend/src/views/Pages/UserProfileCard.vue b/frontend/src/views/Pages/UserProfile.vue
similarity index 100%
rename from frontend/src/views/Pages/UserProfileCard.vue
rename to frontend/src/views/Pages/UserProfile.vue

From 34e573a1e03267fa2b88556a8d3c8cb0a92c5167 Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Thu, 20 May 2021 15:04:34 +0200
Subject: [PATCH 4/6] add operator, click event info transaction from button to
 row

---
 frontend/src/locales/de.json                  |  1 +
 frontend/src/locales/en.json                  |  1 +
 .../AccountOverview/GddTransactionList.vue    | 32 ++++++++++++-------
 3 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
index 84236f71d..7dfa05ad1 100644
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@@ -18,6 +18,7 @@
     "de": "Deutsch",
     "en": "English"
   },
+  "decay": "Vergänglichkeit",
   "form": {
     "cancel":"Abbrechen",
     "reset": "Zurücksetzen",
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index 9a4a42314..f8a4a88a4 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -18,6 +18,7 @@
     "de": "Deutsch",
     "en": "English"
   },
+  "decay": "Decay",
   "form": {
     "cancel":"Cancel",
     "reset": "Reset",
diff --git a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
index cd12c4e5a..b878e5a76 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
@@ -6,24 +6,26 @@
         :key="item.id"
         style="background-color: #ebebeba3 !important"
       >
-        <div class="d-flex">
+        <div class="d-flex" v-b-toggle="'a' + item.date + ''" >
           <div style="width: 10%">
             <b-icon :icon="getIcon(item)" :class="getClass(item)" />
           </div>
-          <div class="font1_2em pl-2" style="width: 20%">
+          <div class="font1_2em pr-2 text-right" style="width: 20%">
+            <span>{{getOperator(item)}}</span>
             {{ $n(item.balance) }}
           </div>
           <div class="font1_2em text-left pl-2" style="width: 65%">
-            {{ item.name }} -
+            {{ item.name }} <small>{{ item.name ? '' : $t('decay') }}</small>
             <div class="text-sm">{{ $moment(item.date).format('DD.MM.YYYY - HH:mm:ss') }}</div>
           </div>
-          <div class="font1_2em text-right" style="width: 5%">
-            <b-button v-b-toggle="'a' + item.transaction_id" class="btn-sm">
+           <div class="font1_2em text-right" style="width: 5%">
+            <b-button class="btn-sm">
               <b>i</b>
             </b-button>
           </div>
+        
         </div>
-        <b-collapse :id="'a' + item.transaction_id" class="mt-2">
+        <b-collapse :id="'a' + item.date + ''" class="mt-2">
           <b-card>
             <b-list-group>
               <b-list-group-item v-if="item.type === 'send'">
@@ -56,10 +58,10 @@
                 {{ item.memo }}
               </b-list-group-item>
             </b-list-group>
-            <b-button v-b-toggle="'collapse-1-inner' + item.transaction_id" variant="secondary">
+            <b-button v-b-toggle="'collapse-1-inner' + item.date" variant="secondary">
               {{ $t('transaction.more') }}
             </b-button>
-            <b-collapse :id="'collapse-1-inner' + item.transaction_id" class="mt-2">
+            <b-collapse :id="'collapse-1-inner' + item.date" class="mt-2">
               <b-card>{{ item }}</b-card>
             </b-collapse>
           </b-card>
@@ -74,10 +76,10 @@
 
 <script>
 const iconsByType = {
-  send: { icon: 'arrow-left-circle', classes: 'text-danger' },
-  receive: { icon: 'arrow-right-circle', classes: 'gradido-global-color-accent' },
-  creation: { icon: 'gift', classes: 'gradido-global-color-accent' },
-  decay: { icon: 'droplet-half', classes: 'gradido-global-color-gray' },
+  send: { icon: 'arrow-left-circle', classes: 'text-danger', operator: '-'},
+  receive: { icon: 'arrow-right-circle', classes: 'gradido-global-color-accent', operator: '+' },
+  creation: { icon: 'gift', classes: 'gradido-global-color-accent', operator: '+' },
+  decay: { icon: 'droplet-half', classes: 'gradido-global-color-gray', operator: '-' },
 }
 
 export default {
@@ -116,6 +118,12 @@ export default {
       if (icon) return icon.classes + ' m-mb-1 font2em'
       const thing = new Error('no item to given type')
       thing()
+    }, 
+    getOperator(item) {
+      const icon = iconsByType[item.type]
+      if (icon) return icon.operator
+      const thing = new Error('no item to given type')
+      thing()
     },
   },
 }

From 4c6414fd81ae45ca2c8a3c8c40bcc78ec41075d2 Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Thu, 20 May 2021 15:06:22 +0200
Subject: [PATCH 5/6] translation decay, yarn lint fix, yarn test

---
 .../Pages/AccountOverview/GddTransactionList.vue   | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
index b878e5a76..fa1f9f6a9 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
@@ -6,24 +6,24 @@
         :key="item.id"
         style="background-color: #ebebeba3 !important"
       >
-        <div class="d-flex" v-b-toggle="'a' + item.date + ''" >
+        <div class="d-flex" v-b-toggle="'a' + item.date + ''">
           <div style="width: 10%">
             <b-icon :icon="getIcon(item)" :class="getClass(item)" />
           </div>
           <div class="font1_2em pr-2 text-right" style="width: 20%">
-            <span>{{getOperator(item)}}</span>
+            <span>{{ getOperator(item) }}</span>
             {{ $n(item.balance) }}
           </div>
           <div class="font1_2em text-left pl-2" style="width: 65%">
-            {{ item.name }} <small>{{ item.name ? '' : $t('decay') }}</small>
+            {{ item.name }}
+            <small>{{ item.name ? '' : $t('decay') }}</small>
             <div class="text-sm">{{ $moment(item.date).format('DD.MM.YYYY - HH:mm:ss') }}</div>
           </div>
-           <div class="font1_2em text-right" style="width: 5%">
+          <div class="font1_2em text-right" style="width: 5%">
             <b-button class="btn-sm">
               <b>i</b>
             </b-button>
           </div>
-        
         </div>
         <b-collapse :id="'a' + item.date + ''" class="mt-2">
           <b-card>
@@ -76,7 +76,7 @@
 
 <script>
 const iconsByType = {
-  send: { icon: 'arrow-left-circle', classes: 'text-danger', operator: '-'},
+  send: { icon: 'arrow-left-circle', classes: 'text-danger', operator: '-' },
   receive: { icon: 'arrow-right-circle', classes: 'gradido-global-color-accent', operator: '+' },
   creation: { icon: 'gift', classes: 'gradido-global-color-accent', operator: '+' },
   decay: { icon: 'droplet-half', classes: 'gradido-global-color-gray', operator: '-' },
@@ -118,7 +118,7 @@ export default {
       if (icon) return icon.classes + ' m-mb-1 font2em'
       const thing = new Error('no item to given type')
       thing()
-    }, 
+    },
     getOperator(item) {
       const icon = iconsByType[item.type]
       if (icon) return icon.operator

From 427843c4466889a5137314211528f0ddce3e936f Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Thu, 20 May 2021 15:37:56 +0200
Subject: [PATCH 6/6] fix remove test transactions.length !== 0

---
 .../views/Pages/AccountOverview/GddTransactionList.vue    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
index fa1f9f6a9..7fae1d935 100644
--- a/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
+++ b/frontend/src/views/Pages/AccountOverview/GddTransactionList.vue
@@ -7,10 +7,10 @@
         style="background-color: #ebebeba3 !important"
       >
         <div class="d-flex" v-b-toggle="'a' + item.date + ''">
-          <div style="width: 10%">
+          <div style="width: 8%">
             <b-icon :icon="getIcon(item)" :class="getClass(item)" />
           </div>
-          <div class="font1_2em pr-2 text-right" style="width: 20%">
+          <div class="font1_2em pr-2 text-right" style="width: 22%">
             <span>{{ getOperator(item) }}</span>
             {{ $n(item.balance) }}
           </div>
@@ -19,7 +19,7 @@
             <small>{{ item.name ? '' : $t('decay') }}</small>
             <div class="text-sm">{{ $moment(item.date).format('DD.MM.YYYY - HH:mm:ss') }}</div>
           </div>
-          <div class="font1_2em text-right" style="width: 5%">
+          <div class="text-right" style="width: 5%">
             <b-button class="btn-sm">
               <b>i</b>
             </b-button>
@@ -67,7 +67,7 @@
           </b-card>
         </b-collapse>
       </b-list-group-item>
-      <div v-if="transactions.length !== 0" class="mt-4 text-center">
+      <div v-if="transactions.length === 0" class="mt-4 text-center">
         <span>{{ $t('transaction.nullTransactions') }}</span>
       </div>
     </b-list-group>