Merge branch 'master' into slots-for-right-sidebar

.github/workflows/test.yml

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

.vscode/extensions.json

@@ -3,6 +3,10 @@
         "streetsidesoftware.code-spell-checker",
         "dbaeumer.vscode-eslint",
         "esbenp.prettier-vscode",
-        "hediet.vscode-drawio"
+        "hediet.vscode-drawio",
+        "streetsidesoftware.code-spell-checker-german",
+        "mtxr.sqltools",
+        "mtxr.sqltools-driver-mysql",
+        "jcbuisson.vue"
     ]
 }

.vscode/settings.json

@@ -1,3 +1,18 @@
 {
-    "git.ignoreLimitWarning": true
+    "git.ignoreLimitWarning": true,
+    "sqltools.connections": [
+        {
+            "mysqlOptions": {
+                "authProtocol": "default"
+            },
+            "previewLimit": 50,
+            "server": "localhost",
+            "port": 3306,
+            "driver": "MariaDB",
+            "name": "localhost",
+            "database": "gradido_community",
+            "username": "root",
+            "password": ""
+        }
+    ],
 }

backend/package.json

@@ -31,7 +31,6 @@
     "express": "^4.17.1",
     "graphql": "^15.5.1",
     "i18n": "^0.15.1",
-    "jest": "^27.2.4",
     "jsonwebtoken": "^8.5.1",
     "lodash.clonedeep": "^4.5.0",
     "log4js": "^6.4.6",

backend/src/auth/RIGHTS.ts

@@ -35,6 +35,7 @@ export enum RIGHTS {
   SEARCH_ADMIN_USERS = 'SEARCH_ADMIN_USERS',
   CREATE_CONTRIBUTION_MESSAGE = 'CREATE_CONTRIBUTION_MESSAGE',
   LIST_ALL_CONTRIBUTION_MESSAGES = 'LIST_ALL_CONTRIBUTION_MESSAGES',
+  OPEN_CREATIONS = 'OPEN_CREATIONS',
   // Admin
   SEARCH_USERS = 'SEARCH_USERS',
   SET_USER_ROLE = 'SET_USER_ROLE',

backend/src/auth/ROLES.ts

@@ -33,6 +33,7 @@ export const ROLE_USER = new Role('user', [
   RIGHTS.COMMUNITY_STATISTICS,
   RIGHTS.CREATE_CONTRIBUTION_MESSAGE,
   RIGHTS.LIST_ALL_CONTRIBUTION_MESSAGES,
+  RIGHTS.OPEN_CREATIONS,
 ])
 export const ROLE_ADMIN = new Role('admin', Object.values(RIGHTS)) // all rights
 

backend/src/graphql/model/OpenCreation.ts

@@ -0,0 +1,14 @@
+import { ObjectType, Field, Int } from 'type-graphql'
+import Decimal from 'decimal.js-light'
+
+@ObjectType()
+export class OpenCreation {
+  @Field(() => Int)
+  month: number
+
+  @Field(() => Int)
+  year: number
+
+  @Field(() => Decimal)
+  amount: Decimal
+}

backend/src/graphql/model/User.ts

@@ -1,13 +1,11 @@
 import { ObjectType, Field } from 'type-graphql'
 import { KlickTipp } from './KlickTipp'
 import { User as dbUser } from '@entity/User'
-import Decimal from 'decimal.js-light'
-import { FULL_CREATION_AVAILABLE } from '../resolver/const/const'
 import { UserContact } from './UserContact'
 
 @ObjectType()
 export class User {
-  constructor(user: dbUser, creation: Decimal[] = FULL_CREATION_AVAILABLE) {
+  constructor(user: dbUser) {
     this.id = user.id
     this.gradidoID = user.gradidoID
     this.alias = user.alias
@@ -26,7 +24,6 @@ export class User {
     this.isAdmin = user.isAdmin
     this.klickTipp = null
     this.hasElopage = null
-    this.creation = creation
     this.hideAmountGDD = user.hideAmountGDD
     this.hideAmountGDT = user.hideAmountGDT
   }
@@ -34,9 +31,6 @@ export class User {
   @Field(() => Number)
   id: number
 
-  // `public_key` binary(32) DEFAULT NULL,
-  // `privkey` binary(80) DEFAULT NULL,
-
   @Field(() => String)
   gradidoID: string
 
@@ -62,9 +56,6 @@ export class User {
   @Field(() => Date, { nullable: true })
   deletedAt: Date | null
 
-  // `password` bigint(20) unsigned DEFAULT 0,
-  // `email_hash` binary(32) DEFAULT NULL,
-
   @Field(() => Date)
   createdAt: Date
 
@@ -84,8 +75,6 @@ export class User {
   @Field(() => Number, { nullable: true })
   publisherId: number | null
 
-  // `passphrase` text COLLATE utf8mb4_unicode_ci DEFAULT NULL,
-
   @Field(() => Date, { nullable: true })
   isAdmin: Date | null
 
@@ -94,7 +83,4 @@ export class User {
 
   @Field(() => Boolean, { nullable: true })
   hasElopage: boolean | null
-
-  @Field(() => [Decimal])
-  creation: Decimal[]
 }

backend/src/graphql/resolver/ContributionResolver.ts

@@ -11,8 +11,9 @@ import { Transaction as DbTransaction } from '@entity/Transaction'
 import { AdminCreateContributions } from '@model/AdminCreateContributions'
 import { AdminUpdateContribution } from '@model/AdminUpdateContribution'
 import { Contribution, ContributionListResult } from '@model/Contribution'
-import { UnconfirmedContribution } from '@model/UnconfirmedContribution'
 import { Decay } from '@model/Decay'
+import { OpenCreation } from '@model/OpenCreation'
+import { UnconfirmedContribution } from '@model/UnconfirmedContribution'
 import { TransactionTypeId } from '@enum/TransactionTypeId'
 import { Order } from '@enum/Order'
 import { ContributionType } from '@enum/ContributionType'
@@ -27,6 +28,7 @@ import { RIGHTS } from '@/auth/RIGHTS'
 import { Context, getUser, getClientTimezoneOffset } from '@/server/context'
 import { backendLogger as logger } from '@/server/logger'
 import {
+  getCreationDates,
   getUserCreation,
   getUserCreations,
   validateContribution,
@@ -691,4 +693,23 @@ export class ContributionResolver {
     )
     // return userTransactions.map((t) => new Transaction(t, new User(user), communityUser))
   }
+
+  @Authorized([RIGHTS.OPEN_CREATIONS])
+  @Query(() => [OpenCreation])
+  async openCreations(
+    @Arg('userId', () => Int, { nullable: true }) userId: number | null,
+    @Ctx() context: Context,
+  ): Promise<OpenCreation[]> {
+    const id = userId || getUser(context).id
+    const clientTimezoneOffset = getClientTimezoneOffset(context)
+    const creationDates = getCreationDates(clientTimezoneOffset)
+    const creations = await getUserCreation(id, clientTimezoneOffset)
+    return creationDates.map((date, index) => {
+      return {
+        month: date.getMonth(),
+        year: date.getFullYear(),
+        amount: creations[index],
+      }
+    })
+  }
 }

backend/src/graphql/resolver/UserResolver.ts

@@ -58,7 +58,7 @@ import {
   EventSendConfirmationEmail,
   EventActivateAccount,
 } from '@/event/Event'
-import { getUserCreation, getUserCreations } from './util/creations'
+import { getUserCreations } from './util/creations'
 import { isValidPassword } from '@/password/EncryptorUtils'
 import { FULL_CREATION_AVAILABLE } from './const/const'
 import { encryptPassword, verifyPassword } from '@/password/PasswordEncryptor'
@@ -114,9 +114,8 @@ export class UserResolver {
   async verifyLogin(@Ctx() context: Context): Promise<User> {
     logger.info('verifyLogin...')
     // TODO refactor and do not have duplicate code with login(see below)
-    const clientTimezoneOffset = getClientTimezoneOffset(context)
     const userEntity = getUser(context)
-    const user = new User(userEntity, await getUserCreation(userEntity.id, clientTimezoneOffset))
+    const user = new User(userEntity)
     // Elopage Status & Stored PublisherId
     user.hasElopage = await this.hasElopage(context)
 
@@ -132,7 +131,6 @@ export class UserResolver {
     @Ctx() context: Context,
   ): Promise<User> {
     logger.info(`login with ${email}, ***, ${publisherId} ...`)
-    const clientTimezoneOffset = getClientTimezoneOffset(context)
     email = email.trim().toLowerCase()
     const dbUser = await findUserByEmail(email)
     if (dbUser.deletedAt) {
@@ -163,7 +161,7 @@ export class UserResolver {
     logger.addContext('user', dbUser.id)
     logger.debug('validation of login credentials successful...')
 
-    const user = new User(dbUser, await getUserCreation(dbUser.id, clientTimezoneOffset))
+    const user = new User(dbUser)
     logger.debug(`user= ${JSON.stringify(user, null, 2)}`)
 
     i18n.setLocale(user.language)

backend/src/graphql/resolver/util/creations.ts

@@ -101,15 +101,19 @@ export const getUserCreation = async (
 }
 
 const getCreationMonths = (timezoneOffset: number): number[] => {
+  return getCreationDates(timezoneOffset).map((date) => date.getMonth() + 1)
+}
+
+export const getCreationDates = (timezoneOffset: number): Date[] => {
   const clientNow = new Date()
   clientNow.setTime(clientNow.getTime() - timezoneOffset * 60 * 1000)
   logger.info(
     `getCreationMonths -- offset: ${timezoneOffset} -- clientNow: ${clientNow.toISOString()}`,
   )
   return [
-    new Date(clientNow.getFullYear(), clientNow.getMonth() - 2, 1).getMonth() + 1,
+    new Date(clientNow.getFullYear(), clientNow.getMonth() - 2, 1),
-    new Date(clientNow.getFullYear(), clientNow.getMonth() - 1, 1).getMonth() + 1,
+    new Date(clientNow.getFullYear(), clientNow.getMonth() - 1, 1),
-    clientNow.getMonth() + 1,
+    clientNow,
   ]
 }
 

deployment/bare_metal/setup.md

@@ -231,3 +231,32 @@ This opens the `crontab` in edit-mode and insert the following entry:
 ```bash
 0 4 * * * find /tmp -name "yarn--*" -ctime +1 -exec rm -r {} \; > /dev/null
 ```
+
+## Define Cronjob To start backup script automatically
+
+At least at production stage we need a daily backup of our database. This can be done by adding a cronjob
+to start the existing backup.sh script.
+
+### On production / stage3 / stage2
+
+To check for existing cronjobs for the `gradido` user, please
+
+Run:
+
+```bash
+crontab -l
+```
+
+This show all existing entries of the crontab for user `gradido`
+
+To install/add the cronjob for a daily backup at 3:00am please 
+
+Run:
+
+```bash
+crontab -e
+```
+and insert the following line
+```bash
+0 3 * * * ~/gradido/deployment/bare_metal/backup.sh
+```

frontend/src/components/Contributions/OpenCreationsAmount.spec.js

@@ -0,0 +1,103 @@
+import { mount } from '@vue/test-utils'
+import OpenCreationsAmount from './OpenCreationsAmount.vue'
+
+const localVue = global.localVue
+
+describe('OpenCreationsAmount', () => {
+  let wrapper
+
+  const mocks = {
+    $t: jest.fn((t) => t),
+    $d: jest.fn((date, formatter = null) => {
+      return { date, formatter }
+    }),
+  }
+
+  const thisMonth = new Date()
+  const lastMonth = new Date(thisMonth.getFullYear(), thisMonth.getMonth() - 1)
+
+  const propsData = {
+    minimalDate: lastMonth,
+    maxGddLastMonth: 400,
+    maxGddThisMonth: 600,
+  }
+
+  const Wrapper = () => {
+    return mount(OpenCreationsAmount, {
+      localVue,
+      mocks,
+      propsData,
+    })
+  }
+
+  describe('mount', () => {
+    beforeEach(() => {
+      jest.clearAllMocks()
+      wrapper = Wrapper()
+    })
+
+    it('renders the component', () => {
+      expect(wrapper.find('div.appBoxShadow').exists()).toBe(true)
+    })
+
+    it('renders two dates', () => {
+      expect(mocks.$d).toBeCalledTimes(2)
+    })
+
+    it('renders the date of last month', () => {
+      expect(mocks.$d).toBeCalledWith(lastMonth, 'monthAndYear')
+    })
+
+    it('renders the date of this month', () => {
+      expect(mocks.$d).toBeCalledWith(expect.any(Date), 'monthAndYear')
+    })
+
+    describe('open creations for both months', () => {
+      it('renders submitted contributions text', () => {
+        expect(mocks.$t).toBeCalledWith('contribution.submit')
+      })
+
+      it('does not render max reached text', () => {
+        expect(mocks.$t).not.toBeCalledWith('maxReached')
+      })
+
+      it('renders submitted hours last month', () => {
+        expect(wrapper.findAll('div.row').at(1).findAll('div.col').at(2).text()).toBe('30 h')
+      })
+
+      it('renders available hours last month', () => {
+        expect(wrapper.findAll('div.row').at(1).findAll('div.col').at(3).text()).toBe('20 h')
+      })
+
+      it('renders submitted hours this month', () => {
+        expect(wrapper.findAll('div.row').at(2).findAll('div.col').at(2).text()).toBe('20 h')
+      })
+
+      it('renders available hours this month', () => {
+        expect(wrapper.findAll('div.row').at(2).findAll('div.col').at(3).text()).toBe('30 h')
+      })
+    })
+
+    describe('no creations available for last month', () => {
+      beforeEach(() => {
+        wrapper.setProps({ maxGddLastMonth: 0 })
+      })
+
+      it('renders submitted contributions text', () => {
+        expect(mocks.$t).toBeCalledWith('contribution.submit')
+      })
+
+      it('renders max reached text', () => {
+        expect(mocks.$t).toBeCalledWith('maxReached')
+      })
+
+      it('renders submitted hours last month', () => {
+        expect(wrapper.findAll('div.row').at(1).findAll('div.col').at(2).text()).toBe('50 h')
+      })
+
+      it('renders available hours last month', () => {
+        expect(wrapper.findAll('div.row').at(1).findAll('div.col').at(3).text()).toBe('0 h')
+      })
+    })
+  })
+})

frontend/src/components/Contributions/OpenCreationsAmount.vue

@@ -14,9 +14,9 @@
           {{ maxGddLastMonth > 0 ? $t('contribution.submit') : $t('maxReached') }}
         </b-col>
         <b-col class="d-none d-md-inline text-197 text-center">
-          {{ (1000 - maxGddLastMonth) / 20 }} {{ $t('h') }}
+          {{ hoursSubmittedLastMonth }} {{ $t('h') }}
         </b-col>
-        <b-col class="text-4 text-center">{{ maxGddLastMonth / 20 }} {{ $t('h') }}</b-col>
+        <b-col class="text-4 text-center">{{ hoursAvailableLastMonth }} {{ $t('h') }}</b-col>
       </b-row>
 
       <b-row class="font-weight-bold">
@@ -25,9 +25,9 @@
           {{ maxGddThisMonth > 0 ? $t('contribution.submit') : $t('maxReached') }}
         </b-col>
         <b-col class="d-none d-md-inline text-197 text-center">
-          {{ (1000 - maxGddThisMonth) / 20 }} {{ $t('h') }}
+          {{ hoursSubmittedThisMonth }} {{ $t('h') }}
         </b-col>
-        <b-col class="text-4 text-center">{{ maxGddThisMonth / 20 }} {{ $t('h') }}</b-col>
+        <b-col class="text-4 text-center">{{ hoursAvailableThisMonth }} {{ $t('h') }}</b-col>
       </b-row>
     </div>
   </div>
@@ -40,5 +40,19 @@ export default {
     maxGddLastMonth: { type: Number, required: true },
     maxGddThisMonth: { type: Number, required: true },
   },
+  computed: {
+    hoursSubmittedThisMonth() {
+      return (1000 - this.maxGddThisMonth) / 20
+    },
+    hoursSubmittedLastMonth() {
+      return (1000 - this.maxGddLastMonth) / 20
+    },
+    hoursAvailableThisMonth() {
+      return this.maxGddThisMonth / 20
+    },
+    hoursAvailableLastMonth() {
+      return this.maxGddLastMonth / 20
+    },
+  },
 }
 </script>

frontend/src/components/GddSend/TransactionForm.vue

@@ -1,112 +1,115 @@
 <template>
-  <b-row class="transaction-form">
+  <div class="transaction-form">
-    <b-col cols="12">
+    <b-row>
-      <b-card class="appBoxShadow gradido-border-radius" body-class="p-3">
+      <b-col cols="12">
-        <validation-observer v-slot="{ handleSubmit }" ref="formValidator">
+        <b-card class="appBoxShadow gradido-border-radius" body-class="p-3">
-          <b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
+          <validation-observer v-slot="{ handleSubmit }" ref="formValidator">
-            <b-form-radio-group v-model="radioSelected" class="container">
+            <b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
-              <b-row class="mb-4">
+              <b-form-radio-group v-model="radioSelected" class="container">
-                <b-col cols="12" lg="6">
+                <b-row class="mb-4">
-                  <b-row class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
+                  <b-col cols="12" lg="6">
-                    <b-col cols="10" @click="radioSelected = sendTypes.send" class="pointer">
+                    <b-row class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
-                      {{ $t('send_gdd') }}
+                      <b-col cols="10" @click="radioSelected = sendTypes.send" class="pointer">
-                    </b-col>
+                        {{ $t('send_gdd') }}
-                    <b-col cols="2">
+                      </b-col>
-                      <b-form-radio
+                      <b-col cols="2">
-                        name="shipping"
+                        <b-form-radio
-                        size="lg"
+                          name="shipping"
-                        :value="sendTypes.send"
+                          size="lg"
-                        stacked
+                          :value="sendTypes.send"
-                        class="custom-radio-button pointer"
+                          stacked
-                      ></b-form-radio>
+                          class="custom-radio-button pointer"
-                    </b-col>
+                        ></b-form-radio>
-                  </b-row>
+                      </b-col>
-                </b-col>
+                    </b-row>
+                  </b-col>
+                  <b-col>
+                    <b-row class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
+                      <b-col cols="10" @click="radioSelected = sendTypes.link" class="pointer">
+                        {{ $t('send_per_link') }}
+                      </b-col>
+                      <b-col cols="2" class="pointer">
+                        <b-form-radio
+                          name="shipping"
+                          :value="sendTypes.link"
+                          size="lg"
+                          class="custom-radio-button"
+                        ></b-form-radio>
+                      </b-col>
+                    </b-row>
+                  </b-col>
+                </b-row>
+
+                <div class="mt-4 mb-4" v-if="radioSelected === sendTypes.link">
+                  <h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
+                  <div>
+                    {{ $t('gdd_per_link.choose-amount') }}
+                  </div>
+                </div>
+              </b-form-radio-group>
+              <b-row>
                 <b-col>
-                  <b-row class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
+                  <b-row>
-                    <b-col cols="10" @click="radioSelected = sendTypes.link" class="pointer">
+                    <b-col cols="12">
-                      {{ $t('send_per_link') }}
+                      <div v-if="radioSelected === sendTypes.send">
+                        <input-email
+                          :name="$t('form.recipient')"
+                          :label="$t('form.recipient')"
+                          :placeholder="$t('form.email')"
+                          v-model="form.email"
+                          :disabled="isBalanceDisabled"
+                          @onValidation="onValidation"
+                        />
+                      </div>
                     </b-col>
-                    <b-col cols="2" class="pointer">
+                    <b-col cols="12" lg="6">
-                      <b-form-radio
+                      <input-amount
-                        name="shipping"
+                        v-model="form.amount"
-                        :value="sendTypes.link"
+                        :name="$t('form.amount')"
-                        size="lg"
+                        :label="$t('form.amount')"
-                        class="custom-radio-button"
+                        :placeholder="'0.01'"
-                      ></b-form-radio>
+                        :rules="{ required: true, gddSendAmount: [0.01, balance] }"
+                        typ="TransactionForm"
+                        :disabled="isBalanceDisabled"
+                      ></input-amount>
                     </b-col>
                   </b-row>
                 </b-col>
               </b-row>
 
-              <div class="mt-4 mb-4" v-if="radioSelected === sendTypes.link">
+              <b-row>
-                <h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
+                <b-col>
-                <div>
+                  <input-textarea
-                  {{ $t('gdd_per_link.choose-amount') }}
+                    v-model="form.memo"
-                </div>
+                    :name="$t('form.message')"
+                    :label="$t('form.message')"
+                    :placeholder="$t('form.message')"
+                    :rules="{ required: true, min: 5, max: 255 }"
+                    :disabled="isBalanceDisabled"
+                  />
+                </b-col>
+              </b-row>
+              <div v-if="!!isBalanceDisabled" class="text-danger mt-5">
+                {{ $t('form.no_gdd_available') }}
               </div>
-            </b-form-radio-group>
+              <b-row v-else class="test-buttons mt-5">
-            <b-row>
+                <b-col>
-              <b-col>
+                  <b-button type="reset" variant="secondary" @click="onReset">
-                <b-row>
+                    {{ $t('form.reset') }}
-                  <b-col cols="12">
+                  </b-button>
-                    <div v-if="radioSelected === sendTypes.send">
+                </b-col>
-                      <input-email
+                <b-col class="text-right">
-                        :name="$t('form.recipient')"
+                  <b-button type="submit" variant="gradido">
-                        :label="$t('form.recipient')"
+                    {{ $t('form.check_now') }}
-                        :placeholder="$t('form.email')"
+                  </b-button>
-                        v-model="form.email"
+                </b-col>
-                        :disabled="isBalanceDisabled"
+              </b-row>
-                      />
+            </b-form>
-                    </div>
+          </validation-observer>
-                  </b-col>
+        </b-card>
-                  <b-col cols="12" lg="6">
+      </b-col>
-                    <input-amount
+    </b-row>
-                      v-model="form.amount"
+  </div>
-                      :name="$t('form.amount')"
-                      :label="$t('form.amount')"
-                      :placeholder="'0.01'"
-                      :rules="{ required: true, gddSendAmount: [0.01, balance] }"
-                      typ="TransactionForm"
-                      :disabled="isBalanceDisabled"
-                    ></input-amount>
-                  </b-col>
-                </b-row>
-              </b-col>
-            </b-row>
-
-            <b-row>
-              <b-col>
-                <input-textarea
-                  v-model="form.memo"
-                  :name="$t('form.message')"
-                  :label="$t('form.message')"
-                  :placeholder="$t('form.message')"
-                  :rules="{ required: true, min: 5, max: 255 }"
-                  :disabled="isBalanceDisabled"
-                />
-              </b-col>
-            </b-row>
-            <div v-if="!!isBalanceDisabled" class="text-danger mt-5">
-              {{ $t('form.no_gdd_available') }}
-            </div>
-            <b-row v-else class="test-buttons mt-5">
-              <b-col>
-                <b-button type="reset" variant="secondary" @click="onReset">
-                  {{ $t('form.reset') }}
-                </b-button>
-              </b-col>
-              <b-col class="text-right">
-                <b-button type="submit" variant="gradido">
-                  {{ $t('form.check_now') }}
-                </b-button>
-              </b-col>
-            </b-row>
-          </b-form>
-        </validation-observer>
-      </b-card>
-    </b-col>
-  </b-row>
 </template>
 <script>
 import { SEND_TYPES } from '@/pages/Send.vue'
@@ -140,6 +143,9 @@ export default {
     }
   },
   methods: {
+    onValidation() {
+      this.$refs.formValidator.validate()
+    },
     onSubmit() {
       this.$emit('set-transaction', {
         selected: this.radioSelected,
@@ -153,6 +159,7 @@ export default {
       this.form.email = ''
       this.form.amount = ''
       this.form.memo = ''
+      this.$refs.formValidator.validate()
     },
     setNewRecipientEmail() {
       this.form.email = this.recipientEmail ? this.recipientEmail : this.form.email
@@ -177,6 +184,9 @@ export default {
   created() {
     this.setNewRecipientEmail()
   },
+  mounted() {
+    if (this.form.email !== '') this.$refs.formValidator.validate()
+  },
 }
 </script>
 <style>

frontend/src/components/GddSend/TransactionResultSendError.vue

@@ -19,7 +19,7 @@
       <div v-else>{{ errorResult }}</div>
     </div>
     <p class="text-center mt-5">
-      <b-button variant="secondary" @click="$emit('on-reset')">
+      <b-button variant="secondary" @click="$emit('on-back')">
         {{ $t('form.close') }}
       </b-button>
     </p>

frontend/src/components/Inputs/InputAmount.vue

@@ -22,6 +22,7 @@
           @focus="amountFocused = true"
           @blur="normalizeAmount(true)"
           :disabled="disabled"
+          autocomplete="off"
         ></b-form-input>
 
         <b-form-invalid-feedback v-bind="ariaMsg">
@@ -63,7 +64,7 @@ export default {
   },
   data() {
     return {
-      currentValue: '',
+      currentValue: this.value,
       amountValue: 0.0,
       amountFocused: false,
     }

frontend/src/components/Inputs/InputEmail.vue

@@ -21,6 +21,7 @@
         @focus="emailFocused = true"
         @blur="normalizeEmail()"
         :disabled="disabled"
+        autocomplete="off"
       ></b-form-input>
       <b-form-invalid-feedback v-bind="ariaMsg">
         {{ errors[0] }}
@@ -62,7 +63,10 @@ export default {
       this.$emit('input', this.currentValue)
     },
     value() {
-      if (this.value !== this.currentValue) this.currentValue = this.value
+      if (this.value !== this.currentValue) {
+        this.currentValue = this.value
+      }
+      this.$emit('onValidation')
     },
   },
   methods: {

frontend/src/components/Inputs/InputTextarea.spec.js

@@ -58,7 +58,7 @@ describe('InputTextarea', () => {
       })
 
       it('has the value ""', () => {
-        expect(wrapper.vm.currentValue).toEqual('')
+        expect(wrapper.vm.currentValue).toEqual('Long enough')
       })
 
       it('has the label "input-field-label"', () => {
@@ -72,9 +72,8 @@ describe('InputTextarea', () => {
 
     describe('input value changes', () => {
       it('emits input with new value', async () => {
-        await wrapper.find('textarea').setValue('Long enough')
+        await wrapper.find('textarea').setValue('New Text')
-        expect(wrapper.emitted('input')).toBeTruthy()
+        expect(wrapper.emitted('input')).toEqual([['New Text']])
-        expect(wrapper.emitted('input')).toEqual([['Long enough']])
       })
     })
 

frontend/src/components/Inputs/InputTextarea.vue

@@ -41,7 +41,7 @@ export default {
   },
   data() {
     return {
-      currentValue: '',
+      currentValue: this.value,
     }
   },
   computed: {

frontend/src/components/Menu/Sidebar.vue

@@ -19,7 +19,7 @@
             <b-icon icon="layers" aria-hidden="true"></b-icon>
             <span class="ml-2">{{ $t('gdt.gdt') }}</span>
           </b-nav-item>
-          <b-nav-item to="/community#my" class="" active-class="activeRoute">
+          <b-nav-item to="/community" class="" active-class="activeRoute">
             <b-icon icon="people" aria-hidden="true"></b-icon>
             <span class="ml-2">{{ $t('creation') }}</span>
           </b-nav-item>

frontend/src/components/Template/ContentHeader/NavCommunity.vue

@@ -1,20 +1,20 @@
 <template>
-  <div class="nav-community">
+  <div class="nav-community container">
     <b-row class="nav-row">
-      <b-col cols="12" lg="4" md="4">
+      <b-col cols="12" lg="4" md="4" class="px-0">
-        <b-btn active-class="btn-active" block variant="link" to="#edit">
+        <b-btn active-class="btn-active" block variant="link" to="/community#edit">
           <b-icon icon="pencil" class="mr-2" />
           {{ $t('community.submitContribution') }}
         </b-btn>
       </b-col>
-      <b-col cols="12" lg="4" md="4">
+      <b-col cols="12" lg="4" md="4" class="px-0">
-        <b-btn active-class="btn-active" block variant="link" to="#my">
+        <b-btn active-class="btn-active" block variant="link" to="/community#my">
           <b-icon icon="person" class="mr-2" />
           {{ $t('community.myContributions') }}
         </b-btn>
       </b-col>
-      <b-col cols="12" lg="4" md="4">
+      <b-col cols="12" lg="4" md="4" class="px-0">
-        <b-btn active-class="btn-active" block variant="link" to="#all">
+        <b-btn active-class="btn-active" block variant="link" to="/community#all">
           <b-icon icon="people" class="mr-2" />
           {{ $t('community.community') }}
         </b-btn>

frontend/src/components/Template/RightSide/LastTransactions.vue

@@ -24,7 +24,7 @@
               :size="72"
               :color="'#fff'"
               :username="`${transaction.linkedUser.firstName} ${transaction.linkedUser.lastName}`"
-              :initials="`${transaction.linkedUser.firstName[0]} ${transaction.linkedUser.lastName[0]}`"
+              :initials="`${transaction.linkedUser.firstName[0]}${transaction.linkedUser.lastName[0]}`"
             ></avatar>
           </div>
         </b-col>

frontend/src/graphql/mutations.js

@@ -154,7 +154,6 @@ export const login = gql`
       hasElopage
       publisherId
       isAdmin
-      creation
       hideAmountGDD
       hideAmountGDT
     }

frontend/src/graphql/queries.js

@@ -250,3 +250,13 @@ export const listContributionMessages = gql`
     }
   }
 `
+
+export const openCreations = gql`
+  query {
+    openCreations {
+      year
+      month
+      amount
+    }
+  }
+`

frontend/src/pages/Community.spec.js

@@ -2,33 +2,14 @@ import { mount } from '@vue/test-utils'
 import Community from './Community'
 import { toastErrorSpy, toastSuccessSpy } from '@test/testSetup'
 import { createContribution, updateContribution, deleteContribution } from '@/graphql/mutations'
-import { listContributions, listAllContributions, verifyLogin } from '@/graphql/queries'
+import { listContributions, listAllContributions } from '@/graphql/queries'
-
-import VueRouter from 'vue-router'
-import routes from '../routes/routes'
 
 const localVue = global.localVue
-localVue.use(VueRouter)
 
 const mockStoreDispach = jest.fn()
 const apolloQueryMock = jest.fn()
 const apolloMutationMock = jest.fn()
-
+const apolloRefetchMock = jest.fn()
-const router = new VueRouter({
-  base: '/',
-  routes,
-  linkActiveClass: 'active',
-  mode: 'history',
-  // scrollBehavior: (to, from, savedPosition) => {
-  //   if (savedPosition) {
-  //     return savedPosition
-  //   }
-  //   if (to.hash) {
-  //     return { selector: to.hash }
-  //   }
-  //   return { x: 0, y: 0 }
-  // },
-})
 
 describe('Community', () => {
   let wrapper
@@ -39,6 +20,11 @@ describe('Community', () => {
     $apollo: {
       query: apolloQueryMock,
       mutate: apolloMutationMock,
+      queries: {
+        OpenCreations: {
+          refetch: apolloRefetchMock,
+        },
+      },
     },
     $store: {
       dispatch: mockStoreDispach,
@@ -49,12 +35,17 @@ describe('Community', () => {
     $i18n: {
       locale: 'en',
     },
+    $router: {
+      push: jest.fn(),
+    },
+    $route: {
+      hash: 'my',
+    },
   }
 
   const Wrapper = () => {
     return mount(Community, {
       localVue,
-      router,
       mocks,
     })
   }
@@ -207,10 +198,7 @@ describe('Community', () => {
         })
 
         it('verifies the login (to get the new creations available)', () => {
-          expect(apolloQueryMock).toBeCalledWith({
+          expect(apolloRefetchMock).toBeCalled()
-            query: verifyLogin,
-            fetchPolicy: 'network-only',
-          })
         })
 
         it('set all data to the default values)', () => {
@@ -294,10 +282,7 @@ describe('Community', () => {
         })
 
         it('verifies the login (to get the new creations available)', () => {
-          expect(apolloQueryMock).toBeCalledWith({
+          expect(apolloRefetchMock).toBeCalled()
-            query: verifyLogin,
-            fetchPolicy: 'network-only',
-          })
         })
 
         it('set all data to the default values)', () => {
@@ -376,10 +361,7 @@ describe('Community', () => {
         })
 
         it('verifies the login (to get the new creations available)', () => {
-          expect(apolloQueryMock).toBeCalledWith({
+          expect(apolloRefetchMock).toBeCalled()
-            query: verifyLogin,
-            fetchPolicy: 'network-only',
-          })
         })
       })
 

frontend/src/pages/Community.vue

@@ -5,8 +5,8 @@
         <b-tab no-body>
           <open-creations-amount
             :minimalDate="minimalDate"
-            :maxGddThisMonth="maxGddThisMonth"
+            :maxGddLastMonth="maxForMonths[0]"
-            :maxGddLastMonth="maxGddLastMonth"
+            :maxGddThisMonth="maxForMonths[1]"
           />
           <div class="mb-3"></div>
           <contribution-form
@@ -15,8 +15,8 @@
             v-model="form"
             :isThisMonth="isThisMonth"
             :minimalDate="minimalDate"
-            :maxGddLastMonth="maxGddLastMonth"
+            :maxGddLastMonth="maxForMonths[0]"
-            :maxGddThisMonth="maxGddThisMonth"
+            :maxGddThisMonth="maxForMonths[1]"
           />
         </b-tab>
         <b-tab no-body>
@@ -52,7 +52,7 @@ import OpenCreationsAmount from '@/components/Contributions/OpenCreationsAmount.
 import ContributionForm from '@/components/Contributions/ContributionForm.vue'
 import ContributionList from '@/components/Contributions/ContributionList.vue'
 import { createContribution, updateContribution, deleteContribution } from '@/graphql/mutations'
-import { listContributions, listAllContributions, verifyLogin } from '@/graphql/queries'
+import { listContributions, listAllContributions, openCreations } from '@/graphql/queries'
 
 export default {
   name: 'Community',
@@ -82,6 +82,7 @@ export default {
       },
       updateAmount: '',
       maximalDate: new Date(),
+      openCreations: [],
     }
   },
   mounted() {
@@ -90,6 +91,23 @@ export default {
       this.hashLink = this.$route.hash
     })
   },
+  apollo: {
+    OpenCreations: {
+      query() {
+        return openCreations
+      },
+      fetchPolicy: 'network-only',
+      variables() {
+        return {}
+      },
+      update({ openCreations }) {
+        this.openCreations = openCreations
+      },
+      error({ message }) {
+        this.toastError(message)
+      },
+    },
+  },
   watch: {
     $route(to, from) {
       this.tabIndex = this.tabLinkHashes.findIndex((hashLink) => hashLink === to.hash)
@@ -120,17 +138,20 @@ export default {
         formDate.getMonth() === this.maximalDate.getMonth()
       )
     },
-    maxGddLastMonth() {
+    amountToAdd() {
       // when existing contribution is edited, the amount is added back on top of the amount
-      return this.form.id && !this.isThisMonth
+      if (this.form.id) return parseInt(this.updateAmount)
-        ? parseInt(this.$store.state.creation[1]) + parseInt(this.updateAmount)
+      return 0
-        : parseInt(this.$store.state.creation[1])
     },
-    maxGddThisMonth() {
+    maxForMonths() {
-      // when existing contribution is edited, the amount is added back on top of the amount
+      const formDate = new Date(this.form.date)
-      return this.form.id && this.isThisMonth
+      if (this.openCreations && this.openCreations.length)
-        ? parseInt(this.$store.state.creation[2]) + parseInt(this.updateAmount)
+        return this.openCreations.slice(1).map((creation) => {
-        : parseInt(this.$store.state.creation[2])
+          if (creation.year === formDate.getFullYear() && creation.month === formDate.getMonth())
+            return parseInt(creation.amount) + this.amountToAdd
+          return parseInt(creation.amount)
+        })
+      return [0, 0]
     },
   },
   methods: {
@@ -160,7 +181,7 @@ export default {
             currentPage: this.currentPage,
             pageSize: this.pageSize,
           })
-          this.verifyLogin()
+          this.$apollo.queries.OpenCreations.refetch()
         })
         .catch((err) => {
           this.toastError(err.message)
@@ -188,7 +209,7 @@ export default {
             currentPage: this.currentPage,
             pageSize: this.pageSize,
           })
-          this.verifyLogin()
+          this.$apollo.queries.OpenCreations.refetch()
         })
         .catch((err) => {
           this.toastError(err.message)
@@ -213,7 +234,7 @@ export default {
             currentPage: this.currentPage,
             pageSize: this.pageSize,
           })
-          this.verifyLogin()
+          this.$apollo.queries.OpenCreations.refetch()
         })
         .catch((err) => {
           this.toastError(err.message)
@@ -259,7 +280,7 @@ export default {
           if (this.items.find((item) => item.state === 'IN_PROGRESS')) {
             this.tabIndex = 1
             if (this.$route.hash !== '#my') {
-              this.$router.push({ path: '#my' })
+              this.$router.push({ path: '/community#my' })
             }
             this.toastInfo('Du hast eine Rückfrage auf eine Contribution. Bitte beantworte diese!')
           }
@@ -268,22 +289,6 @@ export default {
           this.toastError(err.message)
         })
     },
-    verifyLogin() {
-      this.$apollo
-        .query({
-          query: verifyLogin,
-          fetchPolicy: 'network-only',
-        })
-        .then((result) => {
-          const {
-            data: { verifyLogin },
-          } = result
-          this.$store.dispatch('login', verifyLogin)
-        })
-        .catch(() => {
-          this.$emit('logout')
-        })
-    },
     updateContributionForm(item) {
       this.form.id = item.id
       this.form.date = item.contributionDate
@@ -303,8 +308,6 @@ export default {
   },
 
   created() {
-    // verifyLogin is important at this point so that creation is updated on reload if they are deleted in a session in the admin area.
-    this.verifyLogin()
     this.updateListContributions({
       currentPage: this.currentPage,
       pageSize: this.pageSize,
@@ -315,6 +318,7 @@ export default {
     })
     this.updateTransactions(0)
     this.tabIndex = 1
+    this.$router.push({ path: '/community#my' })
   },
 }
 </script>

frontend/src/pages/Send.spec.js

@@ -13,7 +13,7 @@ const navigatorClipboardMock = jest.fn()
 
 const localVue = global.localVue
 
-describe.skip('Send', () => {
+describe('Send', () => {
   let wrapper
 
   const propsData = {

frontend/src/store/store.js

@@ -47,9 +47,6 @@ export const mutations = {
   hasElopage: (state, hasElopage) => {
     state.hasElopage = hasElopage
   },
-  creation: (state, creation) => {
-    state.creation = creation
-  },
   hideAmountGDD: (state, hideAmountGDD) => {
     state.hideAmountGDD = !!hideAmountGDD
   },
@@ -69,7 +66,6 @@ export const actions = {
     commit('hasElopage', data.hasElopage)
     commit('publisherId', data.publisherId)
     commit('isAdmin', data.isAdmin)
-    commit('creation', data.creation)
     commit('hideAmountGDD', data.hideAmountGDD)
     commit('hideAmountGDT', data.hideAmountGDT)
   },
@@ -83,7 +79,6 @@ export const actions = {
     commit('hasElopage', false)
     commit('publisherId', null)
     commit('isAdmin', false)
-    commit('creation', null)
     commit('hideAmountGDD', false)
     commit('hideAmountGDT', true)
     localStorage.clear()
@@ -111,7 +106,6 @@ try {
       newsletterState: null,
       hasElopage: false,
       publisherId: null,
-      creation: null,
       hideAmountGDD: null,
       hideAmountGDT: null,
     },

frontend/src/store/store.test.js

@@ -30,7 +30,6 @@ const {
   publisherId,
   isAdmin,
   hasElopage,
-  creation,
   hideAmountGDD,
   hideAmountGDT,
 } = mutations
@@ -143,14 +142,6 @@ describe('Vuex store', () => {
       })
     })
 
-    describe('creation', () => {
-      it('sets the state of creation', () => {
-        const state = { creation: null }
-        creation(state, true)
-        expect(state.creation).toEqual(true)
-      })
-    })
-
     describe('hideAmountGDD', () => {
       it('sets the state of hideAmountGDD', () => {
         const state = { hideAmountGDD: false }
@@ -183,14 +174,13 @@ describe('Vuex store', () => {
         hasElopage: false,
         publisherId: 1234,
         isAdmin: true,
-        creation: ['1000', '1000', '1000'],
         hideAmountGDD: false,
         hideAmountGDT: true,
       }
 
       it('calls eleven commits', () => {
         login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenCalledTimes(11)
+        expect(commit).toHaveBeenCalledTimes(10)
       })
 
       it('commits email', () => {
@@ -233,19 +223,14 @@ describe('Vuex store', () => {
         expect(commit).toHaveBeenNthCalledWith(8, 'isAdmin', true)
       })
 
-      it('commits creation', () => {
-        login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(9, 'creation', ['1000', '1000', '1000'])
-      })
-
       it('commits hideAmountGDD', () => {
         login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(10, 'hideAmountGDD', false)
+        expect(commit).toHaveBeenNthCalledWith(9, 'hideAmountGDD', false)
       })
 
       it('commits hideAmountGDT', () => {
         login({ commit, state }, commitedData)
-        expect(commit).toHaveBeenNthCalledWith(11, 'hideAmountGDT', true)
+        expect(commit).toHaveBeenNthCalledWith(10, 'hideAmountGDT', true)
       })
     })
 
@@ -255,7 +240,7 @@ describe('Vuex store', () => {
 
       it('calls eleven commits', () => {
         logout({ commit, state })
-        expect(commit).toHaveBeenCalledTimes(11)
+        expect(commit).toHaveBeenCalledTimes(10)
       })
 
       it('commits token', () => {
@@ -298,19 +283,14 @@ describe('Vuex store', () => {
         expect(commit).toHaveBeenNthCalledWith(8, 'isAdmin', false)
       })
 
-      it('commits creation', () => {
-        logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(9, 'creation', null)
-      })
-
       it('commits hideAmountGDD', () => {
         logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(10, 'hideAmountGDD', false)
+        expect(commit).toHaveBeenNthCalledWith(9, 'hideAmountGDD', false)
       })
 
       it('commits hideAmountGDT', () => {
         logout({ commit, state })
-        expect(commit).toHaveBeenNthCalledWith(11, 'hideAmountGDT', true)
+        expect(commit).toHaveBeenNthCalledWith(10, 'hideAmountGDT', true)
       })
       // how to get this working?
       it.skip('calls localStorage.clear()', () => {