From e3dc4adc3f7b4122bc93d279ed92da79b23dcb3c Mon Sep 17 00:00:00 2001
From: asemabdallah <asasem547@gmail.com>
Date: Sun, 27 Sep 2026 07:58:50 +0300
Subject: [PATCH] fix: make the computer button label match its status

---
 apps/mobile/src/computer-status.ts       |  4 ++++
 apps/mobile/src/computer.tsx             |  9 ++++-----
 apps/mobile/test/computer-status.test.ts | 10 ++++++++++
 3 files changed, 18 insertions(+), 5 deletions(-)
 create mode 100644 apps/mobile/src/computer-status.ts
 create mode 100644 apps/mobile/test/computer-status.test.ts

diff --git a/apps/mobile/src/computer-status.ts b/apps/mobile/src/computer-status.ts
new file mode 100644
index 000000000..4d39a7e68
--- /dev/null
+++ b/apps/mobile/src/computer-status.ts
@@ -0,0 +1,4 @@
+/** The agent computer's status, shown in the header and read out by its button label. */
+export function computerStatus(available: boolean, activeSessions: number) {
+  return !available ? "offline" : activeSessions > 0 ? "take control" : "ready";
+}
diff --git a/apps/mobile/src/computer.tsx b/apps/mobile/src/computer.tsx
index faf64941f..ce85840a9 100644
--- a/apps/mobile/src/computer.tsx
+++ b/apps/mobile/src/computer.tsx
@@ -12,6 +12,7 @@ import { AppState, Image, Pressable, Text, View } from "react-native";
 import type { BrowserSession } from "../../../packages/domain/src";
 import { browserAddress } from "./browser-address";
 import { useComputerDraft } from "./computer-drafts";
+import { computerStatus } from "./computer-status";
 import { LinuxWorkspace } from "./computer-workspace";
 import { Button, Card, colors, ErrorNotice, Field, LinkRow, Sheet, s } from "./ui";
 import { useWorkspace } from "./workspace";
@@ -22,10 +23,11 @@ export function ComputerEntry() {
     (c) => c.id === "browser" && c.status === "connected",
   );
   const active = workspace.browsers.filter((b) => b.status === "active").length;
+  const status = computerStatus(available, active);
   return (
     <Pressable
       accessibilityRole="button"
-      accessibilityLabel="Agent computer — take control"
+      accessibilityLabel={`Agent computer — ${status}`}
       onPress={() => open({ type: "computer" })}
       style={[
         s.row,
@@ -40,10 +42,7 @@ export function ComputerEntry() {
       ]}
     >
       <Monitor size={13} color={colors.muted} />
-      <Text style={{ fontSize: 12, color: colors.muted }}>
-        Computer
-        {!available ? " · offline" : active ? " · take control" : " · ready"}
-      </Text>
+      <Text style={{ fontSize: 12, color: colors.muted }}>Computer · {status}</Text>
       <View
         style={{
           width: 5,
diff --git a/apps/mobile/test/computer-status.test.ts b/apps/mobile/test/computer-status.test.ts
new file mode 100644
index 000000000..c217c6083
--- /dev/null
+++ b/apps/mobile/test/computer-status.test.ts
@@ -0,0 +1,10 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { computerStatus } from "../src/computer-status.ts";
+
+test("the computer status says offline before anything else", () => {
+  assert.equal(computerStatus(false, 0), "offline");
+  assert.equal(computerStatus(false, 2), "offline");
+  assert.equal(computerStatus(true, 0), "ready");
+  assert.equal(computerStatus(true, 1), "take control");
+});