🎨 Palette: Pulse heartbeat & accessible status icons on Telemetry Dashboard - #28
google-labs-jules[bot] wants to merge 1 commit into
Conversation
… telemetry dashboard
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
| status_str = Text("🟢 SUCCESS", style="bold green") | ||
| elif level == "RETRY": | ||
| status_str = Text("RETRYING", style="bold yellow") | ||
| status_str = Text("🔄 RETRYING", style="bold yellow") | ||
| elif level == "CRITICAL": | ||
| status_str = Text("CRITICAL", style="bold red") | ||
| status_str = Text("🚨 CRITICAL", style="bold red") | ||
| else: | ||
| status_str = Text("PROCESSING", style="bold blue") | ||
| status_str = Text("🔵 PROCESSING", style="bold blue") |
There was a problem hiding this comment.
🟡 Two of the status badges look identical to color-blind users
The success and processing rows are marked with two circle symbols that differ only by color (Text("🟢 SUCCESS") and Text("🔵 PROCESSING") at termux-multi-agent/dashboard.py:127-133), so the very users the change targets still cannot tell these two states apart.
Impact: Color-blind users viewing the dashboard can confuse completed work with in-progress work.
Shape-identical emoji pair defeats the stated WCAG 1.4.1 goal
The PR's goal is to satisfy WCAG 2.1 SC 1.4.1 (Use of Color) by pairing color with distinct shapes. 🚨 and 🔄 are shape-distinct, but 🟢 (green circle) and 🔵 (blue circle) are the same glyph shape rendered in different hues; when hue perception is impaired, the only remaining differentiator is the word itself, which is what the emoji was supposed to reinforce. Using a shape-different glyph for one of them (e.g. ✅ for SUCCESS or ▶/⏳ for PROCESSING) restores the multi-dimensional signal. tests/test_dashboard_ux.py:75,90 assert on the current glyphs and would need updating.
| status_str = Text("🟢 SUCCESS", style="bold green") | |
| elif level == "RETRY": | |
| status_str = Text("RETRYING", style="bold yellow") | |
| status_str = Text("🔄 RETRYING", style="bold yellow") | |
| elif level == "CRITICAL": | |
| status_str = Text("CRITICAL", style="bold red") | |
| status_str = Text("🚨 CRITICAL", style="bold red") | |
| else: | |
| status_str = Text("PROCESSING", style="bold blue") | |
| status_str = Text("🔵 PROCESSING", style="bold blue") | |
| status_str = Text("✅ SUCCESS", style="bold green") | |
| elif level == "RETRY": | |
| status_str = Text("🔄 RETRYING", style="bold yellow") | |
| elif level == "CRITICAL": | |
| status_str = Text("🚨 CRITICAL", style="bold red") | |
| else: | |
| status_str = Text("⏳ PROCESSING", style="bold blue") |
Was this helpful? React with 👍 or 👎 to provide feedback.
| is_on = int(time.time()) % 2 == 0 | ||
| pulse_dot = "●" | ||
| pulse_style = "bold green" if is_on else "dim green" |
There was a problem hiding this comment.
📝 Info: Heartbeat driven by wall-clock parity can occasionally skip a beat
The pulse state is derived from int(time.time()) % 2 while the render loop uses time.sleep(1.0) plus rendering overhead (termux-multi-agent/dashboard.py:160-163). Because each iteration advances slightly more than one second, two consecutive renders will occasionally land on the same parity, so the dot appears to freeze for ~2s before resuming. This is cosmetic and self-correcting, so not flagged as a bug, but a monotonic frame counter (or 0.5s sleep) would give a steadier heartbeat.
Was this helpful? React with 👍 or 👎 to provide feedback.
| # Beautiful styled status tag with distinct emojis for color-blind accessibility (WCAG 2.1 compliant) | ||
| if level == "SUCCESS": | ||
| status_str = Text("SUCCESS", style="bold green") | ||
| status_str = Text("🟢 SUCCESS", style="bold green") | ||
| elif level == "RETRY": | ||
| status_str = Text("RETRYING", style="bold yellow") | ||
| status_str = Text("🔄 RETRYING", style="bold yellow") | ||
| elif level == "CRITICAL": | ||
| status_str = Text("CRITICAL", style="bold red") | ||
| status_str = Text("🚨 CRITICAL", style="bold red") | ||
| else: | ||
| status_str = Text("PROCESSING", style="bold blue") | ||
| status_str = Text("🔵 PROCESSING", style="bold blue") |
There was a problem hiding this comment.
🔍 Emoji column width and terminal font support
The added emojis are double-width glyphs. Rich accounts for east-asian/emoji widths when sizing the Status column, so alignment should hold, but Termux terminals with fonts lacking these glyphs will render tofu boxes, and some emoji presentations vary in width across terminals. Worth a quick visual check on the target Termux font before merge.
Was this helpful? React with 👍 or 👎 to provide feedback.
| with patch("os.path.exists", return_value=True), \ | ||
| patch("builtins.open", mock_open(read_data=mock_data)): |
There was a problem hiding this comment.
📝 Info: Test patches os.path.exists globally
patch("os.path.exists", return_value=False) and patch("builtins.open", mock_open(...)) are applied process-wide for the duration of the block. Anything invoked inside (rich internals, importlib) would also see the stubs. It works here because make_dashboard does no other file I/O, but patching dashboard.os.path.exists / dashboard.open would be safer and less brittle. Note also that mock_open only supports line iteration on Python 3.8+, which read_latest_telemetry relies on.
Was this helpful? React with 👍 or 👎 to provide feedback.
💡 What:
Added a live-pulse "heartbeat" indicator (
● LIVE) in the header that toggles between green and dim-green every second, and enriched colored status tags with distinct scannable emojis (🟢 SUCCESS, 🚨 CRITICAL, 🔄 RETRYING, 🔵 PROCESSING).🎯 Why:
♿ Accessibility:
Introduced multi-dimensional visual indicators (emojis) alongside status colors to optimize scanning and readability for color-blind individuals.
PR created automatically by Jules for task 823741540797873999 started by @timerloggedout-spec