User Interface
124 components in the user interface layer
User Interface components handle presentation logic, user interactions, and visual elements of the application.
The password recovery screen that allows users to request a reset link by submitting their registered email address. It calls AuthService to...
The primary sign-in screen for peer mentors, coordinators, and organization admins on both the mobile app and admin portal. It renders email...
The account creation screen that collects new user credentials and profile information required to create a Meander account. It enforces pas...
Presents the BankID sign-in entry point on both web and mobile surfaces. Renders the "Sign in with BankID" button and initiates the redirect...
Presents the Vipps login entry point to the user, typically as a branded button or screen within the authentication flow. Initiates the OAut...
A native mobile UI widget that triggers the device biometric prompt (Face ID or fingerprint) when the user returns to the app. It handles th...
Guides users through passkey registration during onboarding or from account settings. Renders platform-native WebAuthn prompts and communica...
A dedicated screen shown to Global Admins who attempt to access the mobile app, informing them that mobile access is not permitted for their...
The entry screen rendered for authenticated users with the Coordinator role. It surfaces a team overview including pending approvals, active...
The entry screen rendered for authenticated users with the Peer Mentor role. It displays the mentor's own activity summary, upcoming schedul...
Centralized settings screen accessible from the hamburger menu that presents grouped configuration options for notifications, display, acces...
Displays the organization-configured list of external resource links to peer mentors and coordinators. Users can browse categorized links an...
A reusable UI widget that renders visible focus indicators on all interactive elements across the app. It enforces minimum contrast and size...
A wrapper widget that monitors focus events on designated sensitive form fields and displays a visible privacy warning overlay before screen...
The main in-app screen that presents available support contact options to peer mentors and coordinators. It renders either an email submissi...
A full-screen readable view that displays the platform's privacy policy document to mobile app users. Accessible both pre-authentication (fo...
A read-only mobile screen that displays the platform's formal accessibility conformance statement. It presents WCAG 2.2 AA compliance detail...
Displays a searchable, categorized list of frequently asked questions and answers within the Help & Support area of the mobile app. Users ca...
Editable form screen that allows peer mentors and coordinators to update their personal information. Uses inline validation with actionable ...
Read-only profile view screen accessible from the hamburger menu. Displays the current user's personal information and organization-relevant...
A mobile UI widget that displays the user's available organizational profiles and role contexts, allowing them to select and switch between ...
The primary screen for recording a peer mentor interaction with a contact. Presents smart defaults (today's date, 30-minute duration) so mos...
The root wizard container that manages overall multi-step navigation state and progress tracking. It renders the correct step screen based o...
The first wizard step screen that allows the user to select which contact (care recipient) the activity is being registered for. It presents...
The second wizard step screen that captures the date and start time of the activity. It presents accessible date and time picker controls op...
The third wizard step screen that captures how long the activity lasted. It offers preset duration options (such as 30 minutes, 1 hour) alon...
The final wizard step screen that presents a read-only summary of all data collected in the previous steps before the user confirms submissi...
Settings screen that allows peer mentors and coordinators to connect and manage external calendar integrations. Users can authorize calendar...
An embedded widget that peer mentors activate after an interaction to dictate activity notes verbally. It displays recording state, live tra...
A mobile UI widget that allows peer mentors to select files from the device file system or capture photos via camera for attachment to activ...
Structured post-visit form screen covering all required reporting domains including health status, course interest, assistive equipment situ...
Paginated directory screen displaying all contacts within the authenticated user's scope. Role-filtered views ensure peer mentors see only t...
Dedicated search input component supporting lookup by name and other configured identifiers. Emits query events consumed by the parent scree...
Full-profile view screen for an individual contact, displaying demographics, case notes, linked activities, and the caregiver section in a s...
Structured edit flow screen that presents validated field widgets for updating a contact's information, enforcing data quality at input time...
An embedded widget displayed within the contact detail screen that renders structured caregiver and next-of-kin relationship fields. It allo...
A mobile dashboard screen that displays a peer mentor's own activity history, contribution metrics, and impact summaries. It renders charts ...
Displays aggregated activity statistics for all peer mentors within the coordinator's local association. Presents period-over-period compari...
A dedicated inbox screen that displays the full history of push notifications received by the authenticated user. Users can review, filter, ...
Full-screen settings interface exposing per-category toggles for push, email, and SMS notification channels. Renders current preference stat...
A multi-step wizard screen that guides peer mentors and coordinators through creating a new event within the Meander Mobile App. Each wizard...
Mobile screen that renders a chronological list of upcoming and past events for the logged-in user based on their role and organisation cont...
Displays full event information including title, date, time, duration, location, and description to peer mentors. Renders the sign-up and ca...
Inline selector component that loads and displays the coordinator's managed peer mentor roster. Supports search and selection of a single pe...
Full-screen form allowing a coordinator to submit an activity on behalf of a selected peer mentor. Presents the same activity fields as the ...
The primary screen that allows coordinators to select multiple peer mentors and enter shared activity details in a single form. It renders a...
A summary widget displayed after a bulk registration submission, showing which records were created successfully and which failed. It groups...
Mobile screen that allows peer mentors to register travel-related expenses linked to an activity record. Supports entry of kilometer allowan...
Native camera and photo library picker widget embedded in the expense form. Displays a preview thumbnail of the captured or selected image a...
A mobile UI widget that renders the mutually exclusive expense type options for a single expense entry. It enforces mutual-exclusion rules b...
Mobile screen that presents the current versioned confidentiality declaration text to the peer mentor and captures their digital signature o...
Shows the full decrypted contents of a single assignment to the peer mentor after authentication, including recipient name, address, and med...
Displays the coordinator's list of all dispatched assignments with live status indicators showing delivery and read confirmations. Provides ...
A dashboard widget that displays each peer mentor's current confirmed assignment count alongside their threshold milestones (3rd and 15th). ...
Presents contextual consent prompts to peer mentors immediately before they access sensitive assignment data. Each prompt is scoped to a spe...
A mobile form screen that allows peer mentors and coordinators to register a new relative contact for a support case. It collects contact de...
An interactive widget embedded in the contact case detail view that displays linked relatives and allows a peer mentor or coordinator to sea...
A compact inline widget rendered on the relative record and linked case view that displays the current role tag and allows coordinators or p...
A mobile screen that allows peer mentors to toggle their active status to paused and back. It displays the current status prominently and pr...
A self-service UI control that allows a paused peer mentor to resume active status with a single action. It displays the mentor's current pa...
A notification widget that informs peer mentors and coordinators when an auto-pause has been triggered due to certification expiry. It displ...
The primary screen rendering the geographic map of peer mentor locations within an organization. It displays peer mentor pins on an interact...
A map overlay widget that renders open assignment locations alongside peer mentor positions on the coordinator map view. It provides proximi...
Shows full details for a single career workshop including schedule, participant list, session notes, and coordination actions. Coordinators ...
Displays the full list of career workshops available to the authenticated user, organized by upcoming and past sessions. Coordinators see ma...
A structured note-taking interface for coordinators and facilitators to create and edit notes tied to specific mentor workshops. Provides ri...
Displays the full participant list for a given workshop session, allowing coordinators to view registrations and mark attendance. Provides c...
Displays the to-do list associated with a specific workshop session, allowing coordinators and facilitators to view, add, and check off acti...
The primary screen that allows peer mentors to view, copy, and share their personalized invite link. It surfaces sharing options including n...
A self-contained widget that renders a QR code encoding the peer mentor's unique invite URL for in-person scanning. It supports full-screen ...
A dedicated dashboard screen that displays referral activity outcomes for peer mentors and coordinators. It surfaces invite link click count...
Presents full details of a selected course including description, prerequisites, schedule, and certification outcomes. Provides the entry po...
Displays a browsable catalog of available training courses for the authenticated user's organization. Supports filtering, searching, and sor...
Displays the peer mentor's digital certificate inside the mobile app, showing certification status, expiry date, and credential details. Pro...
Presents peer mentors with a Spotify Wrapped-style retrospective of their yearly contributions in a visually engaging, animated summary view...
Full-screen view displaying all badges a peer mentor has earned or can earn, organized into locked and unlocked states. Each badge tile show...
A compact inline widget that surfaces recently earned badges on the dashboard or activity summary screen. It shows the latest one to three b...
Displays the calculated impact breakdown for a peer mentor's volunteering activities. Presents metrics such as equivalent professional suppo...
Shows the full content of a single talking card, including its topic prompt, suggested conversation starters, and any supporting guidance fo...
Displays the organization's library of talking card categories and individual cards for peer mentors to browse during support interactions. ...
The primary screen for viewing and managing personal notes. Displays a searchable, scrollable list of notes linked to contacts or activities...
Full-screen editing interface for creating and updating notes within the Meander Mobile App. Renders a rich-but-simple text area with option...
The default landing page rendered after admin login in the Admin Web Portal. It composes KPI card widgets into a scannable grid layout and t...
A reusable presentational card that displays a single KPI metric with a label, current value, and optional trend indicator. It accepts a met...
A dashboard widget that renders a chronological stream of recent platform events for the authenticated admin. Items are grouped by recency (...
Provides a form for administrators to invite new users to the platform by entering an email address and assigning an initial role. On submis...
Presents full profile information for a single user account and allows administrators to edit fields, change role assignments, or permanentl...
Displays a paginated, searchable table of all users within the administrator's tenant. Provides quick-access actions for inviting new users,...
Admin UI widget for viewing and updating a user's role within a specific local association. Renders a role selector with current role pre-fi...
A contextual toolbar that appears above the user list when one or more accounts are selected. It exposes bulk deactivation and role reassign...
Administrative settings page where Org Admins configure their organization's core operational parameters. Renders editable forms for contact...
Admin-facing page that lists all overridable platform labels and allows per-organization remapping. Each term is shown alongside its default...
Administrative UI page that displays all available platform modules as toggleable switches for Organization Admins. Each toggle row shows th...
Displays and manages the layered organizational structure for NHF and similar organizations. Provides tree-based visualization of national, ...
Admin interface for managing a user's association memberships. Displays current associations, allows adding or removing memberships, and pro...
Administration page allowing Organization Admins to configure the connection between Meander's admin portal and HLF's Dynamics-based Min Sid...
The main admin page rendering the consolidated security posture view for the platform. It displays real-time metric panels for active sessio...
Displays a paginated, filterable table of audit log entries scoped to the current organization. Provides controls for filtering by date rang...
Administrative UI for organization and global admins to view and control active user sessions. Displays session list with device type, last ...
Admin Web Portal page that presents coordinators and administrators with a filterable queue of pending peer mentor activity submissions. Use...
An inline widget rendered within activity submission views that allows administrators and coordinators to attach concern flags to individual...
A dashboard widget displayed in the Admin Web Portal that surfaces high-confidence duplicate activity submissions for coordinator review. It...
Paginated coordinator/admin interface listing submitted expense claims awaiting review. Each row displays submitter name, expense type, amou...
Admin interface for creating, editing, and managing auto-approval rules within an organization. Displays all active rules in a list with con...
The administrator-facing dashboard page that displays aggregated expense activity across the organization. It renders summary totals, breakd...
Admin Web Portal page that displays structured team-level activity reports for coordinators and org admins. It renders aggregated metrics in...
Admin-only page in the Web Portal for generating and downloading Bufdir compliance reports. It provides date range selection, organization f...
A single-action button in the Admin Web Portal that triggers the Bufdir export process for a reviewed report. It displays export status feed...
Interactive page where org admins construct bespoke report queries by selecting dimensions, date ranges, and data fields. Renders a dynamic ...
Admin interface for triggering and downloading accounting data exports from the Admin Web Portal. Allows organization administrators to sele...
The above-the-fold hero section presenting Meander's core value proposition to prospective organizations. It displays a headline, supporting...
The root page component for the Meander sales website product landing page. It composes all landing page sections into a single cohesive lay...
A self-contained card component that presents a single platform capability in a visual, scannable format for prospective organizations. It d...
The top-level page that organizes and displays all platform capabilities grouped by area or benefit theme on the sales website. It assembles...
A static client-side page on the Sales Website that presents the impact calculator tool to prospective organizations. It renders input contr...
A static sales website widget that presents a side-by-side financial comparison between Meander platform costs and the implicit costs of man...
The interactive form component that collects contact and organization details from prospective customers. It validates input fields client-s...
The full-page layout for the demo booking section of the Meander Sales Website. It composes the BookingFormWidget within a branded page stru...
A dedicated post-submission page displayed after a demo request form is successfully submitted. It reassures the prospective organization th...
A publicly accessible static page rendering the full GDPR-compliant privacy policy document for Meander. It displays versioned legal content...
A publicly accessible static page on the Sales Website displaying the full Terms of Service document between Norse Digital Products and orga...
Renders the full text of the Data Processing Agreement as a structured, readable public page on the Sales Website. Displays all GDPR Article...
An interactive banner that appears on first visit and before any non-essential tracking scripts are loaded, allowing visitors to accept or r...
A static informational page that documents all cookies and tracking technologies used by the Meander Sales Website. It categorizes cookies b...
Other Component Types
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.