feat(client): show full error message on hover in analytics recent errors table - #489
Open
jasnoorgill wants to merge 1 commit into
Open
Conversation
Wrap the (already truncated) message cell in the portal HoverTooltip so the full error text is one hover/tap-focus away. No CSS changes — the existing truncate on the <td> still does the clipping.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
In the analytics Recent errors table, the message column was being
silently truncated by the existing
truncateclass on the<td>— operatorshad no way to read the rest of the error string when a single row contained a
multi-line or long upstream error. Wrap the cell content in the existing
portal
HoverTooltipso the full text is one hover (desktop) or tap-focus(mobile) away, while the visible cell continues to clip with
...exactlyas before.
Motivation
The
<td>already usestext-xs max-w-[200px] truncate, which is thecorrect and desired on-screen behaviour — long error strings should not
overflow into the timestamp column. But the truncation is a one-way gate:
the operator can't recover the rest of the message from the dashboard.
Operators working on a long-tail error investigation need to see the full
error string (e.g. to distinguish a Cloudflare 600s-edge truncation from a
genuine upstream 4xx). Today they have to read the SQLite
requeststabledirectly. A portal tooltip on the existing truncated cell closes the gap
without changing the table's layout or column proportions.
Changes
Single file, single cell, +3 / -1:
client/src/components/tooltip.tsx— the same portalTooltipalready imported as
HoverTooltipon line 12 ofAnalyticsPage.tsxandused elsewhere on the page (stat-card hints at line 143).
<td>'struncateclass still does the clipping;the
<span>rendered byHoverTooltipis the cell's only child, so theellipsis still fires correctly.
side="top"keeps the tooltip inside the visible viewport even when therow is in the bottom half of the
max-h-[240px]scrollable container.the
<span>(HoverTooltipalready bindsonFocus/onBlur), whichtriggers the same tooltip.
Why
HoverTooltipand not a popover libraryThe project doesn't have Radix / HeadlessUI / shadcn-popover installed.
Adding one would be a ~50KB dependency for a single tooltip use-case. The
in-tree
Tooltipcomponent is already used inAnalyticsPage.tsxandcovers the requirements (hover, focus, portal positioning, viewport clamp).
Test plan
cd client && npx tsc -b→TypeScript: No errors foundcd client && npm run build→✓ built in 11.18sgrep -oE 'max-w-\[200px\][^"]*truncate' client/dist/assets/index-*.jsreturns the expected pattern with
side:\top`andtext:e.error`.character error string now shows the first ~200 chars with
...andreveals the full string on hover (or tap-focus on mobile).
Compatibility
Client-only change, no server impact, no DB migration, no i18n string
added. Safe to backport. No public API surface change.
Notes
References operator session 2026-07-07. No upstream issue number yet —
happy to file one if requested.