FX Rate Explorer: interactive rate comparison table#222
Draft
patcapulong wants to merge 10 commits intomainfrom
Draft
FX Rate Explorer: interactive rate comparison table#222patcapulong wants to merge 10 commits intomainfrom
patcapulong wants to merge 10 commits intomainfrom
Conversation
Add an interactive rate comparison table that lets prospects compare Grid's FX rates against competitors across popular corridors. - Rate Explorer snippet with fake data for USD, EUR, GBP corridors - Sample Rates page under Core Concepts - Full styling with dark mode and mobile responsive support Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Default state shows compact "Showing top 10 corridors" label instead of 12 chips. Chips only appear when the user customizes the selection. Also trims default corridors from 12 to 10 (drops SGD/HKD) and fixes missing --ls-green-400 CSS variable for dark mode advantage text. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Replace hardcoded rates with live data (Grid API → Coinbase fallback → hardcoded), remove competitor columns (Wise/Banks) and historical section, simplify table to Grid rate vs mid-market with spread %. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…-flags Redesign the rate explorer to match Figma specs: new "Send X to Y" header bar with currency chips, circle-flags via CDN, searchable currency dropdown with scroll-aware gradient masks, Grid delta column, full-width table layout, and mobile responsive breakpoints. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Remove unused flag emoji fields from CURRENCIES (circle-flags CDN replaced them), merge duplicate flag CSS classes, remove empty/redundant CSS rules, and standardize var→let/const throughout. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add skeleton shimmer rows while Grid rates load (40 rows matching corridor count) - Cache Grid live rates in sessionStorage (read via lazy useState initializer, no paint blocking) - Cache empty fallback on API failure to prevent repeated skeleton flashes - Use CSS mask-image for Grid icon (inherits text color, external SVG file) - Add currency code to delta column in amount-received mode - Remove dead SkeletonTable component and unused CSS from static skeleton experiments - Full-width layout marker div (#rate-explorer-page) remains for CSS :has() selectors Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add Stripe (FX + cross-border + fixed fee bps) and Airwallex (50/100 bps) as computed competitor columns from published pricing schedules - Add Avg Bank column from Wise API bank-type provider averages - Reduce dynamic provider columns from 3 to 2 - Wait for both live rates and competitor data before showing table - Replace generic skeleton bars with table-shaped skeleton (SkeletonTable) showing real column headers, currency rows with flags, and shimmer cells - Add StaticPlaceholder for zero-layout-shift first paint before React mounts - Override Mintlify's injected table styles (min-w-[150px], w-full, margins) - Hug-content column widths with width:1% trick Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…page Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
pengying
reviewed
Feb 24, 2026
| { code: 'DKK', name: 'Danish Krone', region: 'Europe', usdMid: 6.87, gridSpread: 0.3, wiseSpread: 0.55 }, | ||
| { code: 'SEK', name: 'Swedish Krona', region: 'Europe', usdMid: 10.45, gridSpread: 0.4, wiseSpread: 0.90 }, | ||
| { code: 'NOK', name: 'Norwegian Krone', region: 'Europe', usdMid: 10.55, gridSpread: 0.4, wiseSpread: 0.90 }, | ||
| { code: 'CZK', name: 'Czech Koruna', region: 'Europe', usdMid: 23.15, gridSpread: 0.45, wiseSpread: 0.95 }, |
Contributor
There was a problem hiding this comment.
do we need to hardcode these mid and spread values?
| export const flagUrl = (code) => | ||
| 'https://hatscripts.github.io/circle-flags/flags/' + (CURRENCY_TO_COUNTRY[code] || code.slice(0, 2).toLowerCase()) + '.svg'; | ||
|
|
||
| export const SOURCE_CODES = ['USD', 'EUR', 'GBP', 'CAD', 'SGD', 'HKD']; |
Contributor
There was a problem hiding this comment.
Should we start with USD, USDC? We don't support the other source currencies yet.
| export const BATCH_SIZE = 10; | ||
|
|
||
| export const getStripeFxBps = (source, dest) => { | ||
| const majorPairs = ['USD-EUR','USD-GBP','EUR-USD','GBP-USD','EUR-GBP','GBP-EUR']; |
Contributor
There was a problem hiding this comment.
where are you getting the stripe exchange rates?
| ); | ||
| })} | ||
| <td className={'rate-explorer-provider-cell' + (bestKey === 'BankAvg' ? ' rate-explorer-provider-best' : '')}> | ||
| {row.bankAvgBps !== null ? ( |
Contributor
There was a problem hiding this comment.
instead of bank average, can we pick a bank either Chase or BoA?
| }; | ||
|
|
||
| export const AIRWALLEX_MAJORS = ['USD','EUR','GBP','JPY','CHF','AUD','NZD','CAD','HKD','SGD','CNY']; | ||
| export const getAirwallexBps = (dest) => AIRWALLEX_MAJORS.includes(dest) ? 50 : 100; |
Contributor
There was a problem hiding this comment.
not sure if you want to get claude to make all of the requests but airwallex does provide a fx api https://www.airwallex.com/api/fx/fxRate/liveRate?sellCcy=USD&buyCcy=EUR
| return 200; | ||
| }; | ||
|
|
||
| export const STRIPE_CB_BPS = { |
Contributor
There was a problem hiding this comment.
maybe we can hide bridge from the amount received table since we can't get an accurate fx rate
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Test plan
/platform-overview/core-concepts/sample-rateswith globe icon in sidebar🤖 Generated with Claude Code