fix: update chart container layout cp-7.74.0#29023
Conversation
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
| 'paneProperties.bottomMargin': 9, | ||
| 'paneProperties.topMargin': 12, | ||
| 'paneProperties.bottomMargin': 8, | ||
| }); |
There was a problem hiding this comment.
- Increased
paneProperties.topMarginfrom 8 to 12 using TradingView's documented auto-scaling margin API. This gives the topmost price grid line label more room within the pane. - Set
paneProperties.bottomMarginto 8 (previously 9). The margins are now applied consistently in both the widget constructor and theme overrides.
| right: 0; | ||
| top: 16px; | ||
| bottom: 0; | ||
| inset: 0; |
There was a problem hiding this comment.
#chart_surface now fills the full WebView (inset: 0 instead of top: 16px). The previous 16px top inset was reserving space for crosshair pill headroom but reduced the canvas area available to TradingView. Removing it gives the chart the full height passed from React Native.
| } | ||
|
|
||
| // this data draws a placeholder chart to show a greyed out chart when there is no data available | ||
| export const placeholderData = [ |
There was a problem hiding this comment.
cleanup this is no longer used
| {chartHasData && !isLoading ? <EndDot /> : null} | ||
| </AreaChart> | ||
| {chartHasData ? ( | ||
| <AreaChart |
There was a problem hiding this comment.
AreaChart is only rendered when data exists. The no-data empty state is handled entirely by NoDataOverlay, which renders its own SVG placeholder
🔍 Smart E2E Test Selection
click to see 🤖 AI reasoning detailsE2E Test Selection:
Why no E2E tags are needed:
Performance Test Selection: |
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 7307d7d. Configure here.
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #29023 +/- ##
==========================================
- Coverage 82.26% 82.20% -0.07%
==========================================
Files 5055 5055
Lines 133121 133233 +112
Branches 29795 29830 +35
==========================================
+ Hits 109518 109521 +3
- Misses 16173 16281 +108
- Partials 7430 7431 +1 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
Description
Improves the TradingView Advanced Chart layout on the token details screen so that price scale tick labels are better positioned and less likely to appear clipped on certain tokens.
Changelog
CHANGELOG entry: Improved advanced chart layout to reduce price scale label clipping on the token details screen
Related issues
Fixes:
Manual testing steps
Screenshots/Recordings
Before
After
Pre-merge author checklist
Performance checks (if applicable)
trace()for usage andaddTokenfor an exampleFor performance guidelines and tooling, see the Performance Guide.
Pre-merge reviewer checklist
Note
Low Risk
UI/layout-only chart rendering changes with minimal logic impact; main risk is visual regressions in empty/loading chart states across devices.
Overview
Improves token detail chart layout to reduce clipped/awkward price-scale labels, primarily by letting the TradingView WebView surface fully fill its container and tweaking pane top/bottom margins.
Simplifies the legacy
PriceChartempty-state behavior by not rendering placeholder chart/gradient when data is insufficient, and disabling pan handlers unless real chart data is present; also removes unusedplaceholderDataand trims related SVG imports. Separately removesoverflow-hiddenfrom the advanced price chart wrapper so chart chrome/labels aren’t clipped.Reviewed by Cursor Bugbot for commit 7307d7d. Bugbot is set up for automated code reviews on this repo. Configure here.