fix(front-end): add more security fixes for formatted lists and notifier

- introduce html escape function
- escape message content in notifier plugin
- escape user name in ConversationListItem
- escape user name in the Event EditView contacts section
- display user summary as plain text in ActorCard

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

src/components/Account/ActorCard.vue

@@ -30,7 +30,7 @@
         <span dir="ltr">@{{ usernameWithDomain(actor) }}</span>
       </p>
       <div
-        v-if="full"
+        v-if="full && actor.type === ActorType.GROUP"
         class="only-first-child"
         :class="{
           'line-clamp-3': limit,
@@ -38,6 +38,15 @@
         }"
         v-html="actor.summary"
       />
+      <div
+        v-if="full && actor.type === ActorType.PERSON"
+        class="only-first-child"
+        :class="{
+          'line-clamp-3': limit,
+          'line-clamp-10': !limit,
+        }"
+        v-text="actor.summary"
+      />
     </div>
     <div class="flex pr-2" v-if="actor.type === ActorType.PERSON">
       <router-link

src/components/Conversations/ConversationListItem.vue

@@ -96,6 +96,7 @@ import { useI18n } from "vue-i18n";
 import { formatList } from "@/utils/i18n";
 import { displayName } from "@/types/actor";
 import { useCurrentActorClient } from "@/composition/apollo/actor";
+import { escapeHtml } from "@/utils/html";
 
 const props = defineProps<{
   conversation: IConversation;
@@ -137,7 +138,7 @@ const actualDate = computed((): string => {
 const formattedListOfParticipants = computed(() => {
   return formatList(
     otherParticipants.value.map(
-      (participant) => `<b>${displayName(participant)}</b>`
+      (participant) => `<b>${escapeHtml(displayName(participant))}</b>`
     )
   );
 });