From 2d80c7029eae75fbda6c925cc8b0e5b54ef41e17 Mon Sep 17 00:00:00 2001
From: mahula <lenzmath@posteo.de>
Date: Thu, 28 Jul 2022 13:06:42 +0200
Subject: [PATCH] including validation date infos to link copying after
 transaction link creation - adapt transaction link creation mutation to get
 the validation date - add validation date and text to link copy - utilize
 mixins to avoid code doubling

---
 frontend/src/components/ClipboardCopy.vue     | 42 ++-----------------
 .../GddSend/TransactionResultLink.vue         |  4 +-
 frontend/src/graphql/mutations.js             |  3 ++
 frontend/src/pages/Send.vue                   | 13 ++++--
 4 files changed, 19 insertions(+), 43 deletions(-)

diff --git a/frontend/src/components/ClipboardCopy.vue b/frontend/src/components/ClipboardCopy.vue
index efddf8ab3..66e47a264 100644
--- a/frontend/src/components/ClipboardCopy.vue
+++ b/frontend/src/components/ClipboardCopy.vue
@@ -6,7 +6,7 @@
         <b-button size="sm" text="Button" variant="primary" @click="copyLinkWithText">
           {{ $t('gdd_per_link.copy-link-with-text') }}
         </b-button>
-        <b-button size="sm" text="Button" variant="primary" @click="CopyLink">
+        <b-button size="sm" text="Button" variant="primary" @click="copyLink">
           {{ $t('gdd_per_link.copy-link') }}
         </b-button>
         <b-button variant="primary" class="text-light" @click="$emit('show-qr-code-button')">
@@ -21,46 +21,10 @@
   </div>
 </template>
 <script>
+import { copyLinks } from '@/mixins/copyLinks'
 export default {
   name: 'ClipboardCopy',
-  props: {
-    link: { type: String, required: true },
-    amount: { type: Number, required: true },
-    memo: { type: String, required: true },
-  },
-  data() {
-    return {
-      canCopyLink: true,
-    }
-  },
-  methods: {
-    CopyLink() {
-      navigator.clipboard
-        .writeText(this.link)
-        .then(() => {
-          this.toastSuccess(this.$t('gdd_per_link.link-copied'))
-        })
-        .catch(() => {
-          this.canCopyLink = false
-          this.toastError(this.$t('gdd_per_link.not-copied'))
-        })
-    },
-    copyLinkWithText() {
-      navigator.clipboard
-        .writeText(
-          `${this.link}
-${this.$store.state.firstName} ${this.$t('transaction-link.send_you')} ${this.amount} Gradido.
-"${this.memo}"`,
-        )
-        .then(() => {
-          this.toastSuccess(this.$t('gdd_per_link.link-and-text-copied'))
-        })
-        .catch(() => {
-          this.canCopyLink = false
-          this.toastError(this.$t('gdd_per_link.not-copied'))
-        })
-    },
-  },
+  mixins: [copyLinks],
 }
 </script>
 <style>
diff --git a/frontend/src/components/GddSend/TransactionResultLink.vue b/frontend/src/components/GddSend/TransactionResultLink.vue
index 81d18644d..2e1e68ac0 100644
--- a/frontend/src/components/GddSend/TransactionResultLink.vue
+++ b/frontend/src/components/GddSend/TransactionResultLink.vue
@@ -7,6 +7,7 @@
           :link="link"
           :amount="amount"
           :memo="memo"
+          :validUntil="validUntil"
           @show-qr-code-button="showQrCodeButton"
         ></clipboard-copy>
 
@@ -33,8 +34,9 @@ export default {
   },
   props: {
     link: { type: String, required: true },
-    amount: { type: Number, required: true },
+    amount: { type: String, required: true },
     memo: { type: String, required: true },
+    validUntil: { type: String, required: true },
   },
   data() {
     return {
diff --git a/frontend/src/graphql/mutations.js b/frontend/src/graphql/mutations.js
index ec1f5a410..959bdefc3 100644
--- a/frontend/src/graphql/mutations.js
+++ b/frontend/src/graphql/mutations.js
@@ -74,6 +74,9 @@ export const createTransactionLink = gql`
   mutation($amount: Decimal!, $memo: String!) {
     createTransactionLink(amount: $amount, memo: $memo) {
       link
+      amount
+      memo
+      validUntil
     }
   }
 `
diff --git a/frontend/src/pages/Send.vue b/frontend/src/pages/Send.vue
index 85ac53a52..74e2b0270 100644
--- a/frontend/src/pages/Send.vue
+++ b/frontend/src/pages/Send.vue
@@ -45,6 +45,7 @@
             :link="link"
             :amount="amount"
             :memo="memo"
+            :validUntil="validUntil"
             @on-reset="onReset"
           ></transaction-result-link>
         </template>
@@ -149,9 +150,15 @@ export default {
             })
             .then((result) => {
               this.$emit('set-tunneled-email', null)
-              this.link = result.data.createTransactionLink.link
-              this.amount = this.transactionData.amount
-              this.memo = this.transactionData.memo
+              const {
+                data: {
+                  createTransactionLink: { link, amount, memo, validUntil },
+                },
+              } = result
+              this.link = link
+              this.amount = amount
+              this.memo = memo
+              this.validUntil = validUntil
               this.transactionData = { ...EMPTY_TRANSACTION_DATA }
               this.currentTransactionStep = TRANSACTION_STEPS.transactionResultLink
               this.updateTransactions({})