Add a tooltip to plots with long titles that are cut by Vega #4840
Conversation
| export const ZoomablePlotWrapper: React.FC< | ||
| PropsWithChildren<ZoomablePlotWrapperProps> | ||
| > = ({ title, id, children }) => { | ||
| const isTitleCut = title?.indexOf('…') === 0 |
There was a problem hiding this comment.
TIL we aren't doing this in code.
There was a problem hiding this comment.
no wait.... we are doing this in code but you can bypass because the id is the title, got it
| const isTitleCut = title?.indexOf('…') === 0 | ||
|
|
||
| return isTitleCut ? ( | ||
| <Tooltip content={id} placement="top" interactive> |
There was a problem hiding this comment.
Please confirm that having a tooltip in place does not break the ability to zoom the plot 🙏🏻
There was a problem hiding this comment.
It does not prevent from zooming the plot. There should also be a tooltip on the zoomed plot though. I'll add one there as well.
|
Thanks @sroy3 for addressing this so promptly. |
I can do a follow up for this. |
I feel like this would pollute the UI without adding any real value. Especially if all your plots have short titles. The tooltip appears instantly when hovering a plot with a title that's been cut off. It is a common UX pattern to hover to view missing information, I don't think people will feel lost about this. |
|
Code Climate has analyzed commit 35121fa and detected 0 issues on this pull request. The test coverage on the diff in this pull request is 100.0% (85% is the threshold). This pull request will bring the total coverage in the repository to 95.0% (0.0% change). View more on Code Climate. |
Demo
Screen.Recording.2023-10-16.at.11.47.41.AM.mov