Merge pull request #1655 from gradido/1636-Generating-link-does-not-update-gdd-balance

update-balance if link succesfully generated

frontend/src/components/GddSend/TransactionForm.vue

@@ -160,15 +160,18 @@ export default {
   },
   props: {
     balance: { type: Number, default: 0 },
+    email: { type: String, default: '' },
+    amount: { type: Number, default: 0 },
+    memo: { type: String, default: '' },
   },
   data() {
     return {
       amountFocused: false,
       emailFocused: false,
       form: {
-        email: '',
+        email: this.email,
-        amount: '',
+        amount: this.amount ? String(this.amount) : '',
-        memo: '',
+        memo: this.memo,
         amountValue: 0.0,
       },
       selected: SEND_TYPES.send,

frontend/src/components/GddSend/TransactionResultSendError.vue

@@ -31,7 +31,7 @@
 </template>
 <script>
 export default {
-  name: 'TransactionResultSend',
+  name: 'TransactionResultSendError',
   props: {
     error: { type: Boolean, default: false },
     errorResult: { type: String, default: '' },

frontend/src/layouts/DashboardLayout_gdd.spec.js

@@ -140,14 +140,6 @@ describe('DashboardLayoutGdd', () => {
         })
       })
 
-      describe('update balance', () => {
-        it('updates the amount correctelly', async () => {
-          await wrapper.findComponent({ ref: 'router-view' }).vm.$emit('update-balance', 5)
-          await flushPromises()
-          expect(wrapper.vm.balance).toBe(-5)
-        })
-      })
-
       describe('update transactions', () => {
         beforeEach(async () => {
           apolloMock.mockResolvedValue({

frontend/src/layouts/DashboardLayout_gdd.vue

@@ -27,7 +27,6 @@
               :transactionLinkCount="transactionLinkCount"
               :pending="pending"
               :decayStartBlock="decayStartBlock"
-              @update-balance="updateBalance"
               @update-transactions="updateTransactions"
             ></router-view>
           </fade-transition>
@@ -112,9 +111,6 @@ export default {
           // what to do when loading balance fails?
         })
     },
-    updateBalance(ammount) {
-      this.balance -= ammount
-    },
     admin() {
       window.location.assign(CONFIG.ADMIN_AUTH_URL.replace('{token}', this.$store.state.token))
       this.$store.dispatch('logout') // logout without redirect

frontend/src/pages/Send.spec.js

@@ -17,9 +17,7 @@ describe('Send', () => {
   const propsData = {
     balance: 123.45,
     GdtBalance: 1234.56,
-    transactions: [{ balance: 0.1 }],
     pending: true,
-    currentTransactionStep: TRANSACTION_STEPS.transactionConfirmationSend,
   }
 
   const mocks = {
@@ -45,11 +43,10 @@ describe('Send', () => {
     })
 
     it('has a send field', () => {
-      expect(wrapper.find('div.gdd-send').exists()).toBeTruthy()
+      expect(wrapper.find('div.gdd-send').exists()).toBe(true)
     })
 
-    /* SEND */
+    describe('fill transaction form for send coins', () => {
-    describe('transaction form send', () => {
       beforeEach(async () => {
         wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', {
           email: 'user@example.org',
@@ -58,86 +55,92 @@ describe('Send', () => {
           selected: SEND_TYPES.send,
         })
       })
+
       it('steps forward in the dialog', () => {
         expect(wrapper.findComponent({ name: 'TransactionConfirmationSend' }).exists()).toBe(true)
       })
-    })
 
-    describe('confirm transaction if selected: SEND_TYPES.send', () => {
+      describe('confirm transaction view', () => {
-      beforeEach(() => {
+        describe('cancel confirmation', () => {
-        wrapper.setData({
+          beforeEach(async () => {
-          currentTransactionStep: TRANSACTION_STEPS.transactionConfirmationSend,
+            await wrapper
-          transactionData: {
+              .findComponent({ name: 'TransactionConfirmationSend' })
-            email: 'user@example.org',
+              .vm.$emit('on-reset')
-            amount: 23.45,
+          })
-            memo: 'Make the best of it!',
-            selected: SEND_TYPES.send,
-          },
-        })
-      })
 
-      it('resets the transaction process when on-reset is emitted', async () => {
+          it('shows the transaction formular again', () => {
-        await wrapper.findComponent({ name: 'TransactionConfirmationSend' }).vm.$emit('on-reset')
+            expect(wrapper.findComponent({ name: 'TransactionForm' }).exists()).toBe(true)
-        expect(wrapper.findComponent({ name: 'TransactionForm' }).exists()).toBeTruthy()
+          })
-        expect(wrapper.vm.transactionData).toEqual({
-          email: 'user@example.org',
-          amount: 23.45,
-          memo: 'Make the best of it!',
-          selected: SEND_TYPES.send,
-        })
-      })
 
-      describe('transaction is confirmed and server response is success', () => {
+          it('restores the previous data in the formular', () => {
-        beforeEach(async () => {
+            expect(wrapper.find('#input-group-1').find('input').vm.$el.value).toBe(
-          jest.clearAllMocks()
+              'user@example.org',
-          await wrapper
+            )
-            .findComponent({ name: 'TransactionConfirmationSend' })
+            expect(wrapper.find('#input-group-2').find('input').vm.$el.value).toBe('23.45')
-            .vm.$emit('send-transaction')
+            expect(wrapper.find('#input-group-3').find('textarea').vm.$el.value).toBe(
+              'Make the best of it!',
+            )
+          })
         })
 
-        it('calls the API when send-transaction is emitted', async () => {
+        describe('confirm transaction with server succees', () => {
-          expect(apolloMutationMock).toBeCalledWith(
+          beforeEach(async () => {
-            expect.objectContaining({
+            jest.clearAllMocks()
-              mutation: sendCoins,
+            await wrapper
-              variables: {
+              .findComponent({ name: 'TransactionConfirmationSend' })
-                email: 'user@example.org',
+              .vm.$emit('send-transaction')
-                amount: 23.45,
+          })
-                memo: 'Make the best of it!',
+
-                selected: SEND_TYPES.send,
+          it('calls the API when send-transaction is emitted', async () => {
-              },
+            expect(apolloMutationMock).toBeCalledWith(
-            }),
+              expect.objectContaining({
-          )
+                mutation: sendCoins,
+                variables: {
+                  email: 'user@example.org',
+                  amount: 23.45,
+                  memo: 'Make the best of it!',
+                  selected: SEND_TYPES.send,
+                },
+              }),
+            )
+          })
+
+          it('emits update transactions', () => {
+            expect(wrapper.emitted('update-transactions')).toBeTruthy()
+            expect(wrapper.emitted('update-transactions')).toEqual(expect.arrayContaining([[{}]]))
+          })
+
+          it('shows the success page', () => {
+            expect(wrapper.find('div.card-body').text()).toContain('form.send_transaction_success')
+          })
         })
 
-        it('emits update-balance', () => {
+        describe('confirm transaction with server error', () => {
-          expect(wrapper.emitted('update-balance')).toBeTruthy()
+          beforeEach(async () => {
-          expect(wrapper.emitted('update-balance')).toEqual([[23.45]])
+            jest.clearAllMocks()
-        })
+            apolloMutationMock.mockRejectedValue({ message: 'recipient not known' })
+            await wrapper
+              .findComponent({ name: 'TransactionConfirmationSend' })
+              .vm.$emit('send-transaction')
+          })
 
-        it('shows the success page', () => {
+          it('has a component TransactionResultSendError', () => {
-          expect(wrapper.find('div.card-body').text()).toContain('form.send_transaction_success')
+            expect(wrapper.findComponent({ name: 'TransactionResultSendError' }).exists()).toBe(
-        })
+              true,
-      })
+            )
+          })
 
-      describe('transaction is confirmed and server response is error', () => {
+          it('has an standard error text', () => {
-        beforeEach(async () => {
+            expect(wrapper.find('.test-send_transaction_error').text()).toContain(
-          jest.clearAllMocks()
+              'form.send_transaction_error',
-          apolloMutationMock.mockRejectedValue({ message: 'recipient not known' })
+            )
-          await wrapper
+          })
-            .findComponent({ name: 'TransactionConfirmationSend' })
-            .vm.$emit('send-transaction')
-        })
 
-        it('shows the error page', () => {
+          it('shows recipient not found', () => {
-          expect(wrapper.find('.test-send_transaction_error').text()).toContain(
+            expect(wrapper.find('.test-receiver-not-found').text()).toContain(
-            'form.send_transaction_error',
+              'transaction.receiverNotFound',
-          )
+            )
-        })
+          })
-
-        it('shows recipient not found', () => {
-          expect(wrapper.find('.test-receiver-not-found').text()).toContain(
-            'transaction.receiverNotFound',
-          )
         })
       })
     })
@@ -151,10 +154,11 @@ describe('Send', () => {
         })
         await wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', {
           amount: 56.78,
-          memo: 'Make the best of it link!',
+          memo: 'Make the best of the link!',
           selected: SEND_TYPES.link,
         })
       })
+
       it('steps forward in the dialog', () => {
         expect(wrapper.findComponent({ name: 'TransactionConfirmationLink' }).exists()).toBe(true)
       })
@@ -173,18 +177,18 @@ describe('Send', () => {
               mutation: createTransactionLink,
               variables: {
                 amount: 56.78,
-                memo: 'Make the best of it link!',
+                memo: 'Make the best of the link!',
               },
             }),
           )
         })
 
-        it.skip('emits update-balance', () => {
+        it('emits update-transactions', () => {
-          expect(wrapper.emitted('update-balance')).toBeTruthy()
+          expect(wrapper.emitted('update-transactions')).toBeTruthy()
-          expect(wrapper.emitted('update-balance')).toEqual([[56.78]])
+          expect(wrapper.emitted('update-transactions')).toEqual(expect.arrayContaining([[{}]]))
         })
 
-        it('find components ClipBoard', () => {
+        it('finds the clip board component', () => {
           expect(wrapper.findComponent({ name: 'ClipboardCopy' }).exists()).toBe(true)
         })
 
@@ -196,7 +200,7 @@ describe('Send', () => {
           expect(wrapper.find('div.card-body').text()).toContain('form.close')
         })
 
-        describe('Copy link to Clipboard', () => {
+        describe('copy link to clipboard', () => {
           const navigatorClipboard = navigator.clipboard
           beforeAll(() => {
             delete navigator.clipboard
@@ -251,5 +255,39 @@ describe('Send', () => {
         })
       })
     })
+
+    describe('no field selected on send transaction', () => {
+      const errorHandler = localVue.config.errorHandler
+
+      beforeAll(() => {
+        localVue.config.errorHandler = jest.fn()
+      })
+
+      afterAll(() => {
+        localVue.config.errorHandler = errorHandler
+      })
+
+      beforeEach(async () => {
+        await wrapper.setData({
+          currentTransactionStep: TRANSACTION_STEPS.transactionConfirmationSend,
+          transactionData: {
+            email: 'user@example.org',
+            amount: 23.45,
+            memo: 'Make the best of it!',
+            selected: 'not-valid',
+          },
+        })
+      })
+
+      it('throws an error', async () => {
+        try {
+          await wrapper
+            .findComponent({ name: 'TransactionConfirmationSend' })
+            .vm.$emit('send-transaction')
+        } catch (error) {
+          expect(error).toBe('undefined transactionData.selected : not-valid')
+        }
+      })
+    })
   })
 })

frontend/src/pages/Send.vue

@@ -3,7 +3,11 @@
     <b-container>
       <gdd-send :currentTransactionStep="currentTransactionStep" class="pt-3 ml-2 mr-2">
         <template #transactionForm>
-          <transaction-form :balance="balance" @set-transaction="setTransaction"></transaction-form>
+          <transaction-form
+            v-bind="transactionData"
+            :balance="balance"
+            @set-transaction="setTransaction"
+          ></transaction-form>
         </template>
         <template #transactionConfirmationSend>
           <transaction-confirmation-send
@@ -95,7 +99,6 @@ export default {
     transactions: {
       default: () => [],
     },
-
     pending: {
       type: Boolean,
       default: true,
@@ -125,7 +128,8 @@ export default {
             })
             .then(() => {
               this.error = false
-              this.$emit('update-balance', this.transactionData.amount)
+              this.updateTransactions({})
+              this.transactionData = { ...EMPTY_TRANSACTION_DATA }
               this.currentTransactionStep = TRANSACTION_STEPS.transactionResultSendSuccess
             })
             .catch((err) => {
@@ -143,6 +147,7 @@ export default {
             .then((result) => {
               this.code = result.data.createTransactionLink.code
               this.currentTransactionStep = TRANSACTION_STEPS.transactionResultLink
+              this.updateTransactions({})
             })
             .catch((error) => {
               this.toastError(error)
@@ -161,7 +166,7 @@ export default {
     },
   },
   created() {
-    this.updateTransactions(0)
+    this.updateTransactions({})
   },
 }
 </script>