From b51b221f9c076a74b4c9f49c90a335aa97643a41 Mon Sep 17 00:00:00 2001
From: aporss <art.porss@yahooinc.com>
Date: Fri, 6 Sep 2024 17:06:58 +0100
Subject: [PATCH] open role and group members in new tab

Signed-off-by: aporss <art.porss@yahooinc.com>
---
 ui/src/components/group/GroupRow.js | 11 ++++++++++-
 ui/src/components/role/RoleRow.js   | 11 ++++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/group/GroupRow.js b/ui/src/components/group/GroupRow.js
index 5f6b090eebe..3ef9b411380 100644
--- a/ui/src/components/group/GroupRow.js
+++ b/ui/src/components/group/GroupRow.js
@@ -101,6 +101,15 @@ class GroupRow extends React.Component {
         this.props.router.push(route, route);
     }
 
+    // opens new tab on cmd + click or ctrl + click
+    onClickNewTabFunction(route, args) {
+        if(args.metaKey || args.ctrlKey) {
+            args.view.open(args.view.origin + route, '_blank', 'noopener,norefferer');
+        } else {
+            this.props.router.push(route, route);
+        }
+    }
+
     onSubmitDelete() {
         let groupName = this.state.deleteName;
         if (
@@ -154,7 +163,7 @@ class GroupRow extends React.Component {
         let color = this.props.color;
         let idx = this.props.idx;
 
-        let clickMembers = this.onClickFunction.bind(
+        let clickMembers = this.onClickNewTabFunction.bind(
             this,
             `/domain/${this.props.domain}/group/${this.state.name}/members`
         );
diff --git a/ui/src/components/role/RoleRow.js b/ui/src/components/role/RoleRow.js
index a14b9f2dd28..3683cf689d4 100644
--- a/ui/src/components/role/RoleRow.js
+++ b/ui/src/components/role/RoleRow.js
@@ -122,6 +122,15 @@ class RoleRow extends React.Component {
         this.props.router.push(route, route);
     }
 
+    // opens new tab on cmd + click or ctrl + click
+    onClickNewTabFunction(route, args) {
+        if(args.metaKey || args.ctrlKey) {
+            args.view.open(args.view.origin + route, '_blank', 'noopener,norefferer');
+        } else {
+            this.props.router.push(route, route);
+        }
+    }
+
     onSubmitDelete(domain) {
         let roleName = this.state.deleteName;
         if (
@@ -173,7 +182,7 @@ class RoleRow extends React.Component {
         let color = this.props.color;
         let idx = this.props.idx;
 
-        let clickMembers = this.onClickFunction.bind(
+        let clickMembers = this.onClickNewTabFunction.bind(
             this,
             `/domain/${this.props.domain}/role/${this.state.name}/members`
         );