From a7ad4e5a8b544d340608f6077b94ab82d7ae7e89 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9B=B7=E7=94=B5=E8=8A=BD=E8=A1=A3?=
 <zhangyanghaha0407@outlook.com>
Date: Thu, 16 Apr 2026 23:11:25 -0400
Subject: [PATCH] polish: composite breadcrumb keys; pause run-log polling when
 tab hidden (P3-58, P3-59)

---
 src/renderer/components/runs/RunCenter.tsx     | 6 ++++--
 src/renderer/components/skills/SkillDetail.tsx | 2 +-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/runs/RunCenter.tsx b/src/renderer/components/runs/RunCenter.tsx
index e5c28362..86018f53 100644
--- a/src/renderer/components/runs/RunCenter.tsx
+++ b/src/renderer/components/runs/RunCenter.tsx
@@ -149,7 +149,8 @@ export function RunCenter({
   useEffect(() => {
     if (!selectedRun || !isActiveStatus(selectedRun.status)) return;
     let cancelled = false;
-    const intervalId = window.setInterval(async () => {
+    const tick = async () => {
+      if (document.visibilityState === "hidden") return;
       const latest = await window.agentCompany.getRunLogChunk({
         companyId: selectedRun.companyId,
         runId: selectedRun.id,
@@ -166,7 +167,8 @@ export function RunCenter({
         loading: false,
         error: null,
       });
-    }, 2500);
+    };
+    const intervalId = window.setInterval(tick, 2500);
 
     return () => {
       cancelled = true;
diff --git a/src/renderer/components/skills/SkillDetail.tsx b/src/renderer/components/skills/SkillDetail.tsx
index 35f83290..a6197b6f 100644
--- a/src/renderer/components/skills/SkillDetail.tsx
+++ b/src/renderer/components/skills/SkillDetail.tsx
@@ -259,7 +259,7 @@ export function SkillDetail({
             {/* File path bar */}
             <div className="mb-3 flex items-center gap-1 text-[12px] text-muted-foreground">
               {selectedSkillFilePath.split("/").map((segment, i, arr) => (
-                <span key={i} className="flex items-center gap-1">
+                <span key={`${segment}-${i}`} className="flex items-center gap-1">
                   {i > 0 ? <span className="opacity-40">/</span> : null}
                   <span className={i === arr.length - 1 ? "font-medium text-foreground" : ""}>
                     {segment}