RefuelX

RefuelX is a crosschain gas aggregator that enables users to top up native gas on any blockchain using any token from any chain, powered by Avail Nexus SDK.

Today, users often face the frustrating issue of running out of native gas on another chain — they have USDC on Arbitrum but need ETH on Arbitrum, or MATIC on Polygon but want to transact on Base. RefuelX eliminates that friction by allowing users to simply choose: • a source chain and token (e.g., Arbitrum + USDC), • a destination chain and address (e.g., Arbitrum wallet), and in one click, RefuelX executes the full crosschain operation to deliver the target chain’s native gas token.

Under the hood, RefuelX leverages Avail Nexus SDK’s Bridge & Execute functionality to simulate and execute crosschain intents. The app first uses simulateBridgeAndExecute() to fetch real-time quotes, routes, fees, and estimated completion times. Once confirmed, it triggers bridgeAndExecute() to automatically bridge liquidity, convert to the destination chain’s native asset, and send it directly to the target wallet — all non-custodially.

The frontend, built with React + Tailwind + Nexus Widgets, provides a clean, animated user interface for selecting chains and tokens, viewing cost simulations, and tracking transaction status. This unified interface demonstrates how Avail Nexus can simplify and power seamless multi-chain user experiences across any ecosystem.

RefuelX was built as a fully client-side, non-custodial dApp using React, TypeScript, TailwindCSS, and the Avail Nexus SDK (@avail-project/nexus-core and @avail-project/nexus-widgets).

The frontend handles all logic, connecting the user’s wallet via Rainbowkit, and exposing a clean interface for choosing: • source chain & token, • target chain & address, • and refuel amount.

Once the user clicks “Refuel,” RefuelX calls simulateBridgeAndExecute() from the Nexus Core SDK to fetch the best route, estimated gas fees, and latency. The simulation data is then displayed in the UI before confirming. After confirmation, the dApp triggers bridgeAndExecute() — which uses Avail Nexus’ unified intent layer to bridge liquidity and execute token swaps across chains in one atomic transaction.

The app also uses @avail-project/nexus-widgets for UI-level components such as BridgeAndExecuteButton and TransactionStatus, enabling live feedback (Pending → Executing → Completed) without reimplementing the status logic. This saved time and ensured a consistent experience with the Nexus ecosystem.

All transaction data is stored in ephemeral state; we avoided backend servers entirely to maintain decentralization.

Overall, Avail Nexus SDK allowed us to abstract away complex multi-bridge interactions and focus on a delightful UX. Without Nexus, implementing seamless crosschain refueling with on-demand simulation would have required multiple bridges, routers, and custom RPC pipelines — now it’s a few SDK calls and a clean React flow.