User Interface low complexity mobile
1
Dependencies
0
Dependents
0
Entities
0
Integrations

Description

Primary UI control on the peer mentor profile screen that allows a mentor to toggle their status between active and paused. Displays current status clearly and prompts for confirmation before state transitions.

Feature: Peer Mentor Pause & Reactivation

pause-reactivate-toggle

Summaries

The Pause/Reactivate Toggle gives peer mentors direct control over their own availability, eliminating the operational overhead of coordinator-mediated status updates. By empowering mentors to self-manage, the organization reduces administrative bottlenecks and ensures assignment pools always reflect real-time availability. This translates to fewer wasted coordinator hours, faster response to mentor capacity changes, and a better experience for mentors who feel trusted with autonomy over their own schedule. Improved availability accuracy reduces the risk of assigning work to unavailable mentors, protecting program quality and participant satisfaction.

This is a low-complexity mobile UI component with a single dependency on the Pause Confirmation Dialog. Development effort is minimal — primarily a stateful widget with a status badge and two tap handlers. Testing scope includes unit tests for state rendering, integration tests for the confirmation flow, and accessibility audits for WCAG 2.2 AA compliance. No backend work is required at this layer; the component delegates business logic downstream.

Risk is low, but delivery depends on the Pause Confirmation Dialog being completed first. Recommend building both components in the same sprint to avoid blocking integration.

Implemented as a stateful mobile widget exposing `renderStatusBadge(status: MentorStatus)`, `onPauseTapped()`, `onReactivateTapped()`, `setLoadingState(bool)`, and `showErrorBanner(String)`. The component owns only presentation state — loading and error display — and delegates all business logic to the calling screen's controller or BLoC. It depends on `pause-confirmation-dialog` to handle the confirmation step before emitting action callbacks. Status badge must meet WCAG 2.2 AA contrast ratios; use semantic focus nodes for screen reader compatibility.

Keep this widget stateless where possible and lift state to the parent to simplify testing.

Responsibilities

  • Render current mentor status (active, paused) with accessible badge
  • Provide tap target to initiate pause or reactivation flow
  • Enforce WCAG 2.2 AA contrast and focus semantics

Interfaces

renderStatusBadge(status: MentorStatus)
onPauseTapped()
onReactivateTapped()
setLoadingState(bool)
showErrorBanner(String message)

Relationships

Dependencies (1)

Components this component depends on