From 7ce8dc34807f6b08a6b5be9271ed5af80c1a2faa Mon Sep 17 00:00:00 2001
From: prateek <karnalprateek@gmail.com>
Date: Sun, 15 Feb 2026 13:36:16 +0530
Subject: [PATCH] fix: remove redundant attention level badge from session
 detail (#41)

* fix: remove redundant attention level badge from session detail page

The detail page was showing both activity ("Idle") and attention level
("Working") as badges, which looked contradictory. Attention level is
for the dashboard overview zones, not the detail page. Keep only the
activity badge.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

* fix: terminal button should link to session detail page, not raw xterm URL

The terminal button was fetching from the terminal-web plugin and opening
a raw xterm.js URL (localhost:7801). Changed to a simple link to the
session detail page which has an embedded terminal.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 packages/web/src/components/SessionCard.tsx   | 19 ++------
 packages/web/src/components/SessionDetail.tsx | 46 -------------------
 2 files changed, 5 insertions(+), 60 deletions(-)

diff --git a/packages/web/src/components/SessionCard.tsx b/packages/web/src/components/SessionCard.tsx
index 113852218..940de3ec4 100644
--- a/packages/web/src/components/SessionCard.tsx
+++ b/packages/web/src/components/SessionCard.tsx
@@ -105,22 +105,13 @@ export function SessionCard({ session, onSend, onKill, onMerge, onRestore }: Ses
           </button>
         )}
         {!isTerminal && (
-          <button
-            onClick={(e) => {
-              e.stopPropagation();
-              const port = process.env.NEXT_PUBLIC_TERMINAL_PORT ?? "3001";
-              fetch(`http://localhost:${port}/terminal?session=${encodeURIComponent(session.id)}`)
-                .then((res) => res.json() as Promise<{ url: string }>)
-                .then((data) => window.open(data.url, `terminal-${session.id}`))
-                .catch(() => {
-                  // Fall back to session detail page
-                  window.location.href = `/sessions/${encodeURIComponent(session.id)}`;
-                });
-            }}
-            className="shrink-0 rounded-md border border-[var(--color-border-default)] px-2.5 py-0.5 text-[11px] text-[var(--color-text-secondary)] transition-colors hover:border-[var(--color-accent-blue)] hover:text-[var(--color-accent-blue)]"
+          <a
+            href={`/sessions/${encodeURIComponent(session.id)}`}
+            onClick={(e) => e.stopPropagation()}
+            className="shrink-0 rounded-md border border-[var(--color-border-default)] px-2.5 py-0.5 text-[11px] text-[var(--color-text-secondary)] transition-colors hover:border-[var(--color-accent-blue)] hover:text-[var(--color-accent-blue)] hover:no-underline"
           >
             terminal
-          </button>
+          </a>
         )}
       </div>
 
diff --git a/packages/web/src/components/SessionDetail.tsx b/packages/web/src/components/SessionDetail.tsx
index 9fb568152..37d9276b8 100644
--- a/packages/web/src/components/SessionDetail.tsx
+++ b/packages/web/src/components/SessionDetail.tsx
@@ -4,7 +4,6 @@ import { useState, useEffect } from "react";
 import {
   type DashboardSession,
   type DashboardPR,
-  getAttentionLevel,
 } from "@/lib/types";
 import { CICheckList } from "./CIBadge";
 import { Terminal } from "./Terminal";
@@ -23,23 +22,6 @@ const activityLabel: Record<string, { label: string; color: string }> = {
   exited: { label: "Exited", color: "var(--color-accent-red)" },
 };
 
-function levelColor(level: string): string {
-  switch (level) {
-    case "merge":
-      return "var(--color-accent-green)";
-    case "respond":
-      return "var(--color-accent-red)";
-    case "review":
-      return "var(--color-accent-orange)";
-    case "pending":
-      return "var(--color-accent-yellow)";
-    case "working":
-      return "var(--color-accent-blue)";
-    default:
-      return "var(--color-text-muted)";
-  }
-}
-
 /** Converts snake_case status enum to Title Case display string. */
 function humanizeStatus(status: string): string {
   return status
@@ -49,24 +31,6 @@ function humanizeStatus(status: string): string {
     .replace(/\b\w/g, (c) => c.toUpperCase());
 }
 
-/** Converts attention level to human-readable label. */
-function humanizeLevel(level: string): string {
-  switch (level) {
-    case "merge":
-      return "Ready to Merge";
-    case "respond":
-      return "Needs Response";
-    case "review":
-      return "Needs Investigation";
-    case "pending":
-      return "Pending";
-    case "working":
-      return "Working";
-    default:
-      return level;
-  }
-}
-
 /** Converts ISO date string to relative time like "3h ago", "2m ago". Client-side only. */
 function relativeTime(iso: string): string {
   const diff = Date.now() - new Date(iso).getTime();
@@ -142,7 +106,6 @@ async function askAgentToFix(
 
 export function SessionDetail({ session }: SessionDetailProps) {
   const pr = session.pr;
-  const level = getAttentionLevel(session);
   const activity = activityLabel[session.activity] ?? {
     label: session.activity,
     color: "var(--color-text-muted)",
@@ -177,15 +140,6 @@ export function SessionDetail({ session }: SessionDetailProps) {
             >
               {activity.label}
             </span>
-            <span
-              className="rounded-full px-2 py-0.5 text-xs font-semibold"
-              style={{
-                color: levelColor(level),
-                background: `color-mix(in srgb, ${levelColor(level)} 10%, transparent)`,
-              }}
-            >
-              {humanizeLevel(level)}
-            </span>
           </div>
 
           {/* Summary */}