feat(dashboard): add a tooltip displaying chart descriptions - #43271
Conversation
This reverts commit 35aaeb6.
Code Review Agent Run #9c27b2Actionable Suggestions - 0Additional Suggestions - 1
Review Details
Bito Usage GuideCommands Type the following command in the pull request comment and save the comment.
Refer to the documentation for additional commands. Configuration This repository uses Documentation & Help |
✅ Deploy Preview for superset-docs-preview ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
The flagged issue is correct. Using Here is the suggested fix for {slice.description && !isExpanded && (
<Popover
trigger={['hover', 'click']}
content={<SliceInfo slice={slice} />}
placement="leftBottom"
>
<Icons.InfoCircleOutlined
iconSize="m"
aria-label={t('Chart description')}
data-test="chart-description-info-icon"
/>
</Popover>
)}I have checked the PR comments, and there are no other comments to address at this time. Would you like me to perform any further checks or implement additional changes? superset-frontend/src/dashboard/components/SliceHeader/index.tsx |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #43271 +/- ##
=======================================
Coverage 66.66% 66.66%
=======================================
Files 2873 2874 +1
Lines 163654 163662 +8
Branches 37771 37773 +2
=======================================
+ Hits 109093 109101 +8
Misses 52432 52432
Partials 2129 2129
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
Code Review Agent Run #97a83cActionable Suggestions - 0Review Details
Bito Usage GuideCommands Type the following command in the pull request comment and save the comment.
Refer to the documentation for additional commands. Configuration This repository uses Documentation & Help |
|
@SBIN2010 for the tooltips we may want to make sure there are translations for them too. |
@sadpandajoe The tooltip displays the chart description; I don't think it will need translation. |
|
I've been really looking forward to this feature! Being able to add descriptions to charts and show them as tooltips on dashboards would be incredibly useful. Do you have an estimated timeline for when this feature might be merged and included in a Superset release? |
There was a problem hiding this comment.
Pull request overview
This PR adds a chart-description tooltip on dashboard slice headers, so users can quickly read a chart’s description while the chart description panel is collapsed.
Changes:
- Add a
SliceInfopopover content component that rendersslice.descriptionviaSafeMarkdown. - Show an info icon in
SliceHeader(when a description exists and the description panel is collapsed) that opens aPopoverwithSliceInfo. - Add unit tests for both the new
SliceInfocomponent and the SliceHeader icon visibility conditions.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| superset-frontend/src/dashboard/components/SliceHeader/SliceInfo.tsx | New popover content component rendering chart description as safe markdown. |
| superset-frontend/src/dashboard/components/SliceHeader/SliceInfo.test.tsx | New unit tests validating SliceInfo rendering and edge cases (empty/long markdown). |
| superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx | Adds tests for when the description info icon should appear/disappear. |
| superset-frontend/src/dashboard/components/SliceHeader/index.tsx | Adds a Popover + info icon trigger in the slice header controls when a description exists and is collapsed. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Code Review Agent Run #a04a89Actionable Suggestions - 0Additional Suggestions - 1
Review Details
Bito Usage GuideCommands Type the following command in the pull request comment and save the comment.
Refer to the documentation for additional commands. Configuration This repository uses Documentation & Help |
SUMMARY
This PR adds a tooltip for charts on the dashboard, displaying the description if one has been provided for the chart.
BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
TESTING INSTRUCTIONS
run test:
npm run test superset-frontend/src/dashboard/components/SliceHeader/SliceHeader.test.tsx
ADDITIONAL INFORMATION