From 8a23eaef1edf5fa1c8bce1678292dd335cdc21f4 Mon Sep 17 00:00:00 2001
From: "gcp-cherry-pick-bot[bot]"
 <98988430+gcp-cherry-pick-bot[bot]@users.noreply.github.com>
Date: Fri, 21 Feb 2025 19:21:40 +0100
Subject: [PATCH] web/user: fix RAC launch not opening when clicking icon
 (cherry-pick #13164) (#13166)

web/user: fix RAC launch not opening when clicking icon (#13164)

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
Co-authored-by: Jens L. <jens@goauthentik.io>
---
 web/src/user/LibraryApplication/index.ts | 51 +++++++++++++++---------
 1 file changed, 32 insertions(+), 19 deletions(-)

diff --git a/web/src/user/LibraryApplication/index.ts b/web/src/user/LibraryApplication/index.ts
index ad445d6742..5b529a7f18 100644
--- a/web/src/user/LibraryApplication/index.ts
+++ b/web/src/user/LibraryApplication/index.ts
@@ -99,6 +99,19 @@ export class LibraryApplication extends AKElement {
         if (this.application?.launchUrl === "goauthentik.io://providers/rac/launch") {
             return html`<ak-library-rac-endpoint-launch .app=${this.application}>
                 </ak-library-rac-endpoint-launch>
+                <div class="pf-c-card__header">
+                    <a
+                        @click=${() => {
+                            this.racEndpointLaunch?.onClick();
+                        }}
+                    >
+                        <ak-app-icon
+                            size=${PFSize.Large}
+                            name=${this.application.name}
+                            icon=${ifDefined(this.application.metaIcon || undefined)}
+                        ></ak-app-icon>
+                    </a>
+                </div>
                 <div class="pf-c-card__title">
                     <a
                         @click=${() => {
@@ -109,13 +122,25 @@ export class LibraryApplication extends AKElement {
                     </a>
                 </div>`;
         }
-        return html`<div class="pf-c-card__title">
-            <a
-                href="${ifDefined(this.application.launchUrl ?? "")}"
-                target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
-                >${this.application.name}</a
-            >
-        </div>`;
+        return html`<div class="pf-c-card__header">
+                <a
+                    href="${ifDefined(this.application.launchUrl ?? "")}"
+                    target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
+                >
+                    <ak-app-icon
+                        size=${PFSize.Large}
+                        name=${this.application.name}
+                        icon=${ifDefined(this.application.metaIcon || undefined)}
+                    ></ak-app-icon>
+                </a>
+            </div>
+            <div class="pf-c-card__title">
+                <a
+                    href="${ifDefined(this.application.launchUrl ?? "")}"
+                    target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
+                    >${this.application.name}</a
+                >
+            </div>`;
     }
 
     render(): TemplateResult {
@@ -135,18 +160,6 @@ export class LibraryApplication extends AKElement {
             class="pf-c-card pf-m-hoverable pf-m-compact ${classMap(classes)}"
             style=${styleMap(styles)}
         >
-            <div class="pf-c-card__header">
-                <a
-                    href="${ifDefined(this.application.launchUrl ?? "")}"
-                    target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
-                >
-                    <ak-app-icon
-                        size=${PFSize.Large}
-                        name=${this.application.name}
-                        icon=${ifDefined(this.application.metaIcon || undefined)}
-                    ></ak-app-icon>
-                </a>
-            </div>
             ${this.renderLaunch()}
             <div class="expander"></div>
             ${expandable ? this.renderExpansion(this.application) : nothing}