User Interface

The primary authentication entry point presenting email and password input fields with form validation feedback. Handles credential submissi...

A multi-step screen guiding users through the password reset flow: email entry, confirmation of email sent, and deep-link redirect handling ...

Full-screen flow for initiating and completing BankID authentication. Launches the BankID OAuth2/OIDC flow via an in-app browser, handles re...

Prompt and feedback UI for device biometric re-authentication (Face ID on iOS, fingerprint on Android). Gated by prior BankID/Vipps setup, i...

Full-screen flow for initiating and completing Vipps login. Launches the Vipps OAuth2/OIDC flow, handles the redirect callback with tokens a...

Displayed when an authenticated user's role does not grant access to a given route or context. Provides clear feedback explaining why access...

Presented post-login when a user belongs to multiple organizations or local associations. Allows the user to choose which organizational con...

An in-app widget that allows users with multiple roles to toggle their active role without re-authenticating. Re-evaluates permissions on sw...

Review screen displayed after all wizard steps are completed, showing a full summary of the about-to-be-saved activity. Provides a final con...

Full-screen selector presenting all available activity types seeded per organization from Supabase. Renders organization-specific activity t...

Multi-step wizard screen managing the full activity registration flow: contact selection, date, time, duration, and summary. Implements BLoC...

Inline settings widget embedded in the wizard allowing users to view and update their stored default values (date strategy, duration, prefer...

Multi-step wizard screen for creating group events with multiple participants. Guides the user through collecting event title, date, time, d...

Screen displaying full details of a created event including title, date, time, location, summary, and the list of registered participants. S...

Searchable multi-select widget for adding participants to an event. Renders a debounced search input backed by the Contact Repository and di...

Inline widget rendered during and after bulk submission that shows the real-time status of each mentor's registration attempt. Uses a map ke...

Full-screen coordinator interface for selecting multiple peer mentors and a shared activity template, then submitting all registrations in a...

Reusable widget that renders a searchable, filterable list of peer mentors by applying a 'peer_mentor' role filter to the Contact Repository...

Role-guarded screen that renders the full activity wizard on behalf of a chosen peer mentor, providing complete wizard fidelity identical to...

Composable overlay widget that wraps any Flutter TextEditingController to enable speech dictation in-place. Renders a microphone icon inline...

Stateful widget that manages the full recording lifecycle: microphone permission requests, animated waveform feedback during active recognit...

Inline widget embedded in the activity summary screen and activity detail view that displays attached documents and triggers attachment flow...

Full-screen modal that presents the user with options to capture a photo via camera, pick from gallery, or select a file from the device. Ha...

Reusable card component rendering a single contact or peer mentor entry in the list. Displays name, status badge, area, and role-relevant ac...

Slide-up or inline panel allowing users to filter the contact list by status, area, custom fields, or role. Reduces cognitive load when work...

Inline search bar with debounced input triggering Supabase queries filtered by organisation membership and role scope. Fully accessible via ...

Primary screen displaying the full contact and peer mentor roster with role-specific views. Coordinators see full contact management options...

Toggle widget allowing users to switch between Contacts and Peer Mentors list views. The selected view preference is persisted in local stor...

Full-screen view displaying all information for a single contact, including personal details, custom organisation fields, linked peer mentor...

Scrollable timeline widget that renders chronological notes tied to a contact, showing author, timestamp, and note body. Provides inline add...

Reusable table widget that renders organisation-defined custom fields for a contact, supporting both read-only display and editable input mo...

Step-by-step reactive form screen for editing contact records, built with Flutter's Form widget and custom AppTextField components. Supports...

Compact summary card for peer mentors used in list views and search results. Accepts a PeerMentor domain model and renders status badges, av...

Full-screen profile view for a peer mentor showing all role-specific attributes including certification status, assignment history, availabi...

Compact inline widget providing a quick availability toggle usable from the peer mentor's profile or home screen. Renders as a labelled swit...

Full-screen view displaying a peer mentor's current availability status with options to activate or deactivate the pause state. Shows active...

Coordinator-facing screen providing a real-time overview of all open assignments, showing per-assignment delivery and read status. Highlight...

Peer-mentor-facing widget that renders the decrypted content of a received assignment only after the recipient has completed authentication....

Coordinator-facing screen for composing and dispatching encrypted assignments to peer mentors. Displays a form for entering sensitive person...

Custom Flutter widget rendered as a map marker representing a single peer mentor's home area. Displays availability status through colour co...

Horizontal filter bar at the top of the map view allowing coordinators to filter visible pins by availability status (available, paused, all...

Interactive map screen displaying peer mentor location pins across a coordinator's operational area. Uses flutter_map with OpenStreetMap til...

Bottom sheet panel that slides up when a coordinator taps a location pin, showing a compact peer mentor card with key details and availabili...

Reusable amount entry widget used for toll fees, parking costs, and public transit fares where a fixed monetary amount is required. Supports...

Multi-step Flutter wizard screen that guides peer mentors and coordinators through registering travel reimbursement expenses. Orchestrates t...

Dropdown-based selection widget that enforces mutually exclusive expense type choices, preventing invalid combinations such as simultaneousl...

Specialised input widget for mileage-based reimbursement claims that accepts kilometre distance and calculates the reimbursement amount usin...

Reusable widget that integrates with the device camera and photo library via the `image_picker` Flutter package. Presents a bottom sheet act...

Displays a single receipt thumbnail within the upload screen grid. Tapping the thumbnail opens a full-screen image viewer, and a delete affo...

Primary screen for attaching receipt images to an expense item. Displays a thumbnail grid of already-attached receipts, provides action butt...

Coordinator-facing screen displaying all pending reimbursement submissions requiring manual review. Subscribes to real-time Supabase changes...

Reusable status indicator widget surfacing the current approval state of a reimbursement submission to the submitting peer mentor. Displays ...

Full detail view of a single reimbursement submission, enabling coordinators to review all expense items, receipts, and mileage data before ...

Full-page screen for registering driver honorarium payments linked to driving engagements. Displays applicable rate configuration, calculate...

Full-page screen that presents the NDA agreement document fetched from Supabase Storage, guides the peer mentor through reading the agreemen...

Main screen for coordinators and administrators to initiate, view, and manage Bufdir grant reports. Displays report history, generation stat...

Reusable widget for selecting reporting periods (quarter, half-year, annual) as defined by Bufdir's grant requirements. Supports organizatio...

Screen that renders a structured preview of the generated Bufdir report before export. Shows aggregated activity counts, participant numbers...

A reusable Flutter chart widget built on fl_chart that visualises peer mentor activity trends over time. Supports both bar and line chart mo...

The main screen presenting a peer mentor's personal activity statistics. Displays an overview of completed activities, total hours contribut...

An at-a-glance summary card widget displaying key metrics such as total activities, total hours, unique contacts helped, and current streak....

The primary dashboard screen for coordinators and organization administrators showing aggregated statistics across all peer mentors and acti...

A toolbar widget embedded in the coordinator dashboard that triggers CSV export of the currently filtered report data. Column headers are fo...

A multi-select filter panel that enables coordinators to slice dashboard data by area, organization level, date range, activity type, and pe...

Dedicated screen displaying a peer mentor's cumulative assignment count and progress toward honorarium thresholds. Shows current count, next...

Reusable progress indicator widget that renders a peer mentor's current assignment count versus the next honorarium threshold. Supports mult...

Modal dialog presented to the user when a potential duplicate activity is detected before submission. Displays the conflicting existing reco...

Reusable list tile widget representing a single notification entry. Renders icon, title, body, timestamp, and read/unread state. Supports sw...

Per-category opt-in/opt-out settings screen allowing users to control which push notification scenarios they receive. Settings are persisted...

Full-screen notification center listing all received push notifications for the authenticated user. Supports mark-as-read, delete, and tap-t...

Coordinator-facing screen for drafting and sending an encrypted assignment to a selected peer mentor. Provides fields for contact name, addr...

Full-detail screen for an individual decrypted assignment showing sensitive personal information including name, address, and medical summar...

Primary screen for peer mentors to view all received encrypted assignments. Displays a list of assignments with status indicators (delivered...

Coordinator-facing dashboard listing all open assignments with real-time delivery and read receipt states. Allows coordinators to identify u...

Reusable inline widget that displays the current encryption and delivery state of an assignment. Shows padlock icon with encryption confirma...

Sticky filter toolbar on the Assignment Status Screen allowing coordinators to narrow the assignment list by status, peer mentor, team, or t...

Full-screen view displaying all assignments with their current lifecycle state. Coordinators see a cross-peer-mentor overview filterable by ...

Reusable badge widget that visually communicates assignment urgency level based on elapsed days since last state change. Renders distinct co...

Vertical timeline widget rendering the full immutable state history of a single assignment. Each timeline node represents a state transition...

Visually engaging widget that animates numeric impact statistics using Flutter's AnimationController and Tween framework, creating a count-u...

In-app notification card widget that appears in the Notifications screen to invite the user to view their newly generated impact summary. Di...

Full-screen animated retrospective presentation inspired by Spotify Wrapped that guides the user through their annual contribution highlight...

Reusable widget that renders a single themed story slide within the Yearly Impact Summary sequence. Supports both the full-year annual revie...

Full-screen view displaying all badge categories with earned and locked states. Users can browse milestone tiers, view progress indicators t...

Reusable Flutter widget that renders a single badge illustration with locked/unlocked visual state, progress ring, and descriptive alt text ...

Main screen for the member recruitment feature, displaying the user's referral link, recruitment status, and a list of people who signed up ...

Widget that generates, displays, and shares a personalized referral link tied to the user's profile and local association. Uses Flutter's Sh...

Full-page Flutter screen displaying available courses with real-time seat availability and enrollment status. Presents courses in a scrollab...

Detailed Flutter page presenting full course information including description, prerequisites, schedule, location, instructor, and current e...

Modal or full-page confirmation screen shown before finalizing enrollment. Summarizes course name, date, and location, then provides a prima...

Renders an individual certificate entry with the certificate name, issue date, expiry date, and a download or present action button. Include...

Main screen listing all certificates earned by the peer mentor, displaying colour-coded validity indicators for each certificate. Provides a...

Inline UI widget that surfaces expiry warnings on certificate cards and the certificate screen when a certificate is within a configurable l...

Coordinator-facing UI component for creating new mentor-mentee pairings by selecting from available peer mentors and eligible mentees. Surfa...

Primary screen displaying active mentor-mentee pairings as a list with status indicators for each pairing. Provides coordinators with an at-...

Detail view for a specific mentor-mentee pairing showing full pairing history, milestone completion status, and coordinator intervention con...

Screen that displays and manages the list of participants enrolled in a workshop session. Pulls contacts from the contacts database filtered...

Lightweight checklist widget scoped per workshop session for tracking follow-up tasks arising during or after the session. Tasks are persist...

Overview screen listing all workshop sessions for the logged-in coordinator, grouped by status (upcoming, in-progress, completed, archived)....

Embeddable rich-text note-taking widget scoped to a single workshop session. Supports structured free-text entry with optional speech-to-tex...

Primary coordinator-facing screen for managing individual workshop sessions from creation through completion and archival. Displays session ...

Read-only screen presenting a chronological audit trail of all administrative actions performed within the organization scope. Displays acto...

Primary administrative interface screen providing a unified overview for organization administrators and global admins. Displays role-scoped...

Configuration management screen allowing administrators to adjust organization-level settings including branding, terminology labels, integr...

Screen for managing users within the administrator's organizational scope, including viewing user profiles, assigning or revoking roles, dea...

Full-screen interface that displays all organizations a user is a member of and allows switching the active organizational context. Shows me...

Compact widget displayed in the app shell header or profile area showing the currently active organization context with a dropdown to switch...

Slim contextual banner displayed at the top of activity registration and reporting screens to remind the user which organization context is ...

Admin screen for bulk-importing organizational structure from a CSV file, reducing manual data entry for large organizations like NHF with 1...

Detail view for a specific organizational unit showing its name, type, parent association, child count, assigned coordinators, and aggregate...

Reusable widget representing a single node in the organizational hierarchy. Displays the org unit name, type badge (national/region/local), ...

Full-screen view that renders the complete organizational hierarchy from national associations down to local associations. Uses a recursive ...

Utility widget that accepts a label key and renders the organization-specific string for that key. Falls back to the default value defined i...

Admin portal screen for configuring organization-specific terminology. Presents a form-based editor for all configurable label keys, allowin...

Displays full details of a single document including its type, upload date, expiry, signing status, access history, and associated peer ment...

Primary screen for viewing, uploading, and managing legal and medical documents such as powers of attorney, medical record summaries (epikri...

Reusable widget that embeds the document signing flow within the app, supporting both BankID-based e-signature (via Signicat or equivalent) ...

Handles file selection, camera capture, and metadata entry for uploading legal or medical documents. Validates file types and sizes before u...

A comprehensive Flutter widget library where every component — AppButton, AppTextField, navigation items, cards, and dynamic content — is wr...

A reduced-complexity navigation layout that limits simultaneous choices and surfaces only the most critical actions. Consumes the simplified...

A visible step progress indicator displayed in multi-step wizard flows to provide users with clear orientation within a process. Renders the...

Full-screen settings page where users configure font scale and contrast theme preferences. Displays live previews of each setting change bef...

Selection widget presenting three theme options — Standard, High Contrast, and Reduced Motion — each with a colour swatch preview. Validates...

Interactive slider widget that lets users choose a font scale factor between 85% and 200% of the base size. Renders a sample text block at t...

Displays the current sync status for all configured accounting integrations per organization. Shows last sync time, pending records, error c...

Admin UI widget that displays the health and status of member system synchronization per organization. Shows last sync timestamp, error coun...

Admin screen allowing HLF administrators to configure the boundary between the Likeperson app and the Dynamics-based 'Min Side' portal. Prov...

Scrollable list widget rendering peer mentor cards extended with coordinator-specific metadata such as last activity date, certification val...

Primary coordinator screen displaying a comprehensive list of all peer mentors and members within the coordinator's organizational scope. Re...

Multi-select filter chip bar allowing coordinators to filter the member list by availability status, certification validity, activity level,...

Main screen presenting pending activity registrations scoped to the coordinator's organizational hierarchy. Displays registrations requiring...

Confirmation dialog presented when a coordinator initiates a bulk approval action. Summarizes the count and breakdown of selected registrati...

Inline or modal editor allowing coordinators to perform field-level edits on submitted activity registrations. Requires a mandatory correcti...

Modal dialog for coordinators to provide a mandatory rejection reason when dismissing an invalid activity registration. Ensures rejected rec...

The primary navigation widget rendering five tabs — Home, Contacts, Add, Work, and Notifications — at the bottom of the screen. Built from d...

The top-level scaffold widget that wraps all tab branches using Flutter's StatefulShellRoute. It hosts the Bottom Navigation Bar, an AppBar ...

Reusable card widget that represents a single settings section or action item in the settings screen. Driven by design tokens for consistent...

Main settings screen accessible from the hamburger menu on all tabs. Displays logical card-based sections for notification settings, accessi...

A shared internal Flutter widget library (lib/shared/widgets) providing all common UI primitives — AppButton, AppTextField, page headers, mo...

Service Layer components contain business logic, orchestrate operations, and provide core application functionality.

Data Layer components manage data persistence, storage operations, and data access patterns throughout the application.

Infrastructure components provide foundational utilities, system integrations, and supporting functionality for the application.