Merge pull request #2958 from gradido/2897-incorrect-errormessage-for-wrong-contribution-link

fix(frontend): incorrect errormessage for wrong contribution link

frontend/src/components/LinkInformations/RedeemInformation.vue

@@ -1,11 +1,12 @@
 <template>
   <div class="redeem-information">
     <b-jumbotron bg-variant="muted" text-variant="dark" border-variant="info">
-      <h1 v-if="isContributionLink">
+      <h1 v-if="amount === ''">{{ $t('gdd_per_link.redeemlink-error') }}</h1>
+      <h1 v-if="isContributionLink && amount !== ''">
         {{ CONFIG.COMMUNITY_NAME }}
         {{ $t('contribution-link.thanksYouWith') }} {{ amount | GDD }}
       </h1>
-      <h1 v-else>
+      <h1 v-if="!isContributionLink && amount !== ''">
         {{ user.firstName }}
         {{ $t('transaction-link.send_you') }} {{ amount | GDD }}
       </h1>

frontend/src/components/LinkInformations/RedeemValid.vue

@@ -3,7 +3,12 @@
     <redeem-information v-bind="linkData" :isContributionLink="isContributionLink" />
     <b-jumbotron>
       <div class="mb-3 text-center">
-        <b-button variant="gradido" @click="$emit('mutation-link', linkData.amount)" size="lg">
+        <b-button
+          variant="gradido"
+          @click="$emit('mutation-link', linkData.amount)"
+          size="lg"
+          :disabled="!validLink"
+        >
           {{ $t('gdd_per_link.redeem') }}
         </b-button>
       </div>
@@ -21,6 +26,7 @@ export default {
   props: {
     linkData: { type: Object, required: true },
     isContributionLink: { type: Boolean, default: false },
+    validLink: { type: Boolean, default: false },
   },
 }
 </script>

frontend/src/locales/de.json

@@ -210,6 +210,7 @@
     "redeemed": "Erfolgreich eingelöst! Deinem Konto wurden {n} GDD gutgeschrieben.",
     "redeemed-at": "Der Link wurde bereits am {date} eingelöst.",
     "redeemed-title": "eingelöst",
+    "redeemlink-error": "Dieser Einlöse-Link ist nicht vollständig.",
     "to-login": "Log dich ein",
     "to-register": "Registriere ein neues Konto.",
     "validUntil": "Gültig bis",

frontend/src/locales/en.json

@@ -210,6 +210,7 @@
     "redeemed": "Successfully redeemed! Your account has been credited with {n} GDD.",
     "redeemed-at": "The link was already redeemed on {date}.",
     "redeemed-title": "redeemed",
+    "redeemlink-error": "This redemption link is not complete.",
     "to-login": "Log in",
     "to-register": "Register a new account.",
     "validUntil": "Valid until",

frontend/src/pages/TransactionLink.spec.js

@@ -374,12 +374,12 @@ describe('TransactionLink', () => {
 
     describe('error on transaction link query', () => {
       beforeEach(() => {
-        apolloQueryMock.mockRejectedValue({ message: 'Ouchh!' })
+        apolloQueryMock.mockRejectedValue({ message: 'gdd_per_link.redeemlink-error' })
         wrapper = Wrapper()
       })
 
       it('toasts an error message', () => {
-        expect(toastErrorSpy).toBeCalledWith('Ouchh!')
+        expect(toastErrorSpy).toBeCalledWith('gdd_per_link.redeemlink-error')
       })
     })
   })

frontend/src/pages/TransactionLink.vue

@@ -14,6 +14,7 @@
           <redeem-valid
             :linkData="linkData"
             :isContributionLink="isContributionLink"
+            :validLink="validLink"
             @mutation-link="mutationLink"
           />
         </template>
@@ -47,12 +48,13 @@ export default {
     return {
       linkData: {
         __typename: 'TransactionLink',
-        amount: '123.45',
-        memo: 'memo',
+        amount: '',
+        memo: '',
         user: {
-          firstName: 'Bibi',
+          firstName: '',
         },
         deletedAt: null,
+        validLink: false,
       },
     }
   },
@@ -67,13 +69,14 @@ export default {
           },
         })
         .then((result) => {
+          this.validLink = true
           this.linkData = result.data.queryTransactionLink
           if (this.linkData.__typename === 'ContributionLink' && this.$store.state.token) {
             this.mutationLink(this.linkData.amount)
           }
         })
-        .catch((err) => {
-          this.toastError(err.message)
+        .catch(() => {
+          this.toastError(this.$t('gdd_per_link.redeemlink-error'))
         })
     },
     mutationLink(amount) {