@huskyfinance/eth-sorbet
TypeScript icon, indicating that this package has built-in type declarations

0.1.15 • Public • Published

eth-sorbet

Codacy Badge NPM

Smooth transition to L2, just like sorbet before main course


Winners of Arbitrum 🏆 and Optimism 🏆 for ETHGlobal Scaling Ethereum 2021 Hackathon

Live Demo

eth-sorbet is a react component that improves DApp users' onboarding experience to L2 networks or sidechains.

When a user lands on the DApp, it will bring up a series of screens that guides the users to switch to the L2 network that the developer selected. Users will no longer need to manually enter the L2 network configs in their wallets and can make deposits and interact with the L2 networks right away.

Alt Welcome screen in eth-sorbet eth-sorbet saves you from managing user onboarding!

Alt Switching networks in eth-sorbet We handle wallet RPC calls to add network for users, instead of asking your users to do that manually.

Install

npm install --save @huskyfinance/eth-sorbet

Usage

See example for more detailed usage guide.

import React, { Component } from 'react'

// import modal and target network config
import { Sorbet, xDai } from '@huskyfinance/eth-sorbet'

// load css
import '@huskyfinance/eth-sorbet/dist/index.css'

const provider = window.ethereum

const config = {
  targetNetwork: xDai,
  dappName: 'Example App',

  open: isOpen,
  handleClose: handleClose,

  // optional

  // the user address to check their balance.
  address: userAddress,

  // logo of your app
  dappLogo: 'https://www.kkbox.com/about/img/app_icons/kkbox_app_icon.png',

  // theme color
  color: '#26EFE6'

  // darkmode
  darkMode: true
}

class Example extends Component {
  render() {
    return <Sorbet config={config} walletProvider={provider} />
  }
}

Supported Networks

Arbitrum logo Avalanche logo Binance Smart Chain logo Optimism logo Polygon / Matic logo POA (Sokol) logo xDai logo

Network Config Native Deposit Supported
Arbitrum (Kovan)
Avalanche -
Binance Smart Chain -
Optimism (Kovan)
Optimism (Mainnet)
Polygon / Matic (Mainnet)
Polygon / Matic (Mumbai)
POA (Sokol) -
xDai

Supported Wallets

Metamask logo

Network Add Network Switch Network
MetaMask

Run in dev

Run the library:

cd \eth-sorbet
yarn start

In another terminal, run the example App which will refresh if the library changes

cd \eth-sorbet\example
yarn start

License

MIT © 2021 husky-finance

Package Sidebar

Install

npm i @huskyfinance/eth-sorbet

Weekly Downloads

0

Version

0.1.15

License

MIT

Unpacked Size

635 kB

Total Files

34

Last publish

Collaborators

  • flyingnobita
  • antoncoding