Skip to content

Add live region announcements and an a11y pass to the SettlementModal processing states #662

Description

@1nonlypiece

📌 Description

src/components/modals/SettlementModal.tsx transitions through
eligible → processing → settled/error with per-step states (initiating,
confirming, finalizing), but status changes are conveyed visually only.
Screen-reader users do not hear progress, and the ineligible-reason copy needs
verified accessible association.

This issue adds ARIA live-region announcements for state/step changes and audits
the modal's accessibility (focus, labelling, escape) without changing its visual
design.

🎯 Requirements and Context

  • Announce state and processing-step changes via a polite live region.
  • Ensure the dialog has proper role, label, focus trap, and escape handling.
  • Verify ineligible-reason category copy is associated and announced.
  • No visual regressions to existing states.

🛠️ Suggested Execution

1. Fork the repo and create a branch

git checkout -b a11y/settlement-modal-live-regions

2. Implement changes

  • Update src/components/modals/SettlementModal.tsx with a live region and any
    ARIA/focus fixes.
  • Add src/components/modals/SettlementModal.a11y.test.tsx covering announcements
    on each transition, focus trap, escape, and reason-copy association.
  • Add docs/accessibility/SETTLEMENT_MODAL_A11Y.md documenting the behaviour.
  • Validate with keyboard-only and screen-reader expectations.

3. Test and commit

  • Run pnpm test.
  • Cover edge cases: rapid state changes, processing→error, ineligible categories,
    escape during processing.

Example commit message

a11y: live-region announcements for SettlementModal states

✅ Guidelines

  • Minimum 95% test coverage on changed lines.
  • Clear, reviewer-friendly documentation.
  • Timeframe: 96 hours.

🏷️ Labels

type-security · type-enhancement · area-frontend · MAYBE REWARDED ·
GRANTFOX OSS · OFFICIAL CAMPAIGN

💬 Community & Support

  • Join the CommitLabs contributor Discord to coordinate and get unblocked fast:
    https://discord.gg/WV7tdYkJk
  • Introduce yourself before starting so we can avoid duplicate work and pair you
    with a reviewer. Maintainers triage actively and review fast.

Metadata

Metadata

Assignees

No one assigned

    Labels

    GRANTFOX OSSGrantFox open-source campaignMAYBE REWARDEDEligible for GrantFox rewardOFFICIAL CAMPAIGNOfficial GrantFox campaign issueStellar WaveIssues in the Stellar wave programarea-frontendFrontend / UI worktype-enhancementImprovement to existing functionalitytype-securitySecurity review / hardening

    Type

    No fields configured for Task.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions