fix: polish mobile Solana data dashboard

[h4rkl]

Problem

The Solana data dashboard needed mobile polish: the KPI summary was too dense on phone widths, and compact chart y-axis labels could clip on transaction-count charts. The branch also tightens dashboard provider/data handling so chart and KPI state is derived more consistently.

Summary of Changes

• Refactor provider normalization, selected-provider handling, and dashboard data parsing.
• Update the KPI summary grid to stack on phones, use two columns at small/tablet widths, and keep four columns on desktop.
• Increase compact chart left spacing so mobile y-axis labels like 300M are not clipped.
• Update dashboard tests for the provider/data behavior.

No linked issue.

---

Change classification (SDLC §2)

• Critical — auth, secrets/key handling, fund movement, deploy/CI
  security gates, or anything that changes who can do what
• Standard — production-facing, non-critical (features, API/route
  changes, dependency updates, monitoring/config)
• Low — no security impact (docs, tests, dev tooling, content)

Security checklist

• No secrets, tokens, or credentials in source, env files, or CI logs
  (use Doppler / NEXT_PUBLIC_* only for values safe to ship to the
  browser).
• Input from users or external services is validated before use; no
  dangerouslySetInnerHTML / unsanitized HTML on untrusted input.
• New or updated dependencies are justified below, and pnpm audit
  passes (no new High/Critical advisories).
• Errors are handled explicitly — no silent failures on production paths.
• For Critical changes: a trust-boundary / threat-model note is
  included below, and a second reviewer has been requested.

New dependencies: none.

Threat-model note for Critical changes: n/a.

Verification

• pnpm --dir apps/web exec eslint 'src/app/[locale]/data/solana-data-dashboard.tsx'
• pnpm --dir apps/web exec eslint 'src/app/[locale]/data/time-series-chart.tsx'
• pnpm -w exec prettier --ignore-path .prettierignore --check 'apps/web/src/app/[locale]/data/solana-data-dashboard.tsx'
• pnpm -w exec prettier --ignore-path .prettierignore --check 'apps/web/src/app/[locale]/data/time-series-chart.tsx'
• Playwright mobile checks at 390x844 with stubbed dashboard data for KPI stacking and transaction-count y-axis clipping.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
solana-com	Ready	Preview, Comment	Jun 22, 2026 8:12pm

5 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
solana-com-accelerate	Skipped		Jun 22, 2026 8:12pm
solana-com-breakpoint-2	Skipped		Jun 22, 2026 8:12pm
solana-com-docs	Skipped		Jun 22, 2026 8:12pm
solana-com-media	Skipped		Jun 22, 2026 8:12pm
templates	Skipped		Jun 22, 2026 8:12pm

[greptile-apps]

Greptile Summary

This PR replaces a hardcoded provider list with one derived dynamically from SQL row data, and polishes the mobile layout of the data dashboard and its charts.

• Provider refactor: providers constant and ChartDefinition.providers field are removed; getAvailableProviders derives the live provider list from API rows, and parseProviders / updateProvidersParam / getSelectedProviderList now all accept the dynamic list as a parameter. A getStableColorIndex hash provides consistent fallback colours for providers not in providerColors.
• Mobile KPI grid: Changed from 2→4 columns to 1→2→4 columns (mobile→sm→xl), with corrected border logic for each breakpoint.
• Chart compact margin: Introduces a separate margin for charts narrower than 768 px, reducing left/right/bottom padding slightly to give more drawing area on small screens.

Confidence Score: 5/5

Safe to merge; changes are additive UI/layout polish with a well-tested provider-derivation refactor that correctly handles pre-load, empty, and legacy-alias states.

All provider state flows correctly through the new dynamic derivation path — pre-load (empty availableProviders), post-load, URL round-trips, legacy alias normalization, and unknown-provider fallback are all tested. The KPI grid border logic is correct across all three breakpoints. The compact chart margin change is a targeted layout improvement with no broken rendering paths.

No files require special attention, though the compact chart left margin (52 px) is worth a quick visual confirmation against the PR description's claim of increased label space.

Important Files Changed

Filename	Overview
apps/web/src/app/[locale]/data/solana-data-dashboard.tsx	Major refactor: providers derived dynamically from SQL rows; provider/query state split into two hooks; KPI grid updated to stack on mobile with correct border logic across all three breakpoints.
apps/web/src/app/[locale]/data/data-config.ts	Removes hardcoded providers array and per-chart provider lists; ProviderName widened to string; providerColors key type updated; ChartDefinition.providers field dropped.
apps/web/src/app/[locale]/data/time-series-chart.tsx	Adds responsive margins keyed by rendered SVG width; compact view (≤767 px) uses tighter margins. Legend wrapper changed from grid to flex flex-col for better mobile layout.
apps/web/src/tests/components/data/solana-data-dashboard.test.ts	Tests updated to pass availableProviders to refactored helpers; new cases added for pre-load behaviour, getAvailableProviders, and getSelectedProviderList.

_{Reviews (2): Last reviewed commit: "fix: address data dashboard review feedb..." | Re-trigger Greptile}

[h4rkl]

Addressed the Greptile review notes in 2aca77f50:

• Footer provider label now preserves parsed provider params while SQL rows are still loading, avoiding the transient No providers selected state for URLs like /data?providers=Allium.
• Removed the useIsCompactViewport hook from time-series-chart.tsx; compact chart margin is now derived from the measured chart width, so mobile charts do not do an effect-driven margin shift.
• Added focused unit coverage for the provider-label loading behavior.

Verification:

• pnpm --dir apps/web exec vitest run src/__tests__/components/data/solana-data-dashboard.test.ts
• pnpm --dir apps/web exec eslint 'src/app/[locale]/data/solana-data-dashboard.tsx' 'src/app/[locale]/data/time-series-chart.tsx' 'src/__tests__/components/data/solana-data-dashboard.test.ts'
• pnpm -w exec prettier --ignore-path .prettierignore --check 'apps/web/src/app/[locale]/data/solana-data-dashboard.tsx' 'apps/web/src/app/[locale]/data/time-series-chart.tsx' 'apps/web/src/__tests__/components/data/solana-data-dashboard.test.ts'
• Playwright mobile probe at 390x844: pending footer includes ALLIUM, does not include NO PROVIDERS SELECTED, and transaction y-axis labels are not clipped.