Certification Alert Banner
Component Detail
Description
Conditional banner displayed when a peer mentor's HLF certification has expired or is within 30 days of expiry. Presents a clear call-to-action linking to course enrollment. Suppressed for non-HLF organizations. Uses design token warning/error surface colors.
certification-alert-banner
Summaries
The Certification Alert Banner directly reduces the risk of non-compliant mentor activity by proactively surfacing expiring or expired HLF certifications at the moment a coordinator views a mentor's profile. The embedded call-to-action for course enrollment shortens the remediation path from risk identification to corrective action, reducing the time mentors operate in a lapsed certification state. This is particularly valuable for HLF partner organizations where certification lapse carries regulatory or contractual consequences. By suppressing the banner entirely for non-HLF organizations, the platform avoids alert fatigue and keeps the experience relevant and high-signal for each partner context.
Low complexity but carries a notable product requirement: the banner must be conditionally suppressed for non-HLF organizations, which requires reliable access to the organization context at render time. Confirm the org context injection pattern is established before development begins to avoid a late-stage rework. The enrollment CTA links to a course enrollment flow — clarify whether this is an in-app navigation or an external URL, as that decision affects implementation scope. WCAG 2.2 AA contrast compliance for warning and error surface colors requires designer sign-off on token values before QA.
Budget accessibility testing time. Overall delivery risk is low with clear requirements, but the org-context dependency is worth tracking.
Stateless Flutter widget. `_isAlertRelevant()` must evaluate both `isHlf` and `expiryDate` — return false early if `isHlf` is false, avoiding unnecessary date computation. `_computeDaysRemaining` should handle null `expiryDate` gracefully (return a sentinel or null). Threshold logic: show warning surface when days remaining ≤ 30, error surface when expired (days remaining ≤ 0).
Use design token surface colors (`surfaceWarning`, `surfaceError`) not component-level overrides. The `onEnrollTap` callback is a `VoidCallback` — navigation is delegated to the parent, keeping this widget transport-agnostic. WCAG contrast: verify token values against AA ratio programmatically in widget tests using Flutter's `ThemeData` color inspection utilities. Unit test boundary conditions: null expiry, exactly 30 days, exactly 0 days, negative days.
Responsibilities
- Display expiry warning with days-remaining countdown
- Render enroll-in-course CTA button for HLF organization context
- Hide entirely for non-HLF organizations via org context
- Meet WCAG 2.2 AA contrast requirements for alert states
Interfaces
CertificationAlertBanner({required DateTime? expiryDate, required VoidCallback onEnrollTap, required bool isHlf})
build(BuildContext context)
_computeDaysRemaining(DateTime expiryDate)
_isAlertRelevant()