LogoLogo
  • Entangle
    • Overview
    • Security Audits
  • Universal Interoperability Protocol
    • Overview
    • Architecture
      • Scalability and Network Stability
        • L2 Utility Blockchains
        • Transmitter Groups
      • Security and Consensus Mechanism
      • Finality
      • Execution Latency
      • Compatibility and Interoperability
    • Developer Guides
      • Getting Started
      • Solidity
        • Simple Abstract Messenger Example
        • Deploying Your Custom EVM Protocol
        • Bridging Tokens with UIP
        • Become an EVM Transmitter
      • Solana
        • Simple Abstract Messenger Example
        • Deploying Your Custom Solana Protocol
        • Become a Solana Transmitter
      • Calculate Cross-Chain Transaction Cost
      • Customizable Message Transmission Options
      • How to Debug Sent Messages
      • SDK Setup
      • Revenue Sharing for Transmitters
      • How to Become a Super Transmitter
    • Endpoints
  • Universal Data Feeds
    • Overview
    • Architecture
      • Data Delivery Methods
        • Pull Model
        • Push Model
      • Oracle Contract & User Interaction
    • Developer Guides
      • Custom Data Feeds
      • Fetch Data via Pull Model (PAYG)
        • EVM Smart Contracts
        • Solana Smart Contracts
      • Fetch Data via Pull Model (Subscriptions)
        • EVM Smart Contracts
        • Solana Smart Contracts
      • Fetch Data via Push Model
        • EVM Smart Contracts
        • Solana Smart Contracts
    • User Guides
      • Accessing Feeds
      • Subscribe to a Data Feed
      • Check Subscription
      • Manage Subscription
      • Renew Subscription
    • Data Endpoints
  • Universal Token Standard
    • Overview
    • Architecture
      • Fee Components
    • Developer Guides
      • Manual Deploy
        • Token Deployment Types
        • Create a Custom Token
        • Factory Blueprint Deployment
        • Examples
          • Initial Setup
          • UTS Connector
            • Mint & Burn Connector Scheme
            • Lock & Unlock Connector Scheme
            • Connector Over Native Currency
          • UTS Token
            • Simple Token
            • Token with Messages
      • Bridge SDK
      • Token Verification
      • Fees Calculation & Gas Estimation Logic
      • Estimations
    • User Guides
      • Launch Universal Token
      • Create a Liquidity Pool
      • Expand Existing Token
      • Transfer Liquidity to Connector
      • Bridging
    • Contract Addresses
  • Entangle Interoperable Blockchain
    • Overview
    • Architecture
    • Developer Guides
      • Set up a Validator Node
      • Delegating to Validators
      • Undelegating from Validators
      • Supported Accounts
  • More
    • Media Kit
    • FAQ
    • Report an Issue
    • Become a Partner
Powered by GitBook
On this page
  • Setup
  • Using the Bridge
  • How to Add a New Chain
  • File Structure
  • Contributing

Was this helpful?

Export as PDF
  1. Universal Token Standard
  2. Developer Guides

Bridge SDK

PreviousToken with MessagesNextToken Verification

Last updated 1 month ago

Was this helpful?

This 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).

Refer to this for an example bridge project.

Setup

After cloning the using SSH or HTTPS and opening it locally, following the below guide to complete setup.

1

Dependencies

install the necessary dependencies by running:

npm i
2

Blockchain Providers

You can configure your blockchain providers like so:

  1. Navigate to /blockchain/EVM/provider.ts.

  2. Set up your wagmi configuration and provide your project ID (Learn more here:):

const projectId = 'your project id';
  1. 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'),
  ...
};
3

Environment Variables

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.

Using the Bridge

  1. Navigate to /constants/tokens.ts:

    1. Add UTS tokens or connectors you want to bridge.

    2. Follow the TokenOption type to ensure compatibility.

  2. The bridge SDK supports 10 default chains, compatible with UTS:

    1. Ethereum, Mantle, BSC, Base, Arbitrum, Avalanche, Optimism, Polygon, CoreDAO, and XLayer.

    2. These chains are defined in SelectNetworkModal.tsx and filtered based on tokens in the TOKENS file.

How to Add a New Chain

To integrate a new chain, follow these steps:

  1. Add the network to Web3Manager (e.g., EVMManager for EVM chains).

  2. Add the network configuration to tokens.ts.

File Structure

  • .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 – Reusable components that are used in the whole app (like tabs and tables).

  • utils – Common utilities.

Contributing

For questions or support, please reach out via the issues section or contact the repository maintainers.

Contributions are welcome! If you’d like to contribute, please follow the guidelines and submit a pull request.

repository
repository
repository
Wagmi Connect Wallet Guide
repository