Meshtastic-Android/core/ui
James Rich 85847e1144 refactor: Move common UI components to core:ui and add screenshot tests
Relocate messaging and node-related UI components from feature modules to the shared core:ui module to improve reusability across the project. Enable the screenshot testing plugin and add comprehensive baseline tests for shared components.

- **feature/messaging**: Move `MessageItem`, `MessageActions`, `MessageBubble`, and `Reaction` components to core:ui.
- **feature/node**: Move `NodeItem`, `NodeStatusIcons`, `InfoCard`, and `CooldownIconButton` to core:ui.
- **core/ui**: Add new screenshot tests for `MainAppBar`, `NodeItem`, `MessageItem`, and various common UI components.
- **build.gradle.kts**: Configure the screenshot testing plugin and dependencies for node and messaging feature modules.
- Update imports and references across the codebase to reflect relocated components.
2026-03-02 12:37:55 -06:00
..
src refactor: Move common UI components to core:ui and add screenshot tests 2026-03-02 12:37:55 -06:00
build.gradle.kts test: Add Compose screenshot testing support 2026-03-02 12:36:48 -06:00
detekt-baseline.xml feat(wire): migrate from protobuf -> wire (#4401) 2026-02-04 00:01:12 +00:00
README.md refactor(ui): compose resources, domain layer (#4628) 2026-02-23 03:39:50 +00:00

:core:ui

Overview

The :core:ui module contains shared Jetpack Compose components, themes, and utility functions used across the entire Meshtastic Android application. It ensures a consistent look and feel following Material 3 guidelines.

Key Components

1. Alert Dialogs (org.meshtastic.core.ui.component.AlertDialogs.kt)

  • MeshtasticDialog: The base dialog component for all alerts.
  • MeshtasticResourceDialog: Optimized for dialogs with resource-only content.
  • MeshtasticTextDialog: Optimized for dialogs with mixed resource and raw text content.

2. Common UI Elements

  • LastHeardInfo: Displays when a node was last seen.
  • TelemetryInfo: Displays battery, voltage, and other telemetry data.
  • TransportIcon: Shows the connection type (BLE, USB, TCP).
  • MainAppBar: The standard top app bar used in the app.

3. Preferences

Standardized Material 3 preference components for settings screens:

  • RegularPreference
  • SwitchPreference
  • DropDownPreference
  • SliderPreference
  • EditTextPreference

4. Utilities

  • ModifierExtensions.kt: Useful Compose Modifiers (e.g., conditional modifiers).
  • ProtoExtensions.kt: Extensions for mapping Protobuf models to UI-friendly strings or icons.

Usage

Most components are designed to be used with the Compose Multiplatform Resource library for strings.

import org.meshtastic.core.ui.component.MeshtasticResourceDialog
import org.meshtastic.core.resources.Res
import org.meshtastic.core.resources.ok

MeshtasticResourceDialog(
    title = Res.string.your_title,
    message = Res.string.your_message,
    onDismissRequest = { /* ... */ },
    confirmButtonText = Res.string.ok
)

Module dependency graph

graph TB
  :core:ui[ui]:::android-library
  :core:ui -.-> :core:common
  :core:ui -.-> :core:barcode
  :core:ui -.-> :core:nfc
  :core:ui -.-> :core:data
  :core:ui -.-> :core:database
  :core:ui -.-> :core:model
  :core:ui -.-> :core:prefs
  :core:ui -.-> :core:proto
  :core:ui -.-> :core:service
  :core:ui -.-> :core:resources

classDef android-application fill:#CAFFBF,stroke:#000,stroke-width:2px,color:#000;
classDef android-application-compose fill:#CAFFBF,stroke:#000,stroke-width:2px,color:#000;
classDef android-feature fill:#FFD6A5,stroke:#000,stroke-width:2px,color:#000;
classDef android-library fill:#9BF6FF,stroke:#000,stroke-width:2px,color:#000;
classDef android-library-compose fill:#9BF6FF,stroke:#000,stroke-width:2px,color:#000;
classDef android-test fill:#A0C4FF,stroke:#000,stroke-width:2px,color:#000;
classDef jvm-library fill:#BDB2FF,stroke:#000,stroke-width:2px,color:#000;
classDef kmp-library fill:#FFC1CC,stroke:#000,stroke-width:2px,color:#000;
classDef unknown fill:#FFADAD,stroke:#000,stroke-width:2px,color:#000;