From 7bb14f50ba26adbc9279f7098907e1d57cec4016 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 31 Mar 2022 15:20:25 +0200
Subject: [PATCH 1/4] add computed TotalBalance and disabled, disabled send
 button if TotalBalance minus

---
 .../GddSend/TransactionConfirmationLink.vue    | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/GddSend/TransactionConfirmationLink.vue b/frontend/src/components/GddSend/TransactionConfirmationLink.vue
index 31ae01cc3..bc15c32e6 100644
--- a/frontend/src/components/GddSend/TransactionConfirmationLink.vue
+++ b/frontend/src/components/GddSend/TransactionConfirmationLink.vue
@@ -33,9 +33,7 @@
       </b-row>
       <b-row class="pr-3">
         <b-col class="text-right">{{ $t('form.new_balance') }}</b-col>
-        <b-col class="text-right">
-          {{ $t('math.aprox') }} {{ (balance - amount - amount * 0.028) | GDD }}
-        </b-col>
+        <b-col class="text-right">{{ $t('math.aprox') }} {{ TotalBalance | GDD }}</b-col>
       </b-row>
     </b-container>
 
@@ -44,7 +42,7 @@
         <b-button @click="$emit('on-reset')">{{ $t('form.cancel') }}</b-button>
       </b-col>
       <b-col class="text-right">
-        <b-button variant="success" :disabled="loading" @click="$emit('send-transaction')">
+        <b-button variant="success" :disabled="disabled" @click="$emit('send-transaction')">
           {{ $t('form.generate_now') }}
         </b-button>
       </b-col>
@@ -62,6 +60,18 @@ export default {
     loading: { type: Boolean, required: true },
     selected: { type: String, required: true },
   },
+
+  computed: {
+    TotalBalance() {
+      return this.balance - this.amount - this.amount * 0.028
+    },
+    disabled() {
+      if (this.TotalBalance < 0) {
+        return 'disabled'
+      }
+      return this.loading
+    },
+  },
 }
 </script>
 <style>

From 23d14a79f7814488e35b93810d11eeb21de868e7 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 31 Mar 2022 20:35:27 +0200
Subject: [PATCH 2/4] use boolean for disbaled, rename and refactor
 totalBalance function

---
 .../components/GddSend/TransactionConfirmationLink.vue | 10 ++++------
 frontend/src/pages/Send.vue                            |  1 -
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/GddSend/TransactionConfirmationLink.vue b/frontend/src/components/GddSend/TransactionConfirmationLink.vue
index bc15c32e6..8e6856e00 100644
--- a/frontend/src/components/GddSend/TransactionConfirmationLink.vue
+++ b/frontend/src/components/GddSend/TransactionConfirmationLink.vue
@@ -33,7 +33,7 @@
       </b-row>
       <b-row class="pr-3">
         <b-col class="text-right">{{ $t('form.new_balance') }}</b-col>
-        <b-col class="text-right">{{ $t('math.aprox') }} {{ TotalBalance | GDD }}</b-col>
+        <b-col class="text-right">{{ $t('math.aprox') }} {{ totalBalance | GDD }}</b-col>
       </b-row>
     </b-container>
 
@@ -58,16 +58,14 @@ export default {
     amount: { type: Number, required: true },
     memo: { type: String, required: true },
     loading: { type: Boolean, required: true },
-    selected: { type: String, required: true },
   },
-
   computed: {
-    TotalBalance() {
-      return this.balance - this.amount - this.amount * 0.028
+    totalBalance() {
+      return this.balance - this.amount * 1.028
     },
     disabled() {
       if (this.TotalBalance < 0) {
-        return 'disabled'
+        return true
       }
       return this.loading
     },
diff --git a/frontend/src/pages/Send.vue b/frontend/src/pages/Send.vue
index 270187bec..2b0a095a6 100644
--- a/frontend/src/pages/Send.vue
+++ b/frontend/src/pages/Send.vue
@@ -24,7 +24,6 @@
         <template #transactionConfirmationLink>
           <transaction-confirmation-link
             :balance="balance"
-            :selected="transactionData.selected"
             :email="transactionData.email"
             :amount="transactionData.amount"
             :memo="transactionData.memo"

From c6dcd29f67e9a5f9c932b6481b9c3c87c1c557b5 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 31 Mar 2022 21:23:30 +0200
Subject: [PATCH 3/4] do not emit events. Trigger the events by interactions
 instead

---
 frontend/src/pages/Send.spec.js | 48 +++++++++++++++++++--------------
 1 file changed, 28 insertions(+), 20 deletions(-)

diff --git a/frontend/src/pages/Send.spec.js b/frontend/src/pages/Send.spec.js
index 9fe774e33..9b35712bc 100644
--- a/frontend/src/pages/Send.spec.js
+++ b/frontend/src/pages/Send.spec.js
@@ -4,6 +4,7 @@ import { toastErrorSpy, toastSuccessSpy } from '@test/testSetup'
 import { TRANSACTION_STEPS } from '@/components/GddSend.vue'
 import { sendCoins, createTransactionLink } from '@/graphql/mutations.js'
 import DashboardLayout from '@/layouts/DashboardLayout_gdd.vue'
+import flushPromises from 'flush-promises'
 
 const apolloMutationMock = jest.fn()
 apolloMutationMock.mockResolvedValue('success')
@@ -57,12 +58,13 @@ describe('Send', () => {
 
     describe('fill transaction form for send coins', () => {
       beforeEach(async () => {
-        wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', {
-          email: 'user@example.org',
-          amount: 23.45,
-          memo: 'Make the best of it!',
-          selected: SEND_TYPES.send,
-        })
+        const transactionForm = wrapper.findComponent({ name: 'TransactionForm' })
+        await transactionForm.findAll('input[type="radio"]').at(0).setChecked()
+        await transactionForm.find('input[type="email"]').setValue('user@example.org')
+        await transactionForm.find('input[type="text"]').setValue('23.45')
+        await transactionForm.find('textarea').setValue('Make the best of it!')
+        await transactionForm.find('form').trigger('submit')
+        await flushPromises()
       })
 
       it('steps forward in the dialog', () => {
@@ -74,7 +76,8 @@ describe('Send', () => {
           beforeEach(async () => {
             await wrapper
               .findComponent({ name: 'TransactionConfirmationSend' })
-              .vm.$emit('on-reset')
+              .find('button.btn-secondary')
+              .trigger('click')
           })
 
           it('shows the transaction formular again', () => {
@@ -98,7 +101,8 @@ describe('Send', () => {
             jest.clearAllMocks()
             await wrapper
               .findComponent({ name: 'TransactionConfirmationSend' })
-              .vm.$emit('send-transaction')
+              .find('button.btn-success')
+              .trigger('click')
           })
 
           it('calls the API when send-transaction is emitted', async () => {
@@ -131,7 +135,8 @@ describe('Send', () => {
             apolloMutationMock.mockRejectedValue({ message: 'recipient not known' })
             await wrapper
               .findComponent({ name: 'TransactionConfirmationSend' })
-              .vm.$emit('send-transaction')
+              .find('button.btn-success')
+              .trigger('click')
           })
 
           it('has a component TransactionResultSendError', () => {
@@ -155,18 +160,17 @@ describe('Send', () => {
       })
     })
 
-    /* LINK */
-
     describe('transaction form link', () => {
       beforeEach(async () => {
         apolloMutationMock.mockResolvedValue({
           data: { createTransactionLink: { code: '0123456789' } },
         })
-        await wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', {
-          amount: 56.78,
-          memo: 'Make the best of the link!',
-          selected: SEND_TYPES.link,
-        })
+        const transactionForm = wrapper.findComponent({ name: 'TransactionForm' })
+        await transactionForm.findAll('input[type="radio"]').at(1).setChecked()
+        await transactionForm.find('input[type="text"]').setValue('56.78')
+        await transactionForm.find('textarea').setValue('Make the best of the link!')
+        await transactionForm.find('form').trigger('submit')
+        await flushPromises()
       })
 
       it('steps forward in the dialog', () => {
@@ -178,7 +182,8 @@ describe('Send', () => {
           jest.clearAllMocks()
           await wrapper
             .findComponent({ name: 'TransactionConfirmationLink' })
-            .vm.$emit('send-transaction')
+            .find('button.btn-success')
+            .trigger('click')
         })
 
         it('calls the API when send-transaction is emitted', async () => {
@@ -254,10 +259,13 @@ describe('Send', () => {
         })
       })
 
-      describe('send apollo if transaction link with error', () => {
-        beforeEach(() => {
+      describe('apollo call returns error', () => {
+        beforeEach(async () => {
           apolloMutationMock.mockRejectedValue({ message: 'OUCH!' })
-          wrapper.find('button.btn-success').trigger('click')
+          await wrapper
+            .findComponent({ name: 'TransactionConfirmationLink' })
+            .find('button.btn-success')
+            .trigger('click')
         })
 
         it('toasts an error message', () => {

From d7690962764af9eaf2b6e3c0f2baeaedb79e2571 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 31 Mar 2022 21:25:47 +0200
Subject: [PATCH 4/4] no changes on Confirmation Send in this PR

---
 .../GddSend/TransactionConfirmationSend.vue           | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/frontend/src/components/GddSend/TransactionConfirmationSend.vue b/frontend/src/components/GddSend/TransactionConfirmationSend.vue
index 6ac367795..2d85fa33f 100644
--- a/frontend/src/components/GddSend/TransactionConfirmationSend.vue
+++ b/frontend/src/components/GddSend/TransactionConfirmationSend.vue
@@ -58,11 +58,7 @@
         <b-button @click="$emit('on-reset')">{{ $t('form.cancel') }}</b-button>
       </b-col>
       <b-col class="text-right">
-        <b-button
-          variant="success"
-          :disabled="disabled"
-          @click="$emit('send-transaction'), (disabled = 'disabled')"
-        >
+        <b-button variant="success" :disabled="loading" @click="$emit('send-transaction')">
           {{ $t('form.send_now') }}
         </b-button>
       </b-col>
@@ -80,11 +76,6 @@ export default {
     loading: { type: Boolean, required: true },
     selected: { type: String, required: true },
   },
-  data() {
-    return {
-      disabled: this.loading,
-    }
-  },
 }
 </script>
 <style>