• Stars
    star
    112
  • Rank 312,240 (Top 7 %)
  • Language
    TypeScript
  • License
    Apache License 2.0
  • Created over 3 years ago
  • Updated about 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

React Component for Swapping on the Serum DEX

@project-serum/swap-ui

Build Status npm

A reusable React component for swapping on the Serum DEX. The Solana program can be found here.

Usage

Install

First install the required peer dependencies into your React project.

yarn add @material-ui/core @material-ui/icons @material-ui/lab @project-serum/anchor @solana/spl-token-registry @solana/web3.js material-ui-popup-state react-async-hook

Then install the package.

yarn add @project-serum/swap-ui

Add the Swap Component

To embed the Swap component into your application, one can minimally provide an Anchor Provider and TokenListContainer. For example,

<Swap provider={provider} tokenList={tokenList} />

All of the complexity of communicating with the Serum DEX and managing its data is handled internally by the component.

Referral Fees

To earn referral fees, one can also pass in a referral property, which is the PublicKey of the Solana wallet that owns the associated token accounts in which referral fees are paid (i.e., USDC and USDT).

Developing

Install dependencies

yarn

Build

yarn build

Run the example app

For local development and educational purposes, a minimal React app is provided in the example/ subdirectory.

To run, change directories via cd example/ and start the app.

Start the app

yarn start