Merge branch 'master' into fix_email_texts

admin/src/components/ContributionMessages/ParseMessage.vue

@@ -1,7 +1,15 @@
 <template>
   <div class="mt-2">
-    <span v-for="({ type, text }, index) in linkifiedMessage" :key="index">
+    <span v-for="({ type, text }, index) in parsedMessage" :key="index">
       <b-link v-if="type === 'link'" :href="text" target="_blank">{{ text }}</b-link>
+      <span v-else-if="type === 'date'">
+        {{ $d(new Date(text), 'short') }}
+        <br />
+      </span>
+      <span v-else-if="type === 'amount'">
+        <br />
+        {{ `${$n(Number(text), 'decimal')} GDD` }}
+      </span>
       <span v-else>{{ text }}</span>
     </span>
   </div>
@@ -12,17 +20,28 @@ const LINK_REGEX_PATTERN =
   /(https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*))/i
 
 export default {
-  name: 'LinkifyMessage',
+  name: 'ParseMessage',
   props: {
     message: {
       type: String,
       required: true,
     },
+    type: {
+      type: String,
+      reuired: true,
+    },
   },
   computed: {
-    linkifiedMessage() {
-      const linkified = []
+    parsedMessage() {
       let string = this.message
+      const linkified = []
+      let amount
+      if (this.type === 'HISTORY') {
+        const split = string.split(/\n\s*---\n\s*/)
+        string = split[1]
+        linkified.push({ type: 'date', text: split[0].trim() })
+        amount = split[2].trim()
+      }
       let match
       while ((match = string.match(LINK_REGEX_PATTERN))) {
         if (match.index > 0)
@@ -31,6 +50,7 @@ export default {
         string = string.substring(match.index + match[0].length)
       }
       if (string.length > 0) linkified.push({ type: 'text', text: string })
+      if (amount) linkified.push({ type: 'amount', text: amount })
       return linkified
     },
   },

admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.spec.js

@@ -3,12 +3,16 @@ import ContributionMessagesListItem from './ContributionMessagesListItem.vue'
 
 const localVue = global.localVue
 
+const dateMock = jest.fn((d) => d)
+const numberMock = jest.fn((n) => n)
+
 describe('ContributionMessagesListItem', () => {
   let wrapper
 
   const mocks = {
     $t: jest.fn((t) => t),
-    $d: jest.fn((d) => d),
+    $d: dateMock,
+    $n: numberMock,
   }
 
   describe('if message author has moderator role', () => {
@@ -189,4 +193,64 @@ and here is the link to the repository: https://github.com/gradido/gradido`)
       })
     })
   })
+
+  describe('contribution message type HISTORY', () => {
+    const propsData = {
+      message: {
+        id: 111,
+        message: `Sun Nov 13 2022 13:05:48 GMT+0100 (Central European Standard Time)
+---
+This message also contains a link: https://gradido.net/de/
+---
+350.00`,
+        createdAt: '2022-08-29T12:23:27.000Z',
+        updatedAt: null,
+        type: 'HISTORY',
+        userFirstName: 'Peter',
+        userLastName: 'Lustig',
+        userId: 107,
+        __typename: 'ContributionMessage',
+      },
+    }
+
+    const itemWrapper = () => {
+      return mount(ContributionMessagesListItem, {
+        localVue,
+        mocks,
+        propsData,
+      })
+    }
+
+    let messageField
+
+    describe('render HISTORY message', () => {
+      beforeEach(() => {
+        jest.clearAllMocks()
+        wrapper = itemWrapper()
+        messageField = wrapper.find('div.is-not-moderator.text-left > div:nth-child(4)')
+      })
+
+      it('renders the date', () => {
+        expect(dateMock).toBeCalledWith(
+          new Date('Sun Nov 13 2022 13:05:48 GMT+0100 (Central European Standard Time'),
+          'short',
+        )
+      })
+
+      it('renders the amount', () => {
+        expect(numberMock).toBeCalledWith(350, 'decimal')
+        expect(messageField.text()).toContain('350 GDD')
+      })
+
+      it('contains the link as text', () => {
+        expect(messageField.text()).toContain(
+          'This message also contains a link: https://gradido.net/de/',
+        )
+      })
+
+      it('contains a link to the given address', () => {
+        expect(messageField.find('a').attributes('href')).toBe('https://gradido.net/de/')
+      })
+    })
+  })
 })

admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.vue

@@ -5,23 +5,23 @@
       <span class="ml-2 mr-2">{{ message.userFirstName }} {{ message.userLastName }}</span>
       <span class="ml-2">{{ $d(new Date(message.createdAt), 'short') }}</span>
       <small class="ml-4 text-success">{{ $t('moderator') }}</small>
-      <linkify-message :message="message.message"></linkify-message>
+      <parse-message v-bind="message"></parse-message>
     </div>
     <div v-else class="text-left is-not-moderator">
       <b-avatar variant="info"></b-avatar>
       <span class="ml-2 mr-2">{{ message.userFirstName }} {{ message.userLastName }}</span>
       <span class="ml-2">{{ $d(new Date(message.createdAt), 'short') }}</span>
-      <linkify-message :message="message.message"></linkify-message>
+      <parse-message v-bind="message"></parse-message>
     </div>
   </div>
 </template>
 <script>
-import LinkifyMessage from '@/components/ContributionMessages/LinkifyMessage.vue'
+import ParseMessage from '@/components/ContributionMessages/ParseMessage.vue'
 
 export default {
   name: 'ContributionMessagesListItem',
   components: {
-    LinkifyMessage,
+    ParseMessage,
   },
   props: {
     message: {

frontend/src/components/ContributionMessages/ContributionMessagesListItem.spec.js

@@ -5,9 +5,11 @@ import ContributionMessagesListItem from './ContributionMessagesListItem.vue'
 const localVue = global.localVue
 let wrapper
 
+const dateMock = jest.fn((d) => d)
+
 const mocks = {
   $t: jest.fn((t) => t),
-  $d: jest.fn((d) => d),
+  $d: dateMock,
   $store: {
     state: {
       firstName: 'Peter',
@@ -239,4 +241,63 @@ and here is the link to the repository: https://github.com/gradido/gradido`)
       })
     })
   })
+
+  describe('contribution message type HISTORY', () => {
+    const propsData = {
+      message: {
+        id: 111,
+        message: `Sun Nov 13 2022 13:05:48 GMT+0100 (Central European Standard Time)
+---
+This message also contains a link: https://gradido.net/de/
+---
+350.00`,
+        createdAt: '2022-08-29T12:23:27.000Z',
+        updatedAt: null,
+        type: 'HISTORY',
+        userFirstName: 'Peter',
+        userLastName: 'Lustig',
+        userId: 107,
+        __typename: 'ContributionMessage',
+      },
+    }
+
+    const itemWrapper = () => {
+      return mount(ContributionMessagesListItem, {
+        localVue,
+        mocks,
+        propsData,
+      })
+    }
+
+    let messageField
+
+    describe('render HISTORY message', () => {
+      beforeEach(() => {
+        jest.clearAllMocks()
+        wrapper = itemWrapper()
+        messageField = wrapper.find('div.is-not-moderator.text-right > div:nth-child(4)')
+      })
+
+      it('renders the date', () => {
+        expect(dateMock).toBeCalledWith(
+          new Date('Sun Nov 13 2022 13:05:48 GMT+0100 (Central European Standard Time'),
+          'short',
+        )
+      })
+
+      it('renders the amount', () => {
+        expect(messageField.text()).toContain('350.00 GDD')
+      })
+
+      it('contains the link as text', () => {
+        expect(messageField.text()).toContain(
+          'This message also contains a link: https://gradido.net/de/',
+        )
+      })
+
+      it('contains a link to the given address', () => {
+        expect(messageField.find('a').attributes('href')).toBe('https://gradido.net/de/')
+      })
+    })
+  })
 })

frontend/src/components/ContributionMessages/ContributionMessagesListItem.vue

@@ -4,25 +4,25 @@
       <b-avatar variant="info"></b-avatar>
       <span class="ml-2 mr-2">{{ message.userFirstName }} {{ message.userLastName }}</span>
       <span class="ml-2">{{ $d(new Date(message.createdAt), 'short') }}</span>
-      <linkify-message :message="message.message"></linkify-message>
+      <parse-message v-bind="message"></parse-message>
     </div>
     <div v-else class="is-moderator text-left">
       <b-avatar square variant="warning"></b-avatar>
       <span class="ml-2 mr-2">{{ message.userFirstName }} {{ message.userLastName }}</span>
       <span class="ml-2">{{ $d(new Date(message.createdAt), 'short') }}</span>
       <small class="ml-4 text-success">{{ $t('community.moderator') }}</small>
-      <linkify-message :message="message.message"></linkify-message>
+      <parse-message v-bind="message"></parse-message>
     </div>
   </div>
 </template>
 
 <script>
-import LinkifyMessage from '@/components/ContributionMessages/LinkifyMessage.vue'
+import ParseMessage from '@/components/ContributionMessages/ParseMessage.vue'
 
 export default {
   name: 'ContributionMessagesListItem',
   components: {
-    LinkifyMessage,
+    ParseMessage,
   },
   props: {
     message: {

frontend/src/components/ContributionMessages/ParseMessage.vue

@@ -1,7 +1,15 @@
 <template>
   <div class="mt-2">
-    <span v-for="({ type, text }, index) in linkifiedMessage" :key="index">
+    <span v-for="({ type, text }, index) in parsedMessage" :key="index">
       <b-link v-if="type === 'link'" :href="text" target="_blank">{{ text }}</b-link>
+      <span v-else-if="type === 'date'">
+        {{ $d(new Date(text), 'short') }}
+        <br />
+      </span>
+      <span v-else-if="type === 'amount'">
+        <br />
+        {{ text | GDD }}
+      </span>
       <span v-else>{{ text }}</span>
     </span>
   </div>
@@ -11,17 +19,28 @@
 const LINK_REGEX_PATTERN = /(https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*))/i
 
 export default {
-  name: 'LinkifyMessage',
+  name: 'ParseMessage',
   props: {
     message: {
       type: String,
       required: true,
     },
+    type: {
+      type: String,
+      reuired: true,
+    },
   },
   computed: {
-    linkifiedMessage() {
-      const linkified = []
+    parsedMessage() {
       let string = this.message
+      const linkified = []
+      let amount
+      if (this.type === 'HISTORY') {
+        const split = string.split(/\n\s*---\n\s*/)
+        string = split[1]
+        linkified.push({ type: 'date', text: split[0].trim() })
+        amount = split[2].trim()
+      }
       let match
       while ((match = string.match(LINK_REGEX_PATTERN))) {
         if (match.index > 0)
@@ -30,6 +49,7 @@ export default {
         string = string.substring(match.index + match[0].length)
       }
       if (string.length > 0) linkified.push({ type: 'text', text: string })
+      if (amount) linkified.push({ type: 'amount', text: amount })
       return linkified
     },
   },