react-use-etherscan

🌊 🏄 ⚛️ React hooks for interacting with Etherscan. Supports Android/iOS/Web/Expo. This is a lifecycle-aware wrapper around etherscan-api.

Migration Notes

• When migrating from versions < 0.1.0-alpha.0, using arrays to return information has been replaced with hooks, i.e.
  • [loading, data, error] becomes { loading, data, error, refetch }.

🚀 Getting Started

Using yarn:

yarn add react-use-etherscan

🌱 Example

import React, { useState, useEffect } from 'react';
import EtherscanProvider, { useEtherscan, useBalance, useTransactionList } from "react-use-etherscan";

function TransactionList({ address }) {
  const { loading, result, error } = useTransactionList({ address });
  console.warn(loading, result, error);
  return null;
}

function BalanceOf({ address }) {
  const { loading, result, error } = useBalance({ address });
  console.warn(loading, result, error);
  return null;
}

function EthPrice() {
  const { api: { stats } } = useEtherscan();
  useEffect(
    () => (async () => {
      const {result} = await stats.ethprice();
      console.warn('stats', result);
    })() && undefined,
    [stats],
  );
  return null;
}


export default function App() {
  const [address] = useState("0x2b58Af5592Ad3a14A6851a19b0b37012d5d497cF");
  return (
    <EtherscanProvider
      apiKey="your-api-key"
      network="rinkeby"
    >
      <BalanceOf address={address} />
      <EthPrice />
      <TransactionList address={address} />
    </EtherscanProvider>
  );
}

✌️ License

MIT