Merge pull request #647 from gradido/435-Visual-Feedback-on-not-sending-GDD

#435 Visual Feedback on not sending GDD

frontend/src/locales/de.json

@@ -90,7 +90,8 @@
   "transaction":{
     "show_all":"Alle <strong>{count}</strong> Transaktionen ansehen",
     "nullTransactions":"Du hast noch keine Transaktionen auf deinem Konto.",
-    "more": "mehr"
+    "more": "mehr",
+    "receiverNotFound":"Empfänger nicht gefunden"
   },
   "site": {
     "login": {

frontend/src/locales/en.json

@@ -90,7 +90,8 @@
   "transaction":{
     "show_all":"View all <strong>{count}</strong> transactions.",
     "nullTransactions":"You don't have any transactions on your account yet.",
-    "more": "more"
+    "more": "more",
+    "receiverNotFound":"Recipient not found"
   },
   "site": {
     "login": {

frontend/src/views/Pages/AccountOverview.spec.js

@@ -112,7 +112,7 @@ describe('AccountOverview', () => {
       describe('transaction is confirmed and server response is error', () => {
         beforeEach(async () => {
           jest.clearAllMocks()
-          sendMock.mockReturnValue({ success: false })
+          sendMock.mockReturnValue({ success: false, result: { message: 'receiver not found' } })
           await wrapper
             .findComponent({ name: 'TransactionConfirmation' })
             .vm.$emit('send-transaction')
@@ -121,6 +121,10 @@ describe('AccountOverview', () => {
         it('shows the error page', () => {
           expect(wrapper.find('div.card-body').text()).toContain('form.send_transaction_error')
         })
+
+        it('shows recipient not found', () => {
+          expect(wrapper.text()).toContain('transaction.receiverNotFound')
+        })
       })
     })
   })

frontend/src/views/Pages/AccountOverview.vue

@@ -23,7 +23,11 @@
           ></transaction-confirmation>
         </template>
         <template #transaction-result>
-          <transaction-result :error="error" @on-reset="onReset"></transaction-result>
+          <transaction-result
+            :error="error"
+            :errorResult="errorResult"
+            @on-reset="onReset"
+          ></transaction-result>
         </template>
       </gdd-send>
       <hr />
@@ -71,6 +75,7 @@ export default {
       timestamp: Date.now(),
       transactionData: { ...EMPTY_TRANSACTION_DATA },
       error: false,
+      errorResult: '',
       currentTransactionStep: 0,
       loading: false,
     }
@@ -104,6 +109,7 @@ export default {
         this.error = false
         this.$emit('update-balance', this.transactionData.amount)
       } else {
+        this.errorResult = result.result.message
         this.error = true
       }
       this.currentTransactionStep = 2

frontend/src/views/Pages/AccountOverview/GddSend/TransactionResult.vue

@@ -17,9 +17,16 @@
     <b-col>
       <b-card class="p-0" style="background-color: #ebebeba3 !important">
         <div class="p-4" style="font-size: 1.5rem">
-          {{ $t('form.sorry') }}
+          <div>{{ $t('form.sorry') }}</div>
           <hr />
-          {{ $t('form.send_transaction_error') }}
+
+          <div>{{ $t('form.send_transaction_error') }}</div>
+
+          <hr />
+          <div v-if="errorResult === 'receiver not found'">
+            {{ $t('transaction.receiverNotFound') }}
+          </div>
+          <div v-else>({{ errorResult }})</div>
         </div>
         <p class="text-center mt-3">
           <b-button variant="success" @click="$emit('on-reset')">{{ $t('form.close') }}</b-button>
@@ -33,6 +40,7 @@ export default {
   name: 'TransactionResult',
   props: {
     error: { type: Boolean, default: true },
+    errorResult: { type: String, default: '' },
   },
 }
 </script>