Tasks: UI pause/resume buttons #1267

Repo: coder/coder

Scope: Add pause and resume buttons to task pages.

Design notes:

• Use task-centric terminology, avoid "workspace" language (TBD, see Figma)
• Paused state: "Resume task" button, not "Restart workspace" (TBD, see Figma)
• Active state: "Pause task" button (see Figma)
• Task list: Play icon (▷) for resume, pause icon (⏸) for pause (see Figma)

Changes:

• Tasks table (TasksTable.tsx): Show "Resume" button for paused tasks, "Pause" for active
• Task view (TaskPage.tsx): Add Pause/Resume buttons to action area
• Pause button remains enabled during startup/resume, allows canceling a resume in progress (see Figma)
• Resume button disabled during pause transition
• Show build progress indicator during pause/resume operations
• Inform users that resuming will take a moment and consume resources

State management (implementation suggestions, follow existing patterns):

• Use React Query mutation for pause/resume API calls (see useMutation usage in codebase)
• Poll workspace build status using existing patterns (see API.waitForBuild, useWorkspaceBuildLogs)
• Local isTransitioning state to disable buttons during operations
• Optimistic UI update on button click, revert on error

Button states:

Files:

• site/src/pages/TasksPage/TasksTable.tsx
• site/src/pages/TaskPage/TaskPage.tsx
• site/src/pages/TaskPage/TaskTopbar.tsx

Acceptance criteria:

• Resume button visible for paused tasks
• Pause button visible for active tasks and during startup/resume to allow cancel (see Figma)
• Resume button disabled during transitions
• Progress indicator shown during state transitions
• Appropriate user feedback about timing expectations
• Concurrent clicks handled (button disabled while request in flight)

Dependencies:

• Tasks: Manual pause endpoint #1261
• Tasks: Resume endpoint #1262

References:

• PRD: Start/Pause/Resume the Task Workspace
• RFC: Tasks: Start/Pause/Resume Lifecycle: UI
• Figma: Tasks: Resume/stop/start