fix(mothership): repair background wakes and simplify watch activity

Author: Sg312

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/agent-group/agent-group-view.tsx

@@ -315,7 +315,7 @@ export function AgentGroupView({
           {activity}
         </ActivityStream>
       )}
-      {error && <p className='pl-6 text-[var(--text-error)] text-caption'>{error}</p>}
+      {error && <p className='pl-6 text-[var(--text-tertiary)] text-caption'>{error}</p>}
       {activeBrowserTakeover && (
         <div key={activeBrowserTakeover.id} className='animate-stream-fade-in'>
           {renderBrowserTakeover?.(activeBrowserTakeover.reason)}

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/task-pill/index.ts

@@ -4,7 +4,7 @@ import { act, type ReactNode } from 'react'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { createRoot, type Root } from 'react-dom/client'
 import { afterEach, beforeEach, expect, it, vi } from 'vitest'
-import { TaskPill } from '@/app/workspace/[workspaceId]/home/components/message-content/components/task-pill/task-pill'
+import { WatchActivity } from '@/app/workspace/[workspaceId]/home/components/message-content/components/watch-activity/watch-activity'
 import { mothershipTaskKeys } from '@/hooks/queries/mothership-tasks'
 
 const { request } = vi.hoisted(() => ({ request: vi.fn() }))
@@ -13,12 +13,6 @@ vi.mock('@/lib/mothership/tools/client/resource-display', () => ({
     id === 'workflow' ? 'Alfred' : undefined,
 }))
 vi.mock('@/lib/api/client/request', () => ({ requestJson: request }))
-vi.mock('@sim/emcn', () => ({
-  Check: () => null,
-  Clock: () => null,
-  X: () => null,
-  cn: (...values: string[]) => values.join(' '),
-}))
 const task = {
   taskId: '22222222-2222-4222-8222-222222222222',
   kind: 'timer',
@@ -55,27 +49,34 @@ afterEach(() => {
   client.clear()
 })
 
-it('updates a pill in an earlier message without needing an event in that turn', async () => {
+it('updates the same pending tool row in an earlier message without needing an event in that turn', async () => {
   render(
     <QueryClientProvider client={client}>
-      <TaskPill task={task} />
+      <WatchActivity task={task} />
     </QueryClientProvider>
   )
   await act(async () => vi.waitFor(() => expect(request).toHaveBeenCalledTimes(1)))
+  const row = statusElement()
+  expect(row.parentElement?.getAttribute('aria-busy')).toBe('true')
+  expect(row.querySelector('[class*=shimmer]')).not.toBeNull()
+  expect(row.textContent).toBe('Waiting for timer')
   request.mockResolvedValue({ taskId: task.taskId, status: 'completed', summary: 'Timer elapsed' })
   await act(() => client.invalidateQueries({ queryKey: mothershipTaskKeys.detail(task.taskId) }))
   await act(async () =>
     vi.waitFor(() => {
-      expect(statusElement().textContent).toMatch(/Background watch.*Completed timer/)
+      expect(statusElement().textContent).toBe('Timer finished')
     })
   )
-  expect(statusElement().title).toContain('Timer elapsed')
+  expect(statusElement()).toBe(row)
+  expect(row.parentElement?.getAttribute('aria-busy')).toBe('false')
+  expect(row.querySelector('[class*=shimmer]')).toBeNull()
+  expect(row.parentElement?.title).toContain('Timer elapsed')
 })
 
 it('never replaces a live terminal event with a cached pending status', async () => {
   const view = render(
     <QueryClientProvider client={client}>
-      <TaskPill task={task} />
+      <WatchActivity task={task} />
     </QueryClientProvider>
   )
   await act(async () =>
@@ -85,18 +86,18 @@ it('never replaces a live terminal event with a cached pending status', async ()
   )
   view.rerender(
     <QueryClientProvider client={client}>
-      <TaskPill task={{ ...task, status: 'stopped' }} />
+      <WatchActivity task={{ ...task, status: 'stopped' }} />
     </QueryClientProvider>
   )
-  expect(statusElement().textContent).toMatch(/Stopped timer/)
+  expect(statusElement().textContent).toBe('Timer stopped')
 })
 
 it('shows completed workflow watches as status without duplicate run ids or action controls', () => {
   const executionId = '733e3428-f081-4504-bc5e-25be3b515304'
   const summary = `Workflow run ${executionId} of "Alfred" completed`
   render(
     <QueryClientProvider client={client}>
-      <TaskPill
+      <WatchActivity
         task={{
           ...task,
           kind: 'workflow_run',
@@ -108,8 +109,8 @@ it('shows completed workflow watches as status without duplicate run ids or acti
     </QueryClientProvider>
   )
   const status = statusElement()
-  expect(status.textContent).toBe('Background watch · Completed workflow run · Alfred')
-  expect(status.title).toContain(summary)
+  expect(status.textContent).toBe('Completed workflow run: Alfred')
+  expect(status.parentElement?.title).toContain(summary)
   expect(status.textContent).not.toContain(executionId)
   expect(container.querySelector('button')).toBeNull()
   expect(request).not.toHaveBeenCalled()
@@ -120,10 +121,36 @@ it.each(['failed', 'expired', 'stopped'] as const)(
   (status) => {
     render(
       <QueryClientProvider client={client}>
-        <TaskPill task={{ ...task, kind: 'workflow_run', status, summary: 'Run did not finish' }} />
+        <WatchActivity
+          task={{ ...task, kind: 'workflow_run', status, summary: 'Run did not finish' }}
+        />
       </QueryClientProvider>
     )
     expect(statusElement().textContent).not.toContain('Completed')
-    expect(statusElement().title).toContain('Run did not finish')
+    expect(statusElement().parentElement?.title).toContain('Run did not finish')
   }
 )
+
+it('renders a timer as a normal pending tool row without separate status chrome', () => {
+  const firesAt = '2026-09-18T17:32:00Z'
+  const time = new Date(firesAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+  render(
+    <QueryClientProvider client={client}>
+      <WatchActivity task={{ ...task, target: { firesAt } }} />
+    </QueryClientProvider>
+  )
+  expect(statusElement().textContent).toBe(`Waiting until ${time}`)
+  expect(statusElement().querySelector('[class*=shimmer]')).not.toBeNull()
+  expect(container.textContent).not.toContain('Background watch')
+  expect(container.querySelector('svg')).toBeNull()
+})
+
+it('keeps pending workflow watches active even after the originating turn ends', () => {
+  render(
+    <QueryClientProvider client={client}>
+      <WatchActivity task={{ ...task, kind: 'workflow_run', target: { workflowId: 'workflow' } }} />
+    </QueryClientProvider>
+  )
+  expect(statusElement().textContent).toBe('Waiting for workflow run: Alfred')
+  expect(statusElement().querySelector('[class*=shimmer]')).not.toBeNull()
+})

apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/task-pill/task-pill.tsx

@@ -0,0 +1,53 @@
+import { ActivityStatus } from '@/components/ui/activity-status'
+import type { TaskBlockInfo } from '@/lib/mothership/request/types'
+import { resolveResourceDisplayName } from '@/lib/mothership/tools/client/resource-display'
+import { useMothershipTaskStatus } from '@/hooks/queries/mothership-tasks'
+
+interface WatchActivityProps {
+  task: TaskBlockInfo
+}
+
+function watchLabel(task: TaskBlockInfo): string {
+  const status = task.status ?? 'pending'
+  if (task.kind === 'workflow_run') {
+    const workspaceId =
+      typeof task.target.workspaceId === 'string' ? task.target.workspaceId : undefined
+    const name = resolveResourceDisplayName('workflow', task.target.workflowId, { workspaceId })
+    const target = name ? `workflow run: ${name}` : 'workflow run'
+    return {
+      pending: `Waiting for ${target}`,
+      completed: `Completed ${target}`,
+      failed: `Failed ${target}`,
+      stopped: `Stopped watching ${target}`,
+      expired: `Watch expired for ${target}`,
+    }[status]
+  }
+  const at = typeof task.target.firesAt === 'string' ? new Date(task.target.firesAt) : undefined
+  const time =
+    at && Number.isFinite(at.getTime())
+      ? at.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+      : undefined
+  if (status === 'pending') return time ? `Waiting until ${time}` : 'Waiting for timer'
+  const label = {
+    completed: 'Timer finished',
+    failed: 'Timer failed',
+    stopped: 'Timer stopped',
+    expired: 'Timer expired',
+  }[status]
+  return time ? `${label} · ${time}` : label
+}
+
+/** A watch uses the normal tool row, but remains pending independently of the turn. */
+export function WatchActivity({ task: recorded }: WatchActivityProps) {
+  const { data } = useMothershipTaskStatus(recorded)
+  const task =
+    data && (!recorded.status || recorded.status === 'pending')
+      ? { ...recorded, status: data.status, summary: data.summary ?? undefined }
+      : recorded
+  const pending = task.status === undefined || task.status === 'pending'
+  return (
+    <div aria-busy={pending} title={[task.summary, task.note].filter(Boolean).join('\n')}>
+      <ActivityStatus label={watchLabel(task)} isActive={pending} />
+    </div>
+  )
+}

…/components/task-pill/task-pill.test.tsx …s/watch-activity/watch-activity.test.tsxapps/sim/app/workspace/[workspaceId]/home/components/message-content/components/task-pill/task-pill.test.tsx renamed to apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/watch-activity/watch-activity.test.tsx apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/task-pill/task-pill.test.tsx renamed to apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/watch-activity/watch-activity.test.tsx

@@ -219,6 +219,22 @@ describe('MessageContent shared thinking indicator', () => {
     }
   )
 
+  it('keeps interrupted subagent details visible with neutral styling and no active shimmer', () => {
+    const error = 'Subagent interrupted during run recovery.'
+    render(
+      [{ ...start('task'), subagentName: 'Build wakeups and delivery', endedAt: 2, error }],
+      false
+    )
+    expect(container.textContent).toContain('Build wakeups and delivery')
+    const detail = Array.from(container.querySelectorAll('p')).find(
+      (node) => node.textContent === error
+    )
+    expect(detail).toBeDefined()
+    expect(detail?.className).toContain('--text-tertiary')
+    expect(container.innerHTML).not.toContain('--text-error')
+    expect(container.querySelector('[class*="shimmer"]')).toBeNull()
+  })
+
   it('keeps thinking hidden while prose streams and finishes revealing', () => {
     const blocks: ContentBlock[] = [
       start('browser'),