From da7ac58a22f3e7937864b1b52945a85487014945 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Tue, 25 Oct 2022 02:49:56 +0200
Subject: [PATCH] computed for linkified message object in linkify message
 component

---
 .../ContributionMessages/LinkifyMessage.vue   | 22 +++++++++++++++++--
 .../slots/ContributionMessagesListItem.vue    | 22 ++-----------------
 2 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/admin/src/components/ContributionMessages/LinkifyMessage.vue b/admin/src/components/ContributionMessages/LinkifyMessage.vue
index cea0a30a1..3e66b8bf3 100644
--- a/admin/src/components/ContributionMessages/LinkifyMessage.vue
+++ b/admin/src/components/ContributionMessages/LinkifyMessage.vue
@@ -8,13 +8,31 @@
 </template>
 
 <script>
+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',
   props: {
-    linkifiedMessage: {
-      type: Array,
+    message: {
+      type: String,
       required: true,
     },
   },
+  computed: {
+    linkifiedMessage() {
+      const linkified = []
+      let string = this.message
+      let match
+      while ((match = string.match(LINK_REGEX_PATTERN))) {
+        if (match.index > 0)
+          linkified.push({ type: 'text', text: string.substring(0, match.index) })
+        linkified.push({ type: 'link', text: match[0] })
+        string = string.substring(match.index + match[0].length)
+      }
+      if (string.length > 0) linkified.push({ type: 'text', text: string })
+      return linkified
+    },
+  },
 }
 </script>
diff --git a/admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.vue b/admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.vue
index 55b01c592..30960bd33 100644
--- a/admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.vue
+++ b/admin/src/components/ContributionMessages/slots/ContributionMessagesListItem.vue
@@ -5,22 +5,19 @@
       <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 :linkifiedMessage="linkifiedMessage"></linkify-message>
+      <linkify-message :message="message.message"></linkify-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 :linkifiedMessage="linkifiedMessage"></linkify-message>
+      <linkify-message :message="message.message"></linkify-message>
     </div>
   </div>
 </template>
 <script>
 import LinkifyMessage from '@/components/ContributionMessages/LinkifyMessage.vue'
 
-const LINK_PATTERN =
-  /(https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*))/i
-
 export default {
   name: 'ContributionMessagesListItem',
   components: {
@@ -32,21 +29,6 @@ export default {
       required: true,
     },
   },
-  computed: {
-    linkifiedMessage() {
-      const linkified = []
-      let string = this.message.message
-      let match
-      while ((match = string.match(LINK_PATTERN))) {
-        if (match.index > 0)
-          linkified.push({ type: 'text', text: string.substring(0, match.index) })
-        linkified.push({ type: 'link', text: match[0] })
-        string = string.substring(match.index + match[0].length)
-      }
-      if (string.length > 0) linkified.push({ type: 'text', text: string })
-      return linkified
-    },
-  },
 }
 </script>
 <style>