Contact Detail Screen
Component Detail
Description
Main screen displaying the full profile of a contact or peer mentor, including affiliation, role, and activity history. Adapts layout and visible fields based on organization context (NHF multi-chapter, Blindeforbundet encrypted assignments).
contact-detail-screen
Summaries
The Contact Detail Screen is the primary interface through which field workers, coordinators, and administrators access a complete view of any contact or peer mentor in the system. It directly supports operational efficiency by consolidating all relevant profile information — affiliations, assignment status, activity history, and role context — into a single, context-aware view. For NHF, this means coordinators can instantly see which chapters a contact belongs to across up to five local branches. For Blindeforbundet, it surfaces assignment statuses and encrypted sensitive data with appropriate access controls.
By reducing the time needed to locate and interpret contact information, this screen directly improves service delivery quality, which is the core mission metric for both organizations. A polished, reliable contact detail experience also reduces training time for new staff and volunteers.
The Contact Detail Screen is a medium-complexity UI component with a broad dependency footprint: it requires multi-chapter-affiliation-chip, assignment-status-indicator, activity-history-list, encrypted-field-display, and contact-detail-service to all be complete before this screen can be fully integrated and tested. This makes it a late-stage deliverable in the sprint plan — it should be scheduled after its dependencies are stabilized. The adaptive layout logic (NHF multi-chapter vs Blindeforbundet encrypted assignments) introduces conditional rendering paths that each require separate test scenarios. Plan for at least two device-form-factor test passes and explicit accessibility testing, particularly for the encrypted field reveal flow.
Risk: if contact-detail-service or encrypted-field-display experience scope changes, this screen's timeline will be directly impacted.
The Contact Detail Screen is a stateful Flutter widget in the mobile execution context, consuming data from contact-detail-service and rendering it through several specialized sub-widgets. The loadContactData method fetches a full contact profile by ID, and the build method conditionally renders affiliation chips (via multi-chapter-affiliation-chip), assignment status (via assignment-status-indicator), activity history (via activity-history-list), and encrypted fields (via encrypted-field-display) based on the organization context derived from the loaded contact's metadata. Navigation to the edit screen is gated by role — only coordinators and admins see the edit action. The screen must handle loading, error, and empty states gracefully.
Data models consumed include contact, peer-mentor, chapter, and assignment. Pay attention to widget rebuild efficiency: use selective state management (e.g., Riverpod or BLoC) to avoid full-tree rebuilds when only a sub-section of the profile updates, such as when an encrypted field is revealed.
Responsibilities
- Render full contact profile with all metadata fields
- Display assignment status indicators (open, pending, completed) for Blindeforbundet
- Show activity history timeline for the contact
- Provide navigation to edit screen for coordinators and admins
Interfaces
build(BuildContext context)
loadContactData(String contactId)
navigateToEdit()
showAssignmentStatus(AssignmentStatus status)
renderActivityHistory(List<Activity> activities)
renderAffiliationChips(List<Chapter> chapters)
Relationships
Dependencies (5)
Components this component depends on