authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-07-07 09:12:52-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-07-07 09:12:52-07:00
log4eb1b5793340f8a197f9f995aa396c9a306dbabf
treefe9ad21545a77d30b53c062bdfb0b28fac32334f
parent4414f922fe4c83b819f9c1585a85d42f7b295ef6
signature Signed by PGP key B5690EEEBB952194

Lead with the outcome when no agents are active in the Live Activity (#3768)

2 files changed, 85 insertions(+), 8 deletions(-)

apps/mobile/src/widgets/AgentActivity.test.ts+64
...@@ -199,6 +199,70 @@ describe("AgentActivity widget layout", () => {...@@ -199,6 +199,70 @@ describe("AgentActivity widget layout", () => {
199 ).not.toContain("widgetURL");199 ).not.toContain("widgetURL");
200 });200 });
201201
202 it("leads with the outcome instead of a zero count when nothing is active", () => {
203 const layout = AgentActivity(
204 {
205 ...props,
206 subtitle: "Agent work completed",
207 activeCount: 0,
208 activities: [makeRow({ phase: "completed", status: "Done" })],
209 },
210 environment as never,
211 );
212 const banner = JSON.stringify(layout.banner);
213 expect(banner).toContain("Agent work completed");
214 expect(banner).not.toContain("0 active");
215 expect(banner).toContain("#6ee7b7"); // emerald-300 header tint
216 expect(JSON.stringify(layout.compactTrailing)).toContain("Done");
217 expect(JSON.stringify(layout.compactTrailing)).not.toContain("0 active");
218 expect(JSON.stringify(layout.expandedLeading)).toContain("Done");
219 expect(JSON.stringify(layout.minimal)).toContain("checkmark.circle.fill");
220 expect(JSON.stringify(layout.bannerSmall)).toContain("Done");
221 });
222
223 it("reads Failed when the finished work ended in failure", () => {
224 const layout = AgentActivity(
225 {
226 ...props,
227 subtitle: "Agent work failed",
228 activeCount: 0,
229 activities: [makeRow({ phase: "failed", status: "Failed" })],
230 },
231 environment as never,
232 );
233 const banner = JSON.stringify(layout.banner);
234 expect(banner).toContain("Agent work failed");
235 expect(banner).toContain("#fca5a5"); // red-300 header tint
236 expect(JSON.stringify(layout.compactTrailing)).toContain("Failed");
237 expect(JSON.stringify(layout.expandedLeading)).toContain("Failed");
238 expect(JSON.stringify(layout.minimal)).toContain("xmark.octagon.fill");
239 });
240
241 it("lets a failure dominate mixed finished outcomes across every presentation", () => {
242 const layout = AgentActivity(
243 {
244 ...props,
245 // The server subtitle keys off the newest terminal row (completed
246 // here); the layout must still read Failed everywhere so the header
247 // text never disagrees with the tint, count slots, or minimal glyph.
248 subtitle: "Agent work completed",
249 activeCount: 0,
250 activities: [
251 makeRow({ phase: "completed", status: "Done" }),
252 makeRow({ threadId: "thread-2", phase: "failed", status: "Failed" }),
253 ],
254 },
255 environment as never,
256 );
257 const banner = JSON.stringify(layout.banner);
258 expect(banner).toContain("Agent work failed");
259 expect(banner).not.toContain("Agent work completed");
260 expect(banner).toContain("#fca5a5"); // red-300 header tint
261 expect(JSON.stringify(layout.compactTrailing)).toContain("Failed");
262 expect(JSON.stringify(layout.expandedLeading)).toContain("Failed");
263 expect(JSON.stringify(layout.minimal)).toContain("xmark.octagon.fill");
264 });
265
202 it("renders up to five rows in the banner", () => {266 it("renders up to five rows in the banner", () => {
203 const layout = AgentActivity(267 const layout = AgentActivity(
204 {268 {
apps/mobile/src/widgets/AgentActivity.tsx+21-8
...@@ -123,16 +123,28 @@ export function AgentActivity(...@@ -123,16 +123,28 @@ export function AgentActivity(
123 ? phaseTint(failedRow.phase)123 ? phaseTint(failedRow.phase)
124 : tint;124 : tint;
125125
126 // With nothing active the aggregate only carries recently finished work, so
127 // "0 active agents" (and a lone "0" in the expanded island) read as broken.
128 // Lead with the outcome instead. The outcome is derived here from the rows
129 // rather than taken from the server subtitle (which keys off the newest
130 // terminal row): every presentation — header text, tint, count slots,
131 // minimal glyph — must agree, and a failure anywhere should dominate a
132 // newer success.
133 const allDone = props.activeCount === 0;
134 const doneLabel = failedRow ? "Failed" : "Done";
135 const outcomeLabel = failedRow ? "Agent work failed" : "Agent work completed";
136
126 // Header copy: "5 active agents" + (", 1 needs attention"). The banner renders137 // Header copy: "5 active agents" + (", 1 needs attention"). The banner renders
127 // the two parts in-line so the attention half can carry the accent color;138 // the two parts in-line so the attention half can carry the accent color;
128 // `summary` is the short form for tight spots (expanded center, watch card).139 // `summary` is the short form for tight spots (expanded center, watch card).
129 const agentWord = props.activeCount === 1 ? "agent" : "agents";140 const agentWord = props.activeCount === 1 ? "agent" : "agents";
130 const agentsLabel = `${props.activeCount} active ${agentWord}`;141 const agentsLabel = allDone ? outcomeLabel : `${props.activeCount} active ${agentWord}`;
131 const attentionSuffix =142 const attentionSuffix =
132 attentionRows.length > 0143 attentionRows.length > 0
133 ? `${attentionRows.length} need${attentionRows.length === 1 ? "s" : ""} attention`144 ? `${attentionRows.length} need${attentionRows.length === 1 ? "s" : ""} attention`
134 : "";145 : "";
135 const summary = attentionSuffix || `${props.activeCount} active`;146 const activeLabel = allDone ? doneLabel : `${props.activeCount} active`;
147 const summary = attentionSuffix || activeLabel;
136148
137 // Any registered scheme variant routes back to this app; taps are delivered149 // Any registered scheme variant routes back to this app; taps are delivered
138 // to the widget's containing app, so the prod scheme is safe for all builds.150 // to the widget's containing app, so the prod scheme is safe for all builds.
...@@ -142,8 +154,6 @@ export function AgentActivity(...@@ -142,8 +154,6 @@ export function AgentActivity(
142 ? `t3code://${deepLinkRow.deepLink.slice(1)}`154 ? `t3code://${deepLinkRow.deepLink.slice(1)}`
143 : null;155 : null;
144156
145 const activeLabel = `${props.activeCount} active`;
146
147 // A scannable status glyph per phase — reads faster than colored words and157 // A scannable status glyph per phase — reads faster than colored words and
148 // ties the compact / expanded / banner / watch presentations together.158 // ties the compact / expanded / banner / watch presentations together.
149 type SFName = NonNullable<ComponentProps<typeof Image>["systemName"]>;159 type SFName = NonNullable<ComponentProps<typeof Image>["systemName"]>;
...@@ -245,7 +255,9 @@ export function AgentActivity(...@@ -245,7 +255,9 @@ export function AgentActivity(
245 <Text255 <Text
246 modifiers={[256 modifiers={[
247 font({ weight: "semibold", size: 13 }),257 font({ weight: "semibold", size: 13 }),
248 foregroundStyle(primaryForeground),258 // The all-done header carries the outcome tint (emerald /
259 // red) the way the Done/Failed status labels do.
260 foregroundStyle(allDone ? headerTint : primaryForeground),
249 lineLimit(1),261 lineLimit(1),
250 ]}262 ]}
251 >263 >
...@@ -322,16 +334,17 @@ export function AgentActivity(...@@ -322,16 +334,17 @@ export function AgentActivity(
322 </Text>334 </Text>
323 ),335 ),
324 // The shared/minimal form is a ~22pt circle — a single signal reads there,336 // The shared/minimal form is a ~22pt circle — a single signal reads there,
325 // the wordmark does not. Show the blocking phase glyph, else the mark.337 // the wordmark does not. Show the blocking/outcome phase glyph, else the
338 // mark (all-done shows the hero row's checkmark/cross).
326 minimal:339 minimal:
327 attentionRow || failedRow340 (attentionRow || failedRow || allDone) && heroRow
328 ? renderGlyph(phaseSymbol(heroRow.phase), 13, phaseTint(heroRow.phase))341 ? renderGlyph(phaseSymbol(heroRow.phase), 13, phaseTint(heroRow.phase))
329 : renderLogo(11, tint),342 : renderLogo(11, tint),
330 expandedLeading: (343 expandedLeading: (
331 <HStack spacing={5} alignment="center" modifiers={[padding({ leading: 4, vertical: 4 })]}>344 <HStack spacing={5} alignment="center" modifiers={[padding({ leading: 4, vertical: 4 })]}>
332 {renderLogo(15, tint)}345 {renderLogo(15, tint)}
333 <Text modifiers={[font({ weight: "bold", size: 13 }), foregroundStyle(tint)]}>346 <Text modifiers={[font({ weight: "bold", size: 13 }), foregroundStyle(tint)]}>
334 {`${props.activeCount}`}347 {allDone ? doneLabel : `${props.activeCount}`}
335 </Text>348 </Text>
336 </HStack>349 </HStack>
337 ),350 ),