style: use text-violet-500 instead of hardcoded hex color

[dylantarre]

Summary

• Replace hardcoded text-[#8B5CF6] with text-violet-500 in chart components
• Aligns with existing usage of bg-violet-500 in tooltip legends within the same components

Context

Both overview-chart.tsx and analytics-timeseries-chart.tsx use the same violet color in two places:

1. Chart series: colorClassName: "text-[#8B5CF6]" (hardcoded)
2. Tooltip legend: bg-violet-500 (proper token)

Since #8B5CF6 is exactly Tailwind's violet-500, this PR makes the codebase consistent.

Files changed

• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/overview-chart.tsx
• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/analytics-timeseries-chart.tsx

Closes #3312

---

Found using Buoy - design system drift detection

Summary by CodeRabbit

• Style
  • Updated color styling in analytics and overview charts to use standardized color classes for consistency.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

@dylantarre is attempting to deploy a commit to the Dub Team on Vercel.

A member of the Team first needs to authorize it.

[CLAassistant]

All committers have signed the CLA.

[coderabbitai]

📝 Walkthrough

Walkthrough

Hardcoded hex color values (#8B5CF6) in two chart components are replaced with the equivalent Tailwind color token (text-violet-500) to achieve design system consistency and eliminate duplication.

Changes

Cohort / File(s)	Summary
Chart Component Color Standardization apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/overview-chart.tsx, apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/analytics-timeseries-chart.tsx	colorClassName property updated from hardcoded hex text-[#8B5CF6] to Tailwind token text-violet-500 in chart series configurations

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Suggested reviewers

• steven-tey

Poem

🐰 A rabbit hops through colors bright,
"Let's make our palette unified and right!"
From hex to tokens, clean and neat,
Design consistency—what a treat! ✨
Violet-500 shines, so true!

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title clearly and specifically describes the main change: replacing hardcoded hex color with Tailwind token across the affected components.
Linked Issues check	✅ Passed	The PR successfully addresses all coding requirements from issue #3312: both files have the hardcoded text-[#8B5CF6] replaced with text-violet-500.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to issue #3312 requirements; only color class updates in the two specified chart components with no unrelated modifications.

✨ Finishing touches

• 📝 Generate docstrings

---

📜 Recent review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7b733a9 and 3662740.

📒 Files selected for processing (2)

• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/analytics-timeseries-chart.tsx
• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/overview-chart.tsx

🧰 Additional context used

🧠 Learnings (1)

📚 Learning: 2025-10-15T01:05:43.266Z

Learnt from: steven-tey
Repo: dubinc/dub PR: 2958
File: apps/web/app/app.dub.co/(dashboard)/[slug]/settings/members/page-client.tsx:432-457
Timestamp: 2025-10-15T01:05:43.266Z
Learning: In apps/web/app/app.dub.co/(dashboard)/[slug]/settings/members/page-client.tsx, defer refactoring the custom MenuItem component (lines 432-457) to use the shared dub/ui MenuItem component to a future PR, as requested by steven-tey.

Applied to files:

• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/analytics-timeseries-chart.tsx
• apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/overview-chart.tsx

🔇 Additional comments (2)

apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/analytics/analytics-timeseries-chart.tsx (1)

37-37: LGTM! Consistent use of design tokens.

Replacing the hardcoded hex color with text-violet-500 improves maintainability and aligns perfectly with the tooltip legend's bg-violet-500 usage on line 50.

apps/web/app/app.dub.co/(dashboard)/[slug]/(ee)/program/overview-chart.tsx (1)

165-165: LGTM! Consistent use of design tokens.

The change from hardcoded hex to text-violet-500 maintains consistency with the tooltip legend's bg-violet-500 on line 178 and improves design system adherence.

---

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.}

[steven-tey]

@dylantarre Great catch, thank you!