Skip to content

Add real-time MEV refund metrics to navbar #623

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Add real-time MEV refund metrics to navbar #623

wants to merge 2 commits into from

Conversation

odysseus0
Copy link
Collaborator

Summary

  • Add MEV refund metrics widget component that displays real-time data from Dune Analytics
  • Integrate widget into the navbar to show MEV and gas refund values
  • Replace hardcoded mock values with live data from the production API

Changes

  1. New MEV metrics widget component (src/components/MevMetrics.tsx)

    • Fetches data from https://refund-metrics-dune-api.vercel.app/api/metrics
    • Shows loading state while fetching
    • Falls back to mock data on errors
    • Displays values formatted as "X.XX ETH"

  2. Navbar integration

    • Added custom navbar item type support
    • Configured widget to appear in navbar between docs/API links and GitHub link

Testing

  • Tested locally with yarn start
  • Widget successfully displays live data: MEV Refund: 403.64 ETH, Gas Refund: 751.80 ETH
  • Error handling verified by blocking API requests
  • No CORS issues when fetching from the API

Screenshots

Widget displaying in navbar:

Flashbots | Docs | API | Refund | MEV: 403.64 ETH | Gas: 751.80 ETH | GitHub

🤖 Generated with Claude Code

odysseus0 and others added 2 commits July 10, 2025 19:03
@odysseus0 @claude
feat: add MEV refund metrics widget component
d403366 
Add a new React component that fetches and displays real-time MEV and gas refund
metrics from the Dune Analytics API. The widget shows loading states and falls
back to mock data on errors.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@odysseus0 @claude
feat: integrate MEV metrics widget into navbar
8ce8f6d 
Add custom navbar item type to support the MEV metrics widget and configure
it in the navbar. The widget displays real-time MEV and gas refund data
fetched from the Dune Analytics API.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@vercel Vercel
Copy link

vercel bot commented Jul 11, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
flashbots-docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 11, 2025 2:04am

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@sketsdever sketsdever Awaiting requested review from sketsdever sketsdever is a code owner

@zeroXbrock zeroXbrock Awaiting requested review from zeroXbrock zeroXbrock is a code owner

@sukoneck sukoneck Awaiting requested review from sukoneck sukoneck is a code owner

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@odysseus0