[Feature]: Redesign Activity Log — iconography, density, health events, detail view

[tashda]

What problem does this solve?

The current Activity Log is hard to scan, visually monotonous, and surfaces mostly noise. Concrete issues visible in today's UI:

Activity list:

• Identical thumbnails on every row. Almost every event renders as the same blue circle with sync arrows and a tiny device thumbnail badge. State changes, link-quality drifts, system events, and bridge events all look the same. Visual differentiation is lost — the list is a wall of blue circles.
• The "engine" / system row uses a totally different gray icon with a chat-bubble glyph. Inconsistent with everything else, sticks out for the wrong reason.
• Redundant time stamps. Each row shows both 13:32:34 and 37 sec. The absolute time is overkill on a row that just happened, and when many rows share the same 37 sec (because they were all triggered by one drift tick) the column adds noise instead of clarity.
• Dominated by Link Quality fluctuations. Link Quality: 245 → 244 is signal noise, not actionable info. It crowds out anything genuinely interesting (mode changes, availability transitions, occupancy).
• No health data or check-ins. The log only renders changes, so battery devices that quietly check in once an hour, or devices that go online/offline, leave no trace. The log feels lifeless because it under-reports what's actually happening on the network.

Detail view ("State Change" screen):

• Apr 28 at 13:33:34 with a blue (i) icon at the top looks like a system alert banner, not a header for the event being viewed. The date treatment is rough.
• Generic title "State Change" doesn't tell the user what changed.
• Cryptic IDLE card. The middle card with a thermometer icon and the word IDLE next to a black bar is unreadable without context — what state? What value?
• Diff display is inconsistent. Humidity 30% → 30,7 (the bottom row) is the right pattern; the IDLE card above it is the wrong pattern. Apply one diff style everywhere.

What would you like Shellbee to do?

Full redesign of the Activity Log — list, detail view, and event coverage — in one cohesive pass.

1. Type-specific iconography (drop the generic blue badge)

Replace the blue-circle-with-sync-arrows with category-specific iconography:

Event type	Icon / treatment
State change (light on/off, switch, sensor reading)	The device's actual thumbnail/photo from the device card, not a generic badge
Link Quality drift	Signal-strength icon (e.g. wifi.exclamationmark or dot.radiowaves.left.and.right)
Availability transition (online ↔ offline)	Green/red status dot, or circle.fill tinted by state
Battery report	Battery glyph at appropriate fill level
Device joined / left / interview	Plus / minus / spinner icons matching Devices screen
Bridge event (cycle, log, permit join)	Bridge/hub icon — distinct from device-related rows
Engine / system	A subtle system icon, but redesigned so it stops looking like a stray chat bubble

Use the device's actual thumbnail wherever possible. The user already learned what their devices look like on the Devices screen — reuse that visual language here.

2. List density and time formatting

• Drop the absolute time from rows by default. Show only relative time (37 sec, 2 min, 1 h). Tap the row to see absolute time in the detail view.
• Group rows under section headers by time bucket: Just now, A minute ago, Earlier today, Yesterday, Apr 27. Mirrors Mail / Messages and lets the eye chunk.
• Coalesce events when the same device emits the same kind of event multiple times in quick succession. e.g. five LQI drifts in 30 s become one row labeled "Link Quality drifted 5 times".

3. Hide LQI noise by default

Link Quality drift (245 → 244) is the dominant event type and almost never actionable. Hide LQI-only events from the Activity tab by default. Add a filter chip / setting "Show signal changes" to opt back in. When shown, coalesce consecutive LQI changes from the same device into one row.

4. Add health and check-in events (new event sources)

The Activity Log should reflect what's happening on the mesh, not only what's changing. Add new event types:

• Availability transitions — online → offline and back. Already a Z2M MQTT topic (<device>/availability or bridge/event); surface them in the log.
• Periodic check-ins for battery devices — when a sleepy device wakes and reports, log a "Checked in" event with the timestamp. Even when its values haven't changed, knowing it pinged is valuable signal.
• Battery level reports — log when a device reports its battery level (especially when it crosses thresholds: 50%, 25%, 10%).
• Bridge connection events — Z2M bridge online/offline transitions (separate from individual devices), permit-join open/close.
• Interview / OTA milestones — already partially covered; ensure consistent rendering.

5. Detail view redesign

• Header: drop the alert-style "(i) Apr 28 at 13:33:34" treatment. Use the standard nav title + a subtitle: State Change · Apr 28, 13:33:34. Or move the date into the device card row as muted secondary text.
• Title: make it specific to the event — Humidity changed, Came online, Battery report, Link quality drifted — instead of generic State Change.
• Drop the cryptic IDLE card. If a value is empty/null, render the same key: prev → next row pattern used by Humidity at the bottom. Don't render a special card with no value.
• Apply the key: prev → next pattern uniformly to every changed field. The Humidity row at the bottom of the detail view is the right baseline.

Does the Z2M web frontend already do this?

Partially. The Z2M web frontend has a logs view but mobile users have different needs — quick visual scan, category recognition, less verbose. Mirror Z2M's terminology for event types where applicable, but the layout is Shellbee-specific.

Alternatives you've considered

• Targeted tweaks only (fix the icon, fix the date) — leaves the underlying scanability problem untouched. The list stays a wall of identical blue circles.
• Splitting into multiple issues — visual redesign, detail view, and health events depend on each other (the detail view needs to know about new event types; the iconography needs the new categories). One issue keeps the design coherent.
• Adding a Settings toggle for "verbose mode" — risk: bloats a settings screen with a preference that a sensible default makes irrelevant. Hide LQI by default with a single in-screen filter chip is enough.