When an openHAB item carries an image state (e.g. a Chromecast thumbnail sent as a data:image/png;base64,… URI), the Items Explorer tooltip and state column display the full raw data string. This makes the value completely unreadable and bloats the UI — the tooltip becomes a wall of Base64 characters with no useful information visible at a glance.
Screenshot showing the current behaviour (extension v1.0.1-alpha):
Propose Feature
When the state of an item starts with data:image/ (or is otherwise detected as a data URI carrying image content), the Items Explorer should render a small inline image preview instead of the raw string. Concretely:
- In the tree-view label / description, replace the raw URI with a short, human-readable placeholder such as
[Image] or 🖼 <mime-type>.
- In the hover tooltip, embed an actual
<img> tag (Markdown image) so the user sees the thumbnail directly.
- Optionally, add a configuration option (e.g.
openhab.itemsExplorer.renderImageStates, default true) that lets users opt out of image rendering and fall back to the raw data string if they prefer.
Describe alternatives you've considered
- Truncate the string — show only the first N characters followed by
…. This avoids the bloat but still gives no visual context about what the image actually looks like.
- Copy-to-clipboard icon — provide a button to copy the raw URI without ever rendering it. Useful as a complementary action but does not solve the readability problem.
- Do nothing / keep raw data — acceptable for power users, but confusing for anyone who does not immediately recognise Base64 payloads.
Additional context
- Affected component:
client/src/ItemsExplorer/ (tree-view items and their state labels/tooltips).
- The detection heuristic should be cheap: a simple
state.startsWith('data:image/') check is sufficient for the common case; a more robust MIME check can be added later.
- A similar pattern is used in openHAB's own MainUI, which renders image items as thumbnails in the control panel.
- No community forum thread yet — this came up while testing the Chromecast binding whose
Thumbnail channel sends PNG frames as data URIs.
When an openHAB item carries an image state (e.g. a Chromecast thumbnail sent as a
data:image/png;base64,…URI), the Items Explorer tooltip and state column display the full raw data string. This makes the value completely unreadable and bloats the UI — the tooltip becomes a wall of Base64 characters with no useful information visible at a glance.Screenshot showing the current behaviour (extension v1.0.1-alpha):
Propose Feature
When the state of an item starts with
data:image/(or is otherwise detected as a data URI carrying image content), the Items Explorer should render a small inline image preview instead of the raw string. Concretely:[Image]or🖼 <mime-type>.<img>tag (Markdown image) so the user sees the thumbnail directly.openhab.itemsExplorer.renderImageStates, defaulttrue) that lets users opt out of image rendering and fall back to the raw data string if they prefer.Describe alternatives you've considered
…. This avoids the bloat but still gives no visual context about what the image actually looks like.Additional context
client/src/ItemsExplorer/(tree-view items and their state labels/tooltips).state.startsWith('data:image/')check is sufficient for the common case; a more robust MIME check can be added later.Thumbnailchannel sends PNG frames as data URIs.