Merge branch 'master' into 2501-feature-federation-implement-a-graphql-client-to-request-getpublickey

.github/workflows/test.yml

@@ -437,7 +437,7 @@ jobs:
           report_name: Coverage Frontend
           type: lcov
           result_path: ./coverage/lcov.info
-          min_coverage: 92
+          min_coverage: 93
           token: ${{ github.token }}
   
   ##############################################################################

frontend/src/App.vue

@@ -30,7 +30,7 @@ export default {
   font-family: 'WorkSans', sans-serif !important;
 }
 .appContent {
-  min-width: 360px;
+  min-width: 330px;
   max-width: 1320px;
   margin-right: auto;
   margin-left: auto;

frontend/src/components/Auth/AuthNavbar.vue

@@ -53,6 +53,7 @@ export default {
 
 .auth-header {
   font-family: 'Open Sans', sans-serif !important;
+  height: 150px;
 }
 
 .sheet-img {
@@ -61,6 +62,17 @@ export default {
   max-width: 64%;
 }
 
+@media screen and (max-width: 1024px) {
+  .auth-header {
+    height: 100px;
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .auth-header {
+    height: 70px;
+  }
+}
 @media screen and (max-width: 450px) {
   .sheet-img {
     top: -15px;

frontend/src/components/ClipboardCopy.vue

@@ -1,17 +1,31 @@
 <template>
   <div class="clipboard-copy">
-    <div v-if="canCopyLink" size="lg" class="mb-5">
+    <div v-if="canCopyLink" class="mb-5">
-      <div class="d-flex">
+      <div>
-        <div>
+        <label>{{ $t('gdd_per_link.copy-link') }}</label>
-          <label>{{ $t('gdd_per_link.copy-link') }}</label>
+        <div
-          <div class="pointer text-center bg-secondary gradido-border-radius p-4" @click="copyLink">
+          class="pointer text-center bg-secondary gradido-border-radius p-3"
-            {{ link }}
+          @click="copyLink"
+          data-test="copyLink"
+        >
+          {{ link }}
+          <div>
+            <b-button class="p-4">
+              <b-icon icon="link45deg"></b-icon>
+            </b-button>
           </div>
         </div>
-        <div class="ml-5">
+      </div>
-          <label>{{ $t('gdd_per_link.copy-link-with-text') }}</label>
+      <div class="mt-5">
+        <label>{{ $t('gdd_per_link.copy-link-with-text') }}</label>
+        <div
+          class="pointer text-center bg-secondary gradido-border-radius p-3"
+          data-test="copyLinkWithText"
+          @click="copyLinkWithText"
+        >
+          {{ linkText }}
           <div>
-            <b-button @click="copyLinkWithText" class="p-4">
+            <b-button class="p-4">
               <b-icon icon="link45deg"></b-icon>
             </b-button>
           </div>

frontend/src/components/Contributions/ContributionForm.vue

@@ -17,7 +17,7 @@
         :label-no-date-selected="$t('contribution.noDateSelected')"
         required
         :disabled="this.form.id !== null"
-        :dropleft="true"
+        :no-flip="true"
       >
         <template #nav-prev-year><span></span></template>
         <template #nav-next-year><span></span></template>
@@ -35,12 +35,12 @@
         v-model="form.hours"
         :name="$t('form.hours')"
         :label="$t('form.hours')"
-        placeholder="0.5"
+        placeholder="0.25"
         :rules="{
           required: true,
-          min: 0.5,
+          min: 0.25,
           max: validMaxTime,
-          gddCreationTime: [0.5, validMaxTime],
+          gddCreationTime: [0.25, validMaxTime],
         }"
         :validMaxTime="validMaxTime"
         @updateAmount="updateAmount"

frontend/src/components/Contributions/ContributionListItem.vue

@@ -26,7 +26,7 @@
             {{ $t('contribution.alert.answerQuestion') }}
           </div>
         </b-col>
-        <b-col cols="12" lg="3" offset="3" offset-md="0" offset-lg="0">
+        <b-col cols="9" lg="3" offset="3" offset-md="0" offset-lg="0">
           <div class="small">
             {{ $t('creation') }} {{ $t('(') }}{{ amount / 20 }} {{ $t('h') }}{{ $t(')') }}
           </div>

frontend/src/components/DecayInformations/CollapseLinksList.spec.js

@@ -10,6 +10,12 @@ const mocks = {
   $tc: jest.fn((tc) => tc),
   $t: jest.fn((t) => t),
   $d: jest.fn((d) => d),
+  $store: {
+    state: {
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+    },
+  },
 }
 
 const propsData = {

frontend/src/components/GddSend/TransactionResultLink.vue

@@ -7,6 +7,7 @@
       :memo="memo"
       :validUntil="validUntil"
     ></clipboard-copy>
+    <label>{{ $t('qrCode') }}</label>
     <div class="text-center">
       <div><figure-qr-code :link="link" /></div>
       <div>

frontend/src/components/Menu/Navbar.vue

@@ -30,7 +30,7 @@
               <div>
                 <div data-test="navbar-item-username">{{ username.username }}</div>
 
-                <div class="text-right" data-test="navbar-item-email">
+                <div data-test="navbar-item-email">
                   {{ $store.state.email }}
                 </div>
               </div>

frontend/src/components/Transactions/TransactionLinkSummary.spec.js

@@ -17,6 +17,12 @@ const mocks = {
   $apollo: {
     query: apolloQueryMock,
   },
+  $store: {
+    state: {
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+    },
+  },
 }
 
 const propsData = {
@@ -102,10 +108,10 @@ describe('TransactionLinkSummary', () => {
 
     describe('click on transaction links', () => {
       beforeEach(async () => {
-        wrapper.find('div.transaction-slot-link').trigger('click')
+        wrapper.find('div.row').trigger('click')
       })
 
-      it.skip('calls the API to get the list transaction links', () => {
+      it('calls the API to get the list transaction links', () => {
         expect(apolloQueryMock).toBeCalledWith({
           query: listTransactionLinks,
           variables: {
@@ -115,14 +121,14 @@ describe('TransactionLinkSummary', () => {
         })
       })
 
-      it.skip('has four transactionLinks', () => {
+      it('has four transactionLinks', () => {
         expect(wrapper.vm.transactionLinks).toHaveLength(4)
       })
 
       describe('close transaction link details', () => {
         beforeEach(() => {
           jest.clearAllMocks()
-          wrapper.find('div.transaction-slot-link').trigger('click')
+          wrapper.find('div.row').trigger('click')
         })
 
         it('does not call the API', () => {
@@ -136,10 +142,10 @@ describe('TransactionLinkSummary', () => {
         describe('reopen transaction link details', () => {
           beforeEach(() => {
             jest.clearAllMocks()
-            wrapper.find('div.transaction-slot-link').trigger('click')
+            wrapper.find('div.row').trigger('click')
           })
 
-          it.skip('calls the API to get the list transaction links', () => {
+          it('calls the API to get the list transaction links', () => {
             expect(apolloQueryMock).toBeCalledWith({
               query: listTransactionLinks,
               variables: {
@@ -149,7 +155,7 @@ describe('TransactionLinkSummary', () => {
             })
           })
 
-          it.skip('has four transactionLinks', () => {
+          it('has four transactionLinks', () => {
             expect(wrapper.vm.transactionLinks).toHaveLength(4)
           })
         })
@@ -215,7 +221,7 @@ describe('TransactionLinkSummary', () => {
         })
 
         it('has eight transactionLinks', () => {
-          expect(wrapper.vm.transactionLinks).toHaveLength(4)
+          expect(wrapper.vm.transactionLinks).toHaveLength(8)
         })
 
         it('loads more transaction links', () => {
@@ -230,19 +236,19 @@ describe('TransactionLinkSummary', () => {
 
         describe('close transaction link list', () => {
           beforeEach(async () => {
-            wrapper.find('div.transaction-slot-link').trigger('click')
+            wrapper.find('div.row').trigger('click')
           })
           describe('reopen transaction link list', () => {
             beforeEach(async () => {
               jest.clearAllMocks()
-              wrapper.find('div.transaction-slot-link').trigger('click')
+              wrapper.find('div.row').trigger('click')
             })
 
-            it.skip('calls the API once', () => {
+            it('calls the API once', () => {
               expect(apolloQueryMock).toBeCalledTimes(1)
             })
 
-            it.skip('calls the API with current page one', () => {
+            it('calls the API with current page one', () => {
               expect(apolloQueryMock).toBeCalledWith({
                 query: listTransactionLinks,
                 variables: {
@@ -289,10 +295,10 @@ describe('TransactionLinkSummary', () => {
       })
     })
 
-    describe.skip('loads transaction links with error', () => {
+    describe('loads transaction links with error', () => {
       beforeEach(() => {
         apolloQueryMock.mockRejectedValue({ message: 'OUCH!' })
-        wrapper.find('div.transaction-slot-link').trigger('click')
+        wrapper.find('div.row').trigger('click')
       })
 
       it('toasts an error message', () => {

frontend/src/layouts/DashboardLayout.vue

@@ -3,7 +3,7 @@
     <div v-if="skeleton">
       <skeleton-overview />
     </div>
-    <div v-else class="mx--3 mx-lg-0">
+    <div v-else class="mx-lg-0">
       <!-- navbar -->
       <b-row>
         <b-col>

frontend/src/mixins/copyLinks.js

@@ -24,15 +24,7 @@ export const copyLinks = {
     },
     copyLinkWithText() {
       navigator.clipboard
-        .writeText(
+        .writeText(this.linkText)
-          `${this.link}
-${this.$store.state.firstName} ${this.$t('transaction-link.send_you')} ${this.amount} Gradido.
-"${this.memo}"
-${this.$t('gdd_per_link.credit-your-gradido')} ${this.$t('gdd_per_link.validUntilDate', {
-            date: this.$d(new Date(this.validUntil), 'short'),
-          })}
-${this.$t('gdd_per_link.link-hint')}`,
-        )
         .then(() => {
           this.toastSuccess(this.$t('gdd_per_link.link-and-text-copied'))
         })
@@ -42,4 +34,15 @@ ${this.$t('gdd_per_link.link-hint')}`,
         })
     },
   },
+  computed: {
+    linkText() {
+      return `${this.link}
+${this.$store.state.firstName} ${this.$t('transaction-link.send_you')} ${this.amount} Gradido.
+"${this.memo}"
+${this.$t('gdd_per_link.credit-your-gradido')} ${this.$t('gdd_per_link.validUntilDate', {
+        date: this.$d(new Date(this.validUntil), 'short'),
+      })}
+${this.$t('gdd_per_link.link-hint')}`
+    },
+  },
 }

frontend/src/pages/ForgotPassword.spec.js

@@ -1,4 +1,4 @@
-import { mount, RouterLinkStub } from '@vue/test-utils'
+import { mount } from '@vue/test-utils'
 import flushPromises from 'flush-promises'
 import { toastErrorSpy } from '@test/testSetup'
 import ForgotPassword from './ForgotPassword'
@@ -7,43 +7,28 @@ const mockAPIcall = jest.fn()
 
 const localVue = global.localVue
 
-const mockRouterPush = jest.fn()
+const mocks = {
-
+  $t: jest.fn((t) => t),
-const stubs = {
+  $apollo: {
-  RouterLink: RouterLinkStub,
+    mutate: mockAPIcall,
-}
+  },
-
+  $route: {
-const createMockObject = (comingFrom) => {
+    params: {
-  return {
+      comingFrom: '',
-    localVue,
-    mocks: {
-      $t: jest.fn((t) => t),
-      $router: {
-        push: mockRouterPush,
-      },
-      $apollo: {
-        mutate: mockAPIcall,
-      },
-      $route: {
-        params: {
-          comingFrom,
-        },
-      },
     },
-    stubs,
+  },
-  }
 }
 
 describe('ForgotPassword', () => {
   let wrapper
 
-  const Wrapper = (functionN) => {
+  const Wrapper = () => {
-    return mount(ForgotPassword, functionN)
+    return mount(ForgotPassword, { localVue, mocks })
   }
 
   describe('mount', () => {
     beforeEach(() => {
-      wrapper = Wrapper(createMockObject())
+      wrapper = Wrapper()
     })
 
     it('renders the component', () => {
@@ -110,12 +95,6 @@ describe('ForgotPassword', () => {
               expect(wrapper.find('.test-message-button').attributes('href')).toBe('/login')
             })
 
-            it.skip('click redirects to "/login"', async () => {
-              // wrapper.find('.test-message-button').trigger('click')
-              // await wrapper.vm.$nextTick()
-              expect(mockRouterPush).toBeCalledWith('/login')
-            })
-
             it('toasts a standard error message', () => {
               expect(toastErrorSpy).toBeCalledWith('error.email-already-sent')
             })
@@ -144,13 +123,20 @@ describe('ForgotPassword', () => {
             it('button link redirects to "/login"', () => {
               expect(wrapper.find('.test-message-button').attributes('href')).toBe('/login')
             })
-
-            it.skip('click redirects to "/login"', () => {
-              // expect(mockRouterPush).toBeCalledWith('/login')
-            })
           })
         })
       })
     })
+
+    describe('route has coming from ', () => {
+      beforeEach(() => {
+        mocks.$route.params.comingFrom = 'coming from'
+        wrapper = Wrapper()
+      })
+
+      it('changes subtitle', () => {
+        expect(wrapper.vm.subtitle).toBe('settings.password.resend_subtitle')
+      })
+    })
   })
 })

frontend/src/pages/Send.spec.js

@@ -254,7 +254,7 @@ describe('Send', () => {
           describe('copy link with success', () => {
             beforeEach(async () => {
               navigatorClipboardMock.mockResolvedValue()
-              await wrapper.find('.pointer').trigger('click')
+              await wrapper.find('div[data-test="copyLink"]').trigger('click')
             })
 
             it('should call clipboard.writeText', () => {
@@ -270,7 +270,7 @@ describe('Send', () => {
           describe('copy link with error', () => {
             beforeEach(async () => {
               navigatorClipboardMock.mockRejectedValue()
-              await wrapper.find('.clipboard-copy').find('.btn-secondary').trigger('click')
+              await wrapper.find('div[data-test="copyLink"]').trigger('click')
             })
 
             it('toasts error message', () => {
@@ -292,7 +292,7 @@ describe('Send', () => {
           describe('copy link and text with success', () => {
             beforeEach(async () => {
               navigatorClipboardMock.mockResolvedValue()
-              await wrapper.findAll('button').at(0).trigger('click')
+              await wrapper.find('div[data-test="copyLinkWithText"]').trigger('click')
             })
 
             it('should call clipboard.writeText', () => {
@@ -312,7 +312,7 @@ describe('Send', () => {
           describe('copy link and text with error', () => {
             beforeEach(async () => {
               navigatorClipboardMock.mockRejectedValue()
-              await wrapper.findAll('button').at(0).trigger('click')
+              await wrapper.find('div[data-test="copyLinkWithText"]').trigger('click')
             })
 
             it('toasts error message', () => {