high priority low complexity frontend pending frontend specialist Tier 6

Acceptance Criteria

All interactive controls (AppTextField, chapter chips, save button, back button) have a minimum touch target of 44×44 logical pixels; verified using Flutter's SemanticsDebugger and manual measurement
Every AppTextField has a `Semantics(label: '...')` wrapper or relies on the InputDecoration.labelText that is exposed to the accessibility tree — no field is reachable only by position
Validation error messages are wrapped in `Semantics(liveRegion: true)` so VoiceOver/TalkBack announces them immediately when they appear without the user navigating to them
Error text colour and helper text colour both meet a minimum contrast ratio of 4.5:1 against the card/form background, verified with a contrast checker against the design token values
Focus traversal order follows the visual top-to-bottom, left-to-right layout; no field is skipped or visited out of order when navigating with an external keyboard or switch access
Chapter chip add/remove controls have descriptive semantic labels (e.g. 'Remove chapter Oslo', 'Add chapter') not just icon labels
The save button's semantic label changes to 'Saving, please wait' while loading and reverts to 'Save changes' on completion
No use of colour alone to convey information (e.g. error state uses icon + text + colour, not colour alone)
Screen reader reading order matches sighted reading order in both portrait and landscape orientations
All changes are verified on both iOS (VoiceOver) and Android (TalkBack) using physical or emulated devices in CI where possible

Technical Requirements

frameworks
Flutter
flutter_test
performance requirements
Semantic tree construction adds no measurable frame budget cost (Semantics widgets are zero-cost when accessibility services are inactive)
security requirements
Sensitive fields (e.g. personal ID if present) must not have their content exposed in the semantic tree beyond what is visually displayed
ui components
Semantics widget
ExcludeSemantics widget (for decorative elements)
MergeSemantics widget (for compound controls)
AppTextField (audit label exposure)
Chapter chip widgets (audit touch target and label)

Execution Context

Execution Tier
Tier 6

Tier 6 - 158 tasks

Can start after Tier 5 completes

Implementation Notes

Start with an automated sweep using `flutter analyze` and the `accessibility_tools` pub package (add as dev dependency) to catch contrast and touch-target violations statically. Wrap each AppTextField in `Semantics(label: fieldLabel, child: ...)` only if InputDecoration.labelText is not already surfaced — avoid double-announcing. For chips, use `Semantics(button: true, label: 'Remove chapter ${chapter.name}', child: chip)`. For live regions, the simplest pattern is: wrap the error Text with `Semantics(liveRegion: true, child: Text(errorMsg))` and conditionally include it in the widget tree (not opacity/visibility) so the accessibility engine fires the announcement on insertion.

Touch targets: if the chip widget is smaller than 44px, wrap in a `SizedBox` with `constraints: BoxConstraints(minWidth: 44, minHeight: 44)` and centre-align the content. Do not enlarge the visual chip — only the tap area.

Testing Requirements

Write widget tests using flutter_test with `tester.getSemantics()` to assert: (1) each form field has a non-empty semantic label, (2) error text nodes have `isLiveRegion == true` when validation fails, (3) save button label changes to loading text while isSaving is true. Use `SemanticsController` to verify focus order. Add a dedicated accessibility audit test that uses Flutter's `SemanticsHandle` to enumerate all nodes and asserts no node has an empty label. Manual QA checklist: VoiceOver on iOS simulator, TalkBack on Android emulator, external Bluetooth keyboard navigation.

Component
Edit Contact Screen
ui medium
Epic Risks (3)
medium impact medium prob scope

The encrypted-field-display confirmation dialog adds interaction steps that may frustrate coordinators who access sensitive fields frequently, leading to requests to bypass the flow or skip read-receipt logging, which would violate Blindeforbundet's compliance requirements.

Mitigation & Contingency

Mitigation: Design the confirmation dialog to be as minimal as possible (one clear sentence, single confirm action) and ensure it does not reappear for the same field within a single screen session. Validate the UX with Blindeforbundet coordinators during the TestFlight pilot before finalising.

Contingency: If coordinators raise strong objections, escalate to Blindeforbundet's data protection officer to determine whether a lighter confirmation pattern (e.g., biometric confirmation instead of dialog) satisfies their compliance obligation.

medium impact medium prob technical

The activity-history-list infinite scroll requires paginated Supabase queries. Contacts with hundreds of activities (e.g., an HLF peer mentor with 380 annual registrations) could cause slow page loads or memory pressure on older devices if pagination boundaries are set too large.

Mitigation & Contingency

Mitigation: Use a page size of 20 records with cursor-based pagination. Implement list item recycling using Flutter's ListView.builder. Benchmark memory usage with 400+ item simulation on a low-end test device before TestFlight release.

Contingency: If performance degrades on older devices, reduce page size to 10 and add a time-window filter (last 30 days, last 6 months, all) so the default view loads a manageable record count for most coordinators.

low impact high prob scope

The cognitive load rule engine (from the Cognitive Accessibility feature) mandates no more than 7 fields per screen section. If a contact model has more than 7 editable fields, the edit-contact-screen layout must be split into sections, adding complexity not accounted for in the initial scope.

Mitigation & Contingency

Mitigation: Audit the full contact field list from all four organisations before implementation. Group fields into logical sections (personal info, contact details, affiliation) so no single section exceeds 7 fields. Use the cognitive-load-rule-engine component if it is already delivered by the Cognitive Accessibility feature.

Contingency: If the rule-engine component is not yet available, implement a simple manual section layout with accordion-style expansion for less-frequently edited fields to stay within the 7-field guideline without blocking delivery.