From 66b8b53defe887fe04568b758b3775866c92a509 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jovan=20Kruni=C4=87?= <krunic@rz.uni-frankfurt.de>
Date: Wed, 23 Sep 2026 16:45:49 +0200
Subject: [PATCH] refactor: open external links without javascript in browser

Close #246
---
 .../data/elements/external-link.component.ts  | 33 ++++++++++++++++---
 .../modules/data/elements/external-link.html  |  5 ++-
 2 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/frontend/app/src/app/modules/data/elements/external-link.component.ts b/frontend/app/src/app/modules/data/elements/external-link.component.ts
index 7e463ed6..49f42653 100644
--- a/frontend/app/src/app/modules/data/elements/external-link.component.ts
+++ b/frontend/app/src/app/modules/data/elements/external-link.component.ts
@@ -14,7 +14,8 @@
  */
 
 import {Component, Input} from '@angular/core';
-import {SimpleBrowser} from '../../../util/browser.factory';
+import {Browser} from '@capacitor/browser';
+import {Capacitor} from '@capacitor/core';
 
 @Component({
   selector: 'stapps-external-link',
@@ -26,10 +27,32 @@ export class ExternalLinkComponent {
 
   @Input() text: string;
 
-  constructor(private browser: SimpleBrowser) {}
+  get url(): string {
+    try {
+      return new URL(this.link).href;
+    } catch {
+      return '';
+    }
+  }
 
-  onLinkClick(url: string) {
-    // make sure if the url is valid and then open it in the browser (prevent problem in iOS)
-    this.browser.open(new URL(url).href);
+  onLinkClick(event: MouseEvent) {
+    if (!this.url) {
+      event.preventDefault();
+      return;
+    }
+
+    // In a normal browser we deliberately do nothing here.
+    // The regular <a> element handles the navigation.
+    if (!Capacitor.isNativePlatform()) {
+      return;
+    }
+
+    // In the native iOS/Android app we prevent the WebView navigation
+    // and open the URL in the system-provided in-app browser instead.
+    event.preventDefault();
+
+    void Browser.open({
+      url: this.url,
+    });
   }
 }
diff --git a/frontend/app/src/app/modules/data/elements/external-link.html b/frontend/app/src/app/modules/data/elements/external-link.html
index c4abb899..52ec6224 100644
--- a/frontend/app/src/app/modules/data/elements/external-link.html
+++ b/frontend/app/src/app/modules/data/elements/external-link.html
@@ -12,4 +12,7 @@
   ~ You should have received a copy of the GNU General Public License along with
   ~ this program. If not, see <https://www.gnu.org/licenses/>.
   -->
-<a (click)="onLinkClick(link)">{{ text }}<ion-icon name="open_in_browser"></ion-icon> </a>
+<a [href]="url" target="_blank" (click)="onLinkClick($event)">
+  {{ text }}
+  <ion-icon name="open_in_browser"></ion-icon>
+</a>