Name the window Interaction

packages/agent-chat/src/ranch-shell/InteractionPanel.tsx

@@ -5,6 +5,7 @@ import type { HopPhase, LiveHop } from "../liveHops";
 import { colors } from "./styles";
 
 export type InteractionCopy = {
+  view: string;
   empty: string;
   waiting: string;
   returned: string;
@@ -87,16 +88,26 @@ export function InteractionPanel({
   const pos = layout(ids);
   const selected = hops.find((hop) => hop.key === selectedKey) ?? null;
 
+  const viewLabel = (
+    <p data-interaction-view="" style={{ margin: "12px 16px 0", color: colors.muted, fontSize: 12 }}>
+      {copy.view}
+    </p>
+  );
+
   if (!hops.length) {
     return (
-      <p data-interaction-empty="" style={{ margin: 16, color: colors.muted, fontSize: 13 }}>
-        {copy.empty}
-      </p>
+      <div data-interaction-panel="" style={{ display: "flex", flexDirection: "column", minHeight: 0, flex: 1 }}>
+        {viewLabel}
+        <p data-interaction-empty="" style={{ margin: 16, color: colors.muted, fontSize: 13 }}>
+          {copy.empty}
+        </p>
+      </div>
     );
   }
 
   return (
     <div data-interaction-panel="" style={{ display: "flex", flexDirection: "column", minHeight: 0, flex: 1 }}>
+      {viewLabel}
       <svg viewBox="0 0 640 300" style={{ width: "100%", height: "auto", flex: "1 1 auto" }}>
         {hops.map((hop, index) => {
           const from = pos[hop.fromId];

packages/agent-chat/src/ranch-shell/RanchChatShell.tsx

@@ -5750,6 +5750,7 @@ export function RanchChatShell(props: RanchChatShellProps) {
             names={agentNames}
             memberIds={active?.agent_id ? [active.agent_id, ...Object.keys(agentNames)] : Object.keys(agentNames)}
             copy={{
+              view: t.interactionView,
               empty: t.interactionEmpty,
               waiting: t.interactionWaiting,
               returned: t.interactionReturned,

packages/agent-chat/src/ranch-shell/WorkDock.tsx

@@ -116,7 +116,7 @@ export function WorkDock({
                 type="button"
                 role="tab"
                 aria-selected={selected}
-                title={tab.title}
+                title={tab.kind === "interaction" ? addInteractionLabel : tab.title}
                 onClick={() => onSelect(tab.id)}
                 style={{
                   border: 0,
@@ -131,7 +131,7 @@ export function WorkDock({
                   cursor: "pointer",
                 }}
               >
-                {tab.title}
+                {tab.kind === "interaction" ? addInteractionLabel : tab.title}
               </button>
               <button
                 type="button"

packages/agent-chat/src/ranch-shell/i18n.ts

@@ -268,8 +268,9 @@ export type RanchMessages = {
   sendConfirm: string;
   /** Open the chat Canvas beside the conversation. */
   manuscript: string;
-  /** Live agent-to-agent calls in this chat. */
+  /** Right-hand window for agent interaction. The current view is the collaboration graph. */
   interaction: string;
+  interactionView: string;
   interactionEmpty: string;
   interactionWaiting: string;
   interactionReturned: string;
@@ -984,8 +985,9 @@ const en: RanchMessages = {
   screenConfirm: "Open computer screen bills {rate} credits per hour.",
   sendConfirm: "Sending starts this computer at {rate} credits per hour. Unused prepaid is returned.",
   manuscript: "Canvas",
-  interaction: "Calls",
-  interactionEmpty: "No agent calls in this chat yet.",
+  interaction: "Interaction",
+  interactionView: "Graph",
+  interactionEmpty: "No agent interactions in this chat yet.",
   interactionWaiting: "Waiting",
   interactionReturned: "Returned",
   interactionFailed: "Failed",
@@ -1749,6 +1751,7 @@ const zh: RanchMessages = {
   sendConfirm: "发送后电脑按 {rate} 星币/小时计费。不用的预扣会退回。",
   manuscript: "Canvas",
   interaction: "交互",
+  interactionView: "协作图",
   interactionEmpty: "这场还没有智能体互调。",
   interactionWaiting: "还在等",
   interactionReturned: "已返回",