Scenario Prompt Notification Card
Component Detail
Description
Displays an actionable scenario-based prompt in the notifications tab with contextual description and a primary CTA button. Tapping the card or CTA deep-links directly into the activity registration wizard with pre-filled route arguments derived from the triggering activity.
scenario-prompt-notification-card
Summaries
The Scenario Prompt Notification Card transforms passive notifications into active engagement drivers by presenting peer mentors with contextually relevant, actionable prompts directly in their notification feed. Rather than sending generic reminders that mentors may ignore, this card surfaces scenario-specific guidance tied to real activity context and provides a single tap to begin the activity registration process — dramatically reducing the friction between a mentor receiving guidance and acting on it. Higher prompt-to-action conversion rates directly translate to more completed mentoring activities logged in the system, improving program outcome data quality and demonstrating measurable impact to program stakeholders. This feature represents a meaningful competitive differentiator for the platform's mentor engagement model.
This mobile UI component has medium complexity driven by the deep-link navigation integration and the need to pre-fill activity registration wizard arguments from the triggering prompt's activity data. It has a hard dependency on the `scenario-deep-link-handler` component, which must be functional before end-to-end tap-to-navigate flows can be tested. Development should be sequenced after the deep-link handler is available in the development environment. The dismissal flow requires a confirmation interaction, which adds a small UX design coordination step with the product/design team.
Testing requirements include: card rendering with varying prompt lengths, CTA tap triggering correct deep-link with correct pre-fill arguments, dismissal confirmation behavior, and prompt age display accuracy. Accessibility testing (touch target sizes, screen reader labels) should be included in the acceptance criteria given the mobile context.
This is a stateless Flutter widget accepting a `ScenarioPrompt` domain object and two callbacks (`onAction`, `onDismiss`). The `buildActionButton` method constructs the primary CTA, which calls `onAction` — the parent widget is responsible for invoking the `scenario-deep-link-handler` with route arguments derived from `prompt.activityId` and any pre-fill parameters. `buildContextSummary` renders the prompt body and contextual metadata (contact name, prompt age as relative time string). `buildDismissButton` should trigger a confirmation dialog before invoking `onDismiss` to prevent accidental dismissal.
Prompt age display should use a shared relative-time formatting utility rather than inline DateTime arithmetic. Ensure the card layout handles long prompt bodies gracefully with text overflow clipping or scrollable content areas. The widget should be covered by widget tests using `pump` and `find` to verify CTA and dismiss interactions without requiring a real deep-link handler.
Responsibilities
- Render prompt title, body, and contextual metadata
- Provide a tappable CTA that triggers deep-link navigation
- Show dismissal option with confirmation
- Indicate prompt age and associated contact name
Interfaces
ScenarioPromptCard({required ScenarioPrompt prompt, required VoidCallback onAction, required VoidCallback onDismiss})
buildActionButton()
buildContextSummary()
buildDismissButton()