Merge pull request #984 from gradido/983-hinweis-auf-gradido-unterstuetzen

Link to the funding contributions of gradido.net memberships

frontend/src/locales/de.json

@@ -97,8 +97,9 @@
     "credit": "Gutschrift",
     "factor": "Faktor",
     "formula": "Berechungsformel",
+    "funding": "Zu den Förderbeiträgen",
     "gdt-received": "Gradido Transform (GDT) erhalten",
-    "no-transactions": "Du hast zur Zeit keine Transaktionen",
+    "no-transactions": "Du hast noch keine Gradido Transform (GDT).",
     "publisher": "Dein geworbenes Mitglied hat einen Beitrag bezahlt",
     "raise": "Erhöhung",
     "recruited-member": "Geworbenes Mitglied"

frontend/src/locales/en.json

@@ -97,8 +97,9 @@
     "credit": "Credit",
     "factor": "Factor",
     "formula": "Calculation formula",
+    "funding": "Regarding the funding contributions",
     "gdt-received": "Gradido Transform (GDT) received",
-    "no-transactions": "You currently have no transactions",
+    "no-transactions": "You do not have Gradido Transform (GDT) yet.",
     "publisher": "A member you referred has paid a contribution",
     "raise": "Increase",
     "recruited-member": "Recruited Member"

frontend/src/views/Pages/AccountOverview/GddTransactionList.vue

@@ -124,7 +124,7 @@
         :per-page="pageSize"
         :total-rows="transactionCount"
       ></pagination-buttons>
-      <div v-if="transactions.length === 0" class="mt-4 text-center">
+      <div v-if="transactionCount === 0" class="mt-4 text-center">
         <span>{{ $t('transaction.nullTransactions') }}</span>
       </div>
     </div>

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

@@ -7,41 +7,8 @@ const localVue = global.localVue
 const apolloMock = jest.fn().mockResolvedValue({
   data: {
     listGDTEntries: {
-      count: 4,
+      count: 0,
-      gdtEntries: [
+      gdtEntries: [],
-        {
-          amount: 100,
-          gdt: 1700,
-          factor: 17,
-          comment: '',
-          date: '2021-05-02T17:20:11+00:00',
-          gdtEntryType: GdtEntryType.FORM,
-        },
-        {
-          amount: 1810,
-          gdt: 362,
-          factor: 0.2,
-          comment: 'Dezember 20',
-          date: '2020-12-31T12:00:00+00:00',
-          gdtEntryType: GdtEntryType.GLOBAL_MODIFICATOR,
-        },
-        {
-          amount: 100,
-          gdt: 1700,
-          factor: 17,
-          comment: '',
-          date: '2020-05-07T17:00:00+00:00',
-          gdtEntryType: GdtEntryType.FORM,
-        },
-        {
-          amount: 100,
-          gdt: 110,
-          factor: 22,
-          comment: '',
-          date: '2020-04-10T13:28:00+00:00',
-          gdtEntryType: GdtEntryType.ELOPAGE_PUBLISHER,
-        },
-      ],
     },
   },
 })
@@ -51,10 +18,18 @@ const windowScrollToMock = jest.fn()
 
 window.scrollTo = windowScrollToMock
 
-describe('GdtTransactionList', () => {
+const state = {
+  language: 'en',
+}
+
+describe('GdtTransactionList ', () => {
   let wrapper
 
   const mocks = {
+    $store: {
+      state,
+      commit: jest.fn(),
+    },
     $i18n: {
       locale: 'en',
     },
@@ -73,15 +48,80 @@ describe('GdtTransactionList', () => {
     return mount(GdtTransactionList, { localVue, mocks })
   }
 
-  describe('mount', () => {
+  describe('mount - When no transactions are loaded', () => {
     beforeEach(() => {
       wrapper = Wrapper()
     })
 
+    it('renders the funding button ', () => {
+      expect(wrapper.find('.gdt-funding').exists()).toBe(true)
+    })
+
+    it('links to https://gradido.net/en/memberships/ when clicking', async () => {
+      expect(wrapper.find('.gdt-funding').attributes('href')).toBe(
+        'https://gradido.net/' + state.language + '/memberships/',
+      )
+    })
+  })
+
+  describe('mount - When transactions are loaded', () => {
+    beforeEach(() => {
+      apolloMock.mockResolvedValue({
+        data: {
+          listGDTEntries: {
+            count: 4,
+            gdtEntries: [
+              {
+                id: 1,
+                amount: 100,
+                gdt: 1700,
+                factor: 17,
+                comment: '',
+                date: '2021-05-02T17:20:11+00:00',
+                gdtEntryType: GdtEntryType.FORM,
+              },
+              {
+                id: 2,
+                amount: 1810,
+                gdt: 362,
+                factor: 0.2,
+                comment: 'Dezember 20',
+                date: '2020-12-31T12:00:00+00:00',
+                gdtEntryType: GdtEntryType.GLOBAL_MODIFICATOR,
+              },
+              {
+                id: 3,
+                amount: 100,
+                gdt: 1700,
+                factor: 17,
+                comment: '',
+                date: '2020-05-07T17:00:00+00:00',
+                gdtEntryType: GdtEntryType.FORM,
+              },
+              {
+                id: 4,
+                amount: 100,
+                gdt: 110,
+                factor: 22,
+                comment: '',
+                date: '2020-04-10T13:28:00+00:00',
+                gdtEntryType: GdtEntryType.ELOPAGE_PUBLISHER,
+              },
+            ],
+          },
+        },
+      })
+      wrapper = Wrapper()
+    })
+
     it('renders the component', () => {
       expect(wrapper.find('div.gdt-transaction-list').exists()).toBeTruthy()
     })
 
+    it('does not render the funding button ', () => {
+      expect(wrapper.find('.gdt-funding').exists()).toBe(false)
+    })
+
     describe('server returns valid data', () => {
       it('calls the API', async () => {
         await wrapper.vm.$nextTick()

frontend/src/views/Pages/AccountOverview/GdtTransactionList.vue

@@ -1,8 +1,12 @@
 <template>
   <div class="gdt-transaction-list">
-    <div class="list-group" style="background-color: #fff">
+    <div class="list-group">
-      <div v-if="transactionGdtCount === 0">
+      <div v-if="transactionGdtCount === 0" class="text-center">
         {{ $t('gdt.no-transactions') }}
+        <hr />
+        <b-button class="gdt-funding" :href="link" target="_blank">
+          {{ $t('gdt.funding') }}
+        </b-button>
       </div>
       <div
         v-else
@@ -52,6 +56,7 @@ export default {
       transactionGdtCount: { type: Number, default: 0 },
       currentPage: 1,
       pageSize: 25,
+      link: 'https://gradido.net/' + this.$store.state.language + '/memberships/',
     }
   },
   methods: {