Skip to content

Tasks: UI pause/resume buttons #1267

@mafredri

Description

@mafredri

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:

Task Status Pause Button Resume Button
active enabled hidden
paused hidden enabled
starting (resume in progress) enabled (cancels) disabled
stopping (pause in progress) disabled hidden

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:

References:

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions