# @react-dapp/utils

Utility hooks and funtions to interact with ERC20, ERC721, ERC1155, LP contracts and much more.

## Dependencies
```
"bignumber.js": "^9.0.1",
"ethereum-multicall": "^2.9.0",
"ethers": "^5.5.1",
"react": "^17.0.2",
```

## Usage

Add the UtilsProvider at the top level of your component tree

```
 <UtilsProvider config={{
      provider: window.ethereum,
      wrappedNative: {
        address: '0xbb4CdB9CBd36B01bD1cBaEBF2De08d9173bc095c',
        symbol: 'WBNB',
        name: 'WBNB',
        decimals: 18
      },
      usd: {
        address: '0xe9e7CEA3DedcA5984780Bafc599bD69ADd087D56',
        name: 'BUSD',
        symbol: 'BUSD',
        decimals: 18

      },
      nativeUsdLp: {
        name: 'LP',
        address: '0x58F876857a02D6762E0101bb5C46A8c1ED44Dc16',
        symbol: 'LP',
        decimals: 18

      }
    }}>
      <App />
    </UtilsProvider>

```

Then in the **App** component use the avaialable hooks as following

```
function App() {
  const { account, connected, balance } = useEthers();


  const { lp: nativeLp, loading } = useLp('0x58F876857a02D6762E0101bb5C46A8c1ED44Dc16', 'BUSD')
  const { approve, approveState, isApproved } = useERC20Approval('0x40619dc9F00ea34e51D96b6EC5d8a6aD75457434', '0x046564e17dD76df34fF06200527b58B9173b4fdE');
  const { sign, signState, signature } = useWaleltSign();
  const { value, maxDisplayValue, error, setValue, getValue, selectMaxValue } = useInputValue('123456789000000000000000');

  return...
}


```