lhumina_code/home
21
0
Fork 0
Code Issues 10 Pull requests Projects Releases Packages Wiki Activity Actions

AI Assistant UX: auto-scroll + transcription status cleanup #84

New issue
Closed
opened 2026-03-23 23:04:06 +00:00 by mik-tf · 3 comments
mik-tf commented 2026-03-23 23:04:06 +00:00
Owner
Copy link

Fixed in v0.7.5-dev

1. Auto-scroll to latest message

Problem: New messages appear below the fold — user must scroll manually.
Root cause: getElementById and scrollTop don't work inside Dioxus shadow DOM.
Fix: Render a sentinel div at the bottom of the message list, use scrollIntoView({behavior:'smooth',block:'end'}) which works inside shadow DOM. 50ms delay lets Dioxus finish rendering.

2. "Transcribing..." stuck after voice input

Problem: After successful voice transcription, the help text stays "Transcribing..." forever.
Root cause: Help text was only reset on error paths, not on success.
Fix: Reset to default text immediately after successful transcription + 3s fallback timeout catches any stuck state.

Files changed

  • intelligence/ai/src/views/message_list.rs — sentinel div + scrollIntoView
  • intelligence/ai/src/views/input_area.rs — reset help text on success

Remaining (deferred to #78)

  • Read aloud / speaker button — requires server-side TTS via WebSocket
  • Wake word on Firefox — requires Rustpotter server-side

Signed-off-by: mik-tf

## Fixed in v0.7.5-dev ### 1. Auto-scroll to latest message **Problem**: New messages appear below the fold — user must scroll manually. **Root cause**: `getElementById` and `scrollTop` don't work inside Dioxus shadow DOM. **Fix**: Render a sentinel `div` at the bottom of the message list, use `scrollIntoView({behavior:'smooth',block:'end'})` which works inside shadow DOM. 50ms delay lets Dioxus finish rendering. ### 2. "Transcribing..." stuck after voice input **Problem**: After successful voice transcription, the help text stays "Transcribing..." forever. **Root cause**: Help text was only reset on error paths, not on success. **Fix**: Reset to default text immediately after successful transcription + 3s fallback timeout catches any stuck state. ### Files changed - `intelligence/ai/src/views/message_list.rs` — sentinel div + scrollIntoView - `intelligence/ai/src/views/input_area.rs` — reset help text on success ### Remaining (deferred to #78) - Read aloud / speaker button — requires server-side TTS via WebSocket - Wake word on Firefox — requires Rustpotter server-side Signed-off-by: mik-tf
mik-tf commented 2026-03-23 23:21:08 +00:00
Author
Owner
Copy link

Deployed in v0.7.5-dev. Auto-scroll via web_sys onmounted, Transcribing text reset. Tests 20/20.

Signed-off-by: mik-tf

Deployed in v0.7.5-dev. Auto-scroll via web_sys onmounted, Transcribing text reset. Tests 20/20. Signed-off-by: mik-tf
mik-tf commented 2026-03-24 00:06:49 +00:00
Author
Owner
Copy link

Status: Transcribing text fixed, auto-scroll still broken

Fixed

  • "Transcribing..." text resets after successful voice input
  • Error bar has readable text + × dismiss button

Still broken: auto-scroll

Three approaches tried:

  1. document.getElementById — can't reach inside shadow DOM
  2. document::eval with scrollIntoView sentinel — eval runs in wrong JS scope
  3. web_sys::Element::set_scroll_top via onmounted — timing issue: effect fires before DOM update completes

Next fix: use request_animation_frame before set_scroll_top to ensure DOM is painted. This is pure web_sys (web_sys::window().request_animation_frame()). Bundled into #78.

Signed-off-by: mik-tf

## Status: Transcribing text fixed, auto-scroll still broken ### Fixed - "Transcribing..." text resets after successful voice input - Error bar has readable text + × dismiss button ### Still broken: auto-scroll Three approaches tried: 1. `document.getElementById` — can't reach inside shadow DOM 2. `document::eval` with `scrollIntoView` sentinel — eval runs in wrong JS scope 3. `web_sys::Element::set_scroll_top` via `onmounted` — timing issue: effect fires before DOM update completes **Next fix**: use `request_animation_frame` before `set_scroll_top` to ensure DOM is painted. This is pure web_sys (`web_sys::window().request_animation_frame()`). Bundled into #78. Signed-off-by: mik-tf
mik-tf commented 2026-03-25 20:52:54 +00:00
Author
Owner
Copy link

Complete in v0.7.1-dev: double-rAF + setTimeout auto-scroll (tracks streaming content length), trackbar with pause/play/stop, play/stop media controls in toolbar.

Signed-off-by: mik-tf

Complete in v0.7.1-dev: double-rAF + setTimeout auto-scroll (tracks streaming content length), trackbar with pause/play/stop, play/stop media controls in toolbar. Signed-off-by: mik-tf
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
development
main
No results found.
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
lhumina_code/home#84
No description provided.