From 207b8a07ebeecfffc0e5b7980f76211b345120fe Mon Sep 17 00:00:00 2001
From: Jan Ackermann <jan.alexander.ackermann@outlook.com>
Date: Wed, 2 Oct 2024 11:12:39 +0200
Subject: [PATCH] Escape html in ActivitiesPanel and Notificiation

---
 ...ape-html-characters-in-activities-and-notification-view | 7 +++++++
 .../src/components/SideBar/ActivitiesPanel.vue             | 5 ++++-
 .../web-runtime/src/components/Topbar/Notifications.vue    | 3 ++-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 changelog/unreleased/bugfix-escape-html-characters-in-activities-and-notification-view

diff --git a/changelog/unreleased/bugfix-escape-html-characters-in-activities-and-notification-view b/changelog/unreleased/bugfix-escape-html-characters-in-activities-and-notification-view
new file mode 100644
index 00000000000..ae25acd381d
--- /dev/null
+++ b/changelog/unreleased/bugfix-escape-html-characters-in-activities-and-notification-view
@@ -0,0 +1,7 @@
+Bugfix: Escape HTML characters in activities and notification view
+
+We've fixed a bug where HTML characters were not escaped in the activities and notification view.
+This could lead to potential XSS attacks.
+
+https://github.com/owncloud/web/pull/11706
+https://github.com/owncloud/web/issues/11705
diff --git a/packages/web-app-files/src/components/SideBar/ActivitiesPanel.vue b/packages/web-app-files/src/components/SideBar/ActivitiesPanel.vue
index 1d58f00f027..ba180c406cb 100644
--- a/packages/web-app-files/src/components/SideBar/ActivitiesPanel.vue
+++ b/packages/web-app-files/src/components/SideBar/ActivitiesPanel.vue
@@ -42,6 +42,7 @@ import { useTask } from 'vue-concurrency'
 import { call, Resource } from '@ownclouders/web-client'
 import { DateTime } from 'luxon'
 import { Activity } from '@ownclouders/web-client/graph/generated'
+import escape from 'lodash-es/escape'
 
 const visibilityObserver = new VisibilityObserver()
 export default defineComponent({
@@ -82,7 +83,9 @@ export default defineComponent({
     const getHtmlFromActivity = (activity: Activity) => {
       let message = activity.template.message
       for (const [key, value] of Object.entries(activity.template.variables)) {
-        message = message.replace(`{${key}}`, `<strong>${value.displayName || value.name}</strong>`)
+        const escapedValue = escape(value.displayName || value.name)
+
+        message = message.replace(`{${key}}`, `<strong>${escapedValue}</strong>`)
       }
       return message
     }
diff --git a/packages/web-runtime/src/components/Topbar/Notifications.vue b/packages/web-runtime/src/components/Topbar/Notifications.vue
index b13d7357123..7b61b29320e 100644
--- a/packages/web-runtime/src/components/Topbar/Notifications.vue
+++ b/packages/web-runtime/src/components/Topbar/Notifications.vue
@@ -75,6 +75,7 @@
 <script lang="ts">
 import { computed, onMounted, onUnmounted, ref, unref } from 'vue'
 import isEmpty from 'lodash-es/isEmpty'
+import escape from 'lodash-es/escape'
 import {
   useCapabilityStore,
   useSpacesStore,
@@ -138,7 +139,7 @@ export default {
             }
             interpolatedMessage = interpolatedMessage.replace(
               `{${param.name}}`,
-              `<strong>${label}</strong>`
+              `<strong>${escape(label)}</strong>`
             )
           }
         }