feat: funkit checkout integration for Core-market supplies (#3010)

[sammdec]

See #3010 for original PR

What

Routes Supply for 4 allowlisted assets (USDC, USDT, WBTC, cbBTC) on the Core mainnet market through the funkit checkout modal, letting users supply from any EVM asset or fiat. All other assets/markets keep the native Aave supply flow.

How

Integration architecture

• FunkitCheckout — ssr:false modal host mounted once in _app next to the app's other modal hosts (SupplyModal etc.). Owns the single useFunkitCheckout instance; per-asset configs are passed at call time via beginCheckout(configOverride). Reuses the app's wagmi + react-query + ConnectKit (no funkit wallet stack). Honors the SDK's onLoginFinished resume contract by replaying it once ConnectKit connects.
• funSupplyBridge — module-level imperative bridge across the client-only island boundary (@funkit/connect is browser-only ESM; the app pre-renders/static-exports). The island registers beginSupply on mount; Supply buttons invoke it at click time. Clicks before the chunk loads fall back to the native modal instead of dropping.
• useSupplyButtonAction — single shared click handler for all 3 Supply list-item variants; gates on isFunSupplyAsset(currentMarket, underlyingAsset).

Data sourcing — no integrator-owned copies

• The only hardcoded data is FUN_SUPPLY_UNDERLYINGS: a 4-address allowlist Set — purely the product decision of which assets route through fun checkout.
• Receipt-token metadata (aToken address, real on-chain symbol aEthUSDC, decimals, hosted icon) comes from app state: useAppDataContext().supplyReserves (@aave/react SDK reserves whose aToken/underlyingToken are Currency objects) — the same source AddTokenDropdown renders on reserve-overview. Display fields (symbol, APY, collateral state) come from the clicked dashboard reserve; pool address from currentMarketData.
• Gated on CustomMarket.proto_mainnet_v3 (not chainId): mainnet hosts three markets (Core/Prime/EtherFi) and e.g. USDC exists in all three with different aTokens and pools. Prime/EtherFi supplies of the same underlyings stay native. If SDK market data hasn't loaded at click time, the click falls back to the native modal.

Add-to-wallet icon parity

The native flow's wallet icon is generated, not hosted: Base64Token wraps the underlying's local SVG in Aave's gradient TokenRing and base64-encodes it. Fun-routed supply rows mount the same hidden generator via the shared useFunSupplyATokenIcon hook (the AddTokenDropdown pattern) and pass the data URI through the click payload — ready at row mount, never delays beginCheckout. The SDK's hosted aToken.imageUrl is the fallback for a click that beats generation.

Zero-balance behavior

fun-routed assets always render in "Assets to supply" and keep an enabled Supply button at 0 wallet balance (users can pay with any asset/fiat). Protocol-level blocks (inactive/frozen/paused/capped) still disable.

Styling shim

funkitPreflight.css — a zero-specificity (:where()) slice of Tailwind preflight scoped under funkit's [data-rk] portal root. @funkit/connect implicitly relies on host Tailwind preflight (its production hosts are Tailwind apps) for form-control font inheritance and img { max-width: 100% }; this app is MUI/emotion. Without it the amount-input digits render in system font at weight 400 and host-supplied icons paint at intrinsic size.

Compat

• patches/@funkit+connect+9.18.0.patch — React 18 forwardRef shim for funkit's React 19 ref-as-prop components (patch-package, wired via postinstall).
• .yarnrc ignore-engines — @solana/addresses (transitive) requires node ≥20.18 while the repo targets node 18; browser-only code, engines gate is install-only.

Not in scope (flagged for follow-up)

• Reserve-overview page Supply button (ReserveActions.tsx) and SuppliedPositions "supply more" buttons still go native — product decision pending.
• Permit toggle for the Aave native-supply fast path: tracked internally at fun.xyz (ENG-4068).
• funkit SDK: lazy addToWalletToken.iconSrc resolver (consume-time semantics) would remove the begin-time icon coupling for all integrators.

Test plan

• Core market: Supply USDC/USDT/WBTC/cbBTC from dashboard → funkit modal opens immediately, themed correctly (light+dark), amount input renders in Inter at correct weight
• Modal shows "You receive … aEthUSDC" (SDK-sourced ticker) with the ringed aToken icon
• Checkout complete: destination row shows 15px Aave icon; "Add aEthUSDC to your balance" registers the gradient-ringed icon in MetaMask with no symbol-mismatch warning
• Prime/EtherFi markets: Supply USDC → native Aave modal
• Non-allowlisted assets: native modal
• Empty wallet on Core: 4 fun assets visible with enabled Supply buttons
• Disconnected: Supply click opens ConnectKit

🤖 Generated with Claude Code

[github-actions]

Dependency Review

The following issues were found:

• ❌ 1 vulnerable package(s)
• ⚠️ 20 packages with OpenSSF Scorecard issues.

View full job summary

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
interface	Ready	Preview, Comment	Jun 15, 2026 6:23pm

[github-actions]

• Ipfs hash: bafybeiheu4jx7mkbd2weu5wglvjjlqxcqg33552zmypvzxy3q5ustr5coa
• Ipfs preview link: https://bafybeiheu4jx7mkbd2weu5wglvjjlqxcqg33552zmypvzxy3q5ustr5coa.ipfs.cf-ipfs.com/

[github-actions]

📦 Next.js Bundle Analysis for aave-ui

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
global	1.29 MB (🟡 +35.47 KB)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

Eleven Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
/	80.67 KB (🟡 +13.63 KB)	1.37 MB
/bridge	37.98 KB (-3 B)	1.33 MB
/dashboard	70.31 KB (🟡 +13.62 KB)	1.36 MB
/faucet	15.05 KB (🟡 +5 B)	1.3 MB
/governance	90.01 KB (-3 B)	1.38 MB
/governance/v3/proposal	133.73 KB (-1 B)	1.42 MB
/history	36.33 KB (-1 B)	1.33 MB
/markets	39.71 KB (🟡 +1 B)	1.33 MB
/reserve-overview	39.3 KB (🔴 +13.61 KB)	1.33 MB
/safety-module	41.54 KB (-1 B)	1.33 MB
/v3-migration	37.74 KB (🟡 +19 B)	1.33 MB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

[github-actions]

• Ipfs hash: bafybeidfaw2vsmbbvvdkur4jfik5p6etcug4c6njvt3czzt55igpym6rcu
• Ipfs preview link: https://bafybeidfaw2vsmbbvvdkur4jfik5p6etcug4c6njvt3czzt55igpym6rcu.ipfs.cf-ipfs.com/

[github-actions]

📦 Next.js Bundle Analysis for aave-ui

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
global	1.29 MB (🟡 +35.47 KB)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

Eleven Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
/	80.67 KB (🟡 +13.63 KB)	1.37 MB
/bridge	37.98 KB (-3 B)	1.33 MB
/dashboard	70.31 KB (🟡 +13.62 KB)	1.36 MB
/faucet	15.05 KB (🟡 +5 B)	1.3 MB
/governance	90.01 KB (-3 B)	1.38 MB
/governance/v3/proposal	133.73 KB (-1 B)	1.42 MB
/history	36.33 KB (-1 B)	1.33 MB
/markets	39.71 KB (🟡 +1 B)	1.33 MB
/reserve-overview	39.3 KB (🔴 +13.61 KB)	1.33 MB
/safety-module	41.54 KB (-1 B)	1.33 MB
/v3-migration	37.74 KB (🟡 +19 B)	1.33 MB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this.

[github-actions]

• Ipfs hash: bafybeih7tk3ou6kflstmdwn7r374v7zo7zw4ejn7prnrlxibyazjv6mliu
• Ipfs preview link: https://bafybeih7tk3ou6kflstmdwn7r374v7zo7zw4ejn7prnrlxibyazjv6mliu.ipfs.cf-ipfs.com/

[github-actions]

📦 Next.js Bundle Analysis for aave-ui

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
global	1.29 MB (🟡 +37.72 KB)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

Eleven Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load
/	80.67 KB (🟡 +13.63 KB)	1.37 MB
/bridge	37.98 KB (-3 B)	1.33 MB
/dashboard	70.31 KB (🟡 +13.62 KB)	1.36 MB
/faucet	15.05 KB (🟡 +5 B)	1.31 MB
/governance	90.01 KB (-3 B)	1.38 MB
/governance/v3/proposal	133.73 KB (-1 B)	1.42 MB
/history	36.33 KB (-1 B)	1.33 MB
/markets	39.71 KB (🟡 +1 B)	1.33 MB
/reserve-overview	39.3 KB (🔴 +13.61 KB)	1.33 MB
/safety-module	41.54 KB (-1 B)	1.33 MB
/v3-migration	37.74 KB (🟡 +19 B)	1.33 MB

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

Next to the size is how much the size has increased or decreased compared with the base branch of this PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this.