From 6cb9cb24ff74ae673d78f2dab99e357ee1747649 Mon Sep 17 00:00:00 2001
From: i-trytoohard <ayetrytoohard@gmail.com>
Date: Mon, 13 Apr 2026 11:20:25 +0530
Subject: [PATCH] fix(web): hyperlink CI check chips to GitHub workflow runs in
 session detail (#1196)

---
 packages/web/src/components/SessionDetail.tsx | 45 ++++++++++++-------
 1 file changed, 30 insertions(+), 15 deletions(-)

diff --git a/packages/web/src/components/SessionDetail.tsx b/packages/web/src/components/SessionDetail.tsx
index b9e7be44b..0c2280e11 100644
--- a/packages/web/src/components/SessionDetail.tsx
+++ b/packages/web/src/components/SessionDetail.tsx
@@ -864,21 +864,36 @@ function SessionDetailPRCard({ pr, sessionId, metadata }: { pr: DashboardPR; ses
         {pr.ciChecks.length > 0 && (
           <>
             <div className="session-detail-pr-sep" />
-            {pr.ciChecks.map((check) => (
-              <span
-                key={check.name}
-                className={cn(
-                  "session-detail-ci-chip",
-                  check.status === "passed" && "session-detail-ci-chip--pass",
-                  check.status === "failed" && "session-detail-ci-chip--fail",
-                  check.status === "pending" && "session-detail-ci-chip--pending",
-                  check.status !== "passed" && check.status !== "failed" && check.status !== "pending" && "session-detail-ci-chip--queued",
-                )}
-              >
-                {check.status === "passed" ? "\u2713" : check.status === "failed" ? "\u2717" : check.status === "pending" ? "\u25CF" : "\u25CB"}{" "}
-                {check.name}
-              </span>
-            ))}
+            {pr.ciChecks.map((check) => {
+              const chip = (
+                <span
+                  className={cn(
+                    "session-detail-ci-chip",
+                    check.status === "passed" && "session-detail-ci-chip--pass",
+                    check.status === "failed" && "session-detail-ci-chip--fail",
+                    check.status === "pending" && "session-detail-ci-chip--pending",
+                    check.status !== "passed" && check.status !== "failed" && check.status !== "pending" && "session-detail-ci-chip--queued",
+                  )}
+                >
+                  {check.status === "passed" ? "\u2713" : check.status === "failed" ? "\u2717" : check.status === "pending" ? "\u25CF" : "\u25CB"}{" "}
+                  {check.name}
+                </span>
+              );
+              return check.url ? (
+                <a
+                  key={check.name}
+                  href={check.url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="hover:no-underline"
+                  onClick={(e) => e.stopPropagation()}
+                >
+                  {chip}
+                </a>
+              ) : (
+                <span key={check.name}>{chip}</span>
+              );
+            })}
           </>
         )}
       </div>