Embed cutoff fix

[ncarazon]

This PR fixes the problem with label cutoff in embeds.

Before:

After:

Summary by CodeRabbit

Bug Fixes

• Fixed an issue with chart value label positioning where text could overflow beyond chart boundaries. The label placement logic has been improved to ensure all values remain properly constrained within the visible chart area, maintaining clean presentation and improving readability across various chart configurations.

[coderabbitai]

📝 Walkthrough

Walkthrough

A bounds-checking fix for the ChartValueBox component that clamps the adjustedX value when positioning value text, preventing horizontal overflow beyond the chart's right edge while preserving existing cursor and distribution chip behavior.

Changes

Cohort / File(s)	Summary
ChartValueBox Bounds Clamping front_end/src/components/charts/primitives/chart_value_box.tsx	Modified adjustedX calculation to apply Math.min() boundary clamp, ensuring value text does not overflow the chart's right edge by limiting position to chartWidth - textWidth / 2 - 2.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Suggested reviewers

• elisescu
• lsabor
• cemreinanc

Poem

🐰 A carrot-loving fix hops in with glee,
No more text that escapes the boundary!
With Math.min() we clamp with care,
The value box stays right where it should be there. ✨

🚥 Pre-merge checks | ✅ 2

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'Embed cutoff fix' directly relates to the main change: fixing label cutoff in embedded chart visualizations by clamping adjustedX values.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/embed-cutoff

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@front_end/src/components/charts/primitives/chart_value_box.tsx`:
- Around line 216-219: The right-side clamp currently uses textWidth (measured
from the chip label) which can allow the RESOLVED label to overflow when
hasResolution is true; update the clamp to base on the widest rendered label by
computing maxTextWidth = hasResolution ? Math.max(textWidth, resolvedLabelWidth)
: textWidth (use the actual variable name for the resolved label width in this
file), then replace textWidth in the Math.min expression with maxTextWidth so
the position calculation (using chartWidth, rightPadding, CHIP_OFFSET) prevents
overflow for either label.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: ac01a32e-0df3-4d36-b216-75a2ca6aa3b7

📥 Commits

Reviewing files that changed from the base of the PR and between b1ae2d9 and 955a635.

📒 Files selected for processing (1)

• front_end/src/components/charts/primitives/chart_value_box.tsx

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

Clamp against the widest rendered label, not just displayText.

This cap only uses textWidth, which is measured from the lower chip text. When hasResolution is true, the separate RESOLVED label above can still overflow on the right if it is wider than the chip value, so the embed cutoff is only partially fixed here. Please base the clamp on the max width of both rendered texts.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@front_end/src/components/charts/primitives/chart_value_box.tsx` around lines
216 - 219, The right-side clamp currently uses textWidth (measured from the chip
label) which can allow the RESOLVED label to overflow when hasResolution is
true; update the clamp to base on the widest rendered label by computing
maxTextWidth = hasResolution ? Math.max(textWidth, resolvedLabelWidth) :
textWidth (use the actual variable name for the resolved label width in this
file), then replace textWidth in the Math.min expression with maxTextWidth so
the position calculation (using chartWidth, rightPadding, CHIP_OFFSET) prevents
overflow for either label.

[github-actions]

Cleanup: Preview Environment Removed

The preview environment for this PR has been destroyed.

Resource	Status
🌐 Preview App	Deleted
🗄️ PostgreSQL Branch	Deleted
⚡ Redis Database	Deleted
🔧 GitHub Deployments	Removed
📦 Docker Image	Retained (auto-cleanup via GHCR policies)

---

Cleanup triggered by PR close at 2026-03-12T09:41:36Z