Use Material3 for Assist conversation - #7281
Conversation
There was a problem hiding this comment.
Pull request overview
This PR modernizes the Assist bottom sheet conversation UI to align with the app’s Material3/HA design system components, replacing the legacy Material2-based implementation and adding screenshot coverage for key states.
Changes:
- Replaced the legacy
AssistSheetView(Material2ModalBottomSheetLayout) with a newAssistSheetbuilt onHAModalBottomSheetand HA theme tokens. - Added screenshot tests covering multiple Assist sheet states (voice/text, multi-server pipelines, error, blocked, long conversation).
- Updated Assist activity theming and changelog entries to reflect the UI modernization.
Reviewed changes
Copilot reviewed 6 out of 48 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| app/src/main/kotlin/io/homeassistant/companion/android/assist/ui/AssistSheet.kt | New Material3/HA-themed Assist bottom sheet implementation (header, conversation list, input controls). |
| app/src/main/kotlin/io/homeassistant/companion/android/assist/ui/AssistSheetView.kt | Removed legacy Material2-based Assist sheet UI. |
| app/src/main/kotlin/io/homeassistant/companion/android/assist/AssistActivity.kt | Switched to HATheme and updated to use AssistSheet. |
| app/src/main/kotlin/io/homeassistant/companion/android/assist/AssistViewModel.kt | Adjusted exposed conversation list to hide input placeholder during active voice recording. |
| app/src/screenshotTest/kotlin/io/homeassistant/companion/android/assist/ui/AssistSheetScreenshotTest.kt | Added screenshot tests for the updated Assist sheet UI across multiple states. |
| app/src/main/res/xml/changelog_master.xml | Added changelog entries noting Assist conversation screen modernization (mobile + automotive). |
| var showPipelineList by remember { mutableStateOf(false) } | ||
| val showServerName = remember(pipelines) { pipelines.distinctBy { it.serverId }.size > 1 } | ||
|
|
jpelgrom
left a comment
jpelgrom
left a comment
There was a problem hiding this comment.
The sheet has the app title when opened from outside the app, can you add a screenshot test for that?
jpelgrom
left a comment
jpelgrom
left a comment
There was a problem hiding this comment.
The dialog was originally modelled after the frontend's design. I'm assuming you have talked to product and/or design to verify deviating from it is OK. It does look a bit more fresh and modern :)
No Compose screen test for behavior?
| import io.homeassistant.companion.android.common.compose.theme.HAThemeForPreview | ||
| import io.homeassistant.companion.android.util.compose.HAPreviews | ||
|
|
||
| class AssistSheetScreenshotTest { |
There was a problem hiding this comment.
It would be nice to have tests highlighting
- pipeline without STT option (different icon)
- text entered changes the icon on the end to submit instead of switching to microphone mode
- active voice input with the ripple
| // Animate each bubble in once, when it first appears in the conversation. | ||
| // In inspection mode (previews and screenshot tests) start visible, otherwise the static | ||
| // frame would capture the bubble before it animated in. | ||
| val startVisible = LocalInspectionMode.current | ||
| val enterTransition = remember { MutableTransitionState(startVisible).apply { targetState = true } } | ||
| AnimatedVisibility( | ||
| visibleState = enterTransition, | ||
| enter = fadeIn(tween(BUBBLE_ENTER_DURATION_MS)) + | ||
| slideInVertically(tween(BUBBLE_ENTER_DURATION_MS)) { it / 2 }, | ||
| modifier = modifier, | ||
| ) { |
There was a problem hiding this comment.
I like the idea of this animation but testing it on device it looks bugged, with the previous messages blinking up and down shortly after submitting.
Summary
This PR is a simple update of the UI of Assist bottom sheet to look more aligned with the rest of the app.
Checklist
Select exactly one option that describes AI usage in this contribution:
Screenshots