Skip to content

fix: BarChart a11y focus, StatCard sparkline currency, dynamic mock feed, and Tabs aria-controls - #807

Merged
chonilius merged 1 commit into
MergeFi:mainfrom
Prudentdev-xyz:fix/707-708-709-710-a11y-feed-fixes
Oct 17, 2026
Merged

chonilius merged 1 commit into
MergeFi:mainfrom
Prudentdev-xyz:fix/707-708-709-710-a11y-feed-fixes

Conversation

@Prudentdev-xyz

Copy link
Copy Markdown
Contributor

Summary

This pull request resolves four accessibility and data-freshness issues across BarChart, StatCard, mock activity feeds, and Tabs:

  1. BarChart focusable elements in aria-hidden subtree (BarChart's bars are focusable (tabIndex=0) inside an aria-hidden container #708):

    • Dropped tabIndex={0} and focus-visible styles from visual bars inside the aria-hidden="true" container to eliminate axe's aria-hidden-focus rule violation.
    • Sighted mouse users can reveal tooltips on hover, while assistive technology reads the structured, visually-hidden data table.
  2. StatCard sparkline announcements for currency cards (StatCard's sparkline announces raw numbers (e.g. '1234.5') for currency cards #709):

    • Passed formatValue derived from format, asset, and locale (formatValue(v, format, asset, locale).display) into Sparkline.
    • Cards with currency values now announce properly formatted and localized numbers (e.g. "$8,420.00" / "8,420 USDC") instead of raw numbers ("8420").
    • Cleaned up duplicate imports and declarations in StatCard.tsx.
  3. Mock activity feed timestamp anchoring (Mock activity timestamps are anchored at module load, so a long-running server shows the 'live' feed hours or days stale #707):

    • Introduced getRecentActivity() to compute relative activity timestamps dynamically at request/call time rather than freezing them at initial module load.
    • Added a dynamic proxy export for recentActivity so existing consumers and tests receive live timestamps regardless of how long the server process has been running.
  4. Tabs missing tabpanel ID reference (Tabs reference an inactive tab's tabpanel id that doesn't exist in the DOM #710):

    • Updated Tabs to omit aria-controls on inactive tabs (aria-controls={isActive ? \tabpanel-${tab.key}` : undefined}`).
    • Resolves ARIA reference errors when consumer components only mount the active panel in the DOM.

Related Issues

Closes #707
Closes #708
Closes #709
Closes #710

…eed, and Tabs aria-controls

- Drop tabIndex={0} on BarChart visual bars inside aria-hidden container to resolve axe aria-hidden-focus violation (closes MergeFi#708)
- Pass formatValue derived from format/asset/locale to Sparkline in StatCard so currency trend values are properly announced (closes MergeFi#709)
- Dynamically compute mock activity timestamps at call/request time via getRecentActivity and dynamic proxy export so long-running servers don't show stale feeds (closes MergeFi#707)
- Omit aria-controls on inactive tabs in Tabs component to eliminate missing tabpanel reference errors (closes MergeFi#710)
@vercel

vercel Bot commented Oct 17, 2026

Copy link
Copy Markdown

@Prudentdev-xyz is attempting to deploy a commit to the chonilius' projects Team on Vercel.

A member of the Team first needs to authorize it.

@drips-wave

drips-wave Bot commented Oct 17, 2026

Copy link
Copy Markdown

@Prudentdev-xyz Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@chonilius
chonilius merged commit b2f529c into MergeFi:main Oct 17, 2026
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment