From c1d75c5bcf1af50b98e1465da2ef4284cc3cade6 Mon Sep 17 00:00:00 2001
From: mvdbeek <m.vandenbeek@gmail.com>
Date: Tue, 20 Jan 2026 12:15:46 +0100
Subject: [PATCH] Open links from invocation card in center panel

---
 .../Notifications/NotificationCard.vue        | 30 +++++++++++++++++--
 1 file changed, 28 insertions(+), 2 deletions(-)

diff --git a/client/src/components/Notifications/NotificationCard.vue b/client/src/components/Notifications/NotificationCard.vue
index f88c1a6ddb4..8746d844792 100644
--- a/client/src/components/Notifications/NotificationCard.vue
+++ b/client/src/components/Notifications/NotificationCard.vue
@@ -12,6 +12,7 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BLink } from "bootstrap-vue";
 import { formatDistanceToNow, parseISO } from "date-fns";
 import { computed } from "vue";
+import { useRouter } from "vue-router/composables";
 
 import type { UserNotification } from "@/api/notifications";
 import type { CardAction } from "@/components/Common/GCard.types";
@@ -32,8 +33,30 @@ const props = defineProps<{
 const emit = defineEmits(["select"]);
 
 const notificationsStore = useNotificationsStore();
+const router = useRouter();
 
-const { renderMarkdown } = useMarkdown({ openLinksInNewPage: true });
+const { renderMarkdown } = useMarkdown({ openLinksInNewPage: false });
+
+function handleMessageClick(event: MouseEvent) {
+    const target = event.target as HTMLElement;
+    const anchor = target.closest("a");
+
+    if (anchor) {
+        const href = anchor.getAttribute("href");
+        if (href) {
+            // Check if this is an internal link (same origin or relative path)
+            try {
+                const url = new URL(href, window.location.origin);
+                if (url.origin === window.location.origin) {
+                    event.preventDefault();
+                    router.push(url.pathname + url.search + url.hash);
+                }
+            } catch {
+                // If URL parsing fails, let the browser handle it
+            }
+        }
+    }
+}
 
 const title = computed(() => {
     if (props.notification.category === "new_shared_item") {
@@ -154,7 +177,10 @@ function markNotificationAsSeen() {
                 >{{ " " }}<span> with you.</span>
             </template>
             <template v-else>
-                <span class="notification-message" v-html="renderMarkdown(props.notification.content.message)" />
+                <span
+                    class="notification-message"
+                    @click="handleMessageClick"
+                    v-html="renderMarkdown(props.notification.content.message)" />
             </template>
         </template>
     </GCard>