This repository provides everything you need to integrate the Web3 Bridge into your frontend application. The bridge supports multiple chains and tokens, offering seamless interoperability for Universal Token Standard (UTS).
After cloning the repository using SSH or HTTPS and opening it locally, install the necessary dependencies by running:
npm i
-
Navigate to
/blockchain/EVM/provider.ts
. -
Set up your wagmi configuration and provide your project ID:
const projectId = 'your project id';
Learn more here: Wagmi Connect Wallet Guide.
-
Update the
transports
variable to use your custom RPC endpoints for different chains. By default, they are set to public RPCs, which may not be reliable:export const transports = { [mainnet.id]: http('https://ethereum-rpc.publicnode.com'), [mantle.id]: http('https://mantle-rpc.publicnode.com'), [bsc.id]: http('https://bsc-rpc.publicnode.com'), ... };
-
In
/core/Coin/CoinRepository/CoinRepository.ts
, ensure you provide the required environment variables:NEXT_PUBLIC_COINGECKO_API_KEY=your API KEY NEXT_PUBLIC_BASE_MESSAGES_URL=your GraphQL endpoint
NEXT_PUBLIC_COINGECKO_API_KEY
: Used to fetch USD prices for native currencies, essential for calculating bridge fees.NEXT_PUBLIC_BASE_MESSAGES_URL
: GraphQL endpoint for tracking the history of bridge operations.
-
Navigate to
/constants/tokens.ts
:- Add UTS tokens or connectors you want to bridge.
- Follow the
TokenOption
type to ensure compatibility.
-
The bridge SDK supports 10 default chains, compatible with UTS:
- Ethereum, Mantle, BSC, Base, Arbitrum, Avalanche, Optimism, Polygon, CoreDAO, and XLayer.
These chains are defined in
SelectNetworkModal.tsx
and filtered based on tokens in theTOKENS
file.
To integrate a new chain, follow these steps:
- Add the network to
Web3Manager
(e.g.,EVMManager
for EVM chains). - Update the chain details in
networks.ts
. - Add the network configuration to
tokens.ts
.
.husky
– Git hooks for the repository..next
– Next.js build folder.api
– GraphQL API calls.app
– Next.js app router directory for pages.blockchain
– Blockchain logic, including providers, hooks, and ABIs.containers
– Reusable container components.core
– Redux layers.- Actively uses RTK; transitioning to RTK-query.
helpers
– Utility functions and helpers.hooks
– Common application hooks.lib
– Third-party libraries used in the project.providers
– React contexts and providers.public
– Public assets folder.scripts
– Service scripts (e.g., Cosmos blockchain interactions).ui
–components
: All UI components.
utils
– Common utilities.
Contributions are welcome! If you’d like to contribute, please follow the repository guidelines and submit a pull request.
For questions or support, please reach out via the issues section or contact the repository maintainers.