Skip to main content

Socket Plugin

warning

Socket Plugin will be replaced soon by BungeeLite. Please refrain from using Socket Plugin in new projects.

Introduction​

Socket’s PlugIn (widget) is a React component that can be easily imported in any React (JS/TS) project. The widget supports most features from Bungee.exchange. It brings the seamless bridging UX from Bungee to any DApp! Users choose their sending chains/tokens, receiving chains/tokens & enter the sending amount and receive the most optimum route for bridging.

Integrating the widget into any DApp is easy & takes only a few minutes! Integrators need to pass the provider from user’s connected wallet & Socket’s API_KEY as props to the widget component. [Optional props] can be passed to customize the widget’s color scheme, pre-select the chains/tokens & also customize token lists.

PlugIn also supports same chain swaps in additional to cross-chain swaps and also supports Refuel out of the box!

The NPM package can be found here :

@socket.tech/plugin

The widget supports the following features

  • The widget supports all chains, DEXs & Bridges supported by Socket
  • Shows Swap+Bridge routes and Swap+Bridge(Source)+Swap(Destination) routes. This enables bridging of a wide variety of tokens between supported chains.
  • Users can preview the full bridging route before initiating their transaction
  • Pending transaction history is stored in local storage and highlighted on the UI until the txs complete.
  • Allows users to sort routes by 3 sort properties
    • High Return, Fastest, Low Gas Fee

Requirements :​

Web3 Provider :​

The Web3 provider initialised from the user’s connected wallet is required to be passed as a prop to the widget’s <Bridge /> component to fetch user balances & send transactions. The widget is compatible with providers from most popular libraries such as Web3js, Ethers.js, Web3-react & so on.

API Key :​

The <Bridge /> component requires Socket’s API_KEY to be passed as a prop. A .env file with the API_KEY needs to be initialised in the root of the project. Socket’s public API_KEY can be used for testing. For access to a dedicated API_KEY with higher request limits, fill in this form. We’ll get back to you via email ASAP.

Version compatibility :​

The widget is compatible with React v18+ and Node v14+.