An utility React hook to handle Metamask's browser API

Last update: Jun 15, 2022

useMetamask 🦍

An utility React hook to handle Metamask's browser API

Install

npm i @forta/usemetamask

Get Started

Address: {account}

BALANCE: {balance}ETH

) }">
import { useMetamask } from "@forta/usemetamask"

function App() {
  const { account, connect, balance } = useMetamask()
  return (
    <div>
      <p>Address: {account}</p>
      <p>BALANCE: {balance}ETH</p>
      <button onClick={connect}>CONNECT</button>
    </div>
  )
}

Send Ether

import { parse, useMetamask } from "@forta/usemetamask"
// ..

const { send } = useMetamask()
send({
  to: "0x3c0e20fCA6d2E084127D056377a5f35294503447",
  value: parse.toTxWei(0.5),
  /* 0.5 in ETH. Request expects wei in HEX value.
  .toTxWei parses a number to wei & then to HEX */
})

READ THE DOCS 🌟 | FOLLOW ME 🐦

GitHub

https://github.com/D3Portillo/usemetamask
You might also like...

Keep-react-hook-form - A lib to store react-hook-form values in session storage

Keep-react-hook-form - A lib to store react-hook-form values in session storage

Jan 27, 2022

👩‍🍳 A React Hooks utility library containing popular customized hooks

👩‍🍳 A React Hooks utility library containing popular customized hooks

React Recipes A React Hooks utility library containing popular customized hooks What's your favorite dish? npm i react-recipes --save yarn add react-r

Jun 16, 2022

A react utility library.

A react utility library.

Melting Pot The @withvoid/melting-pot package contains utilities, helper methods - your typical daily use functions (mostly in hooks). Demo Melting-Po

Mar 16, 2022

Tiny utility package for easily creating reusable implementations of React state provider patterns.

react-state-patterns Tiny utility package for easily creating reusable implementations of React state provider patterns. 🚀 react-state-patterns makes

Feb 4, 2022

A React hook for the React Native Dimensions API.

useDimensions A React hook for the React Native Dimensions API. Install npm install use-dimensions --save, or yarn add use-dimensions Use Screen and W

May 17, 2022

Lightweight React hook for checking health of API services.

React Health Check 🏥 Lightweight React hook for checking health of API services. Installation 🧑‍🔧 npm i @webscopeio/react-health-check or yarn add

Jun 5, 2022

😎 🍿 React hook for highly-performant and manipulable animations using Web Animations API.

😎 🍿 React hook for highly-performant and manipulable animations using Web Animations API.

USE-WEB-ANIMATIONS Using Web Animations API (a.k.a WAAPI) in the React hook way. Let's create highly-performant, flexible and manipulable web animatio

Jun 22, 2022

React hook for conveniently use Fetch API

react-fetch-hook React hook for conveniently use Fetch API. Tiny (556 B). Calculated by size-limit Both Flow and TypeScript types included import Reac

Jun 16, 2022

⚛️ A React Hook to monitor changes in the size of an element using native ResizeObserver API 🔍

⚛️ A React Hook to monitor changes in the size of an element using native ResizeObserver API 🔍

⚛️ A React Hook to monitor changes in the size of an element using native ResizeObserver API 🔍

May 5, 2022
😎 📏 React hook to measure an element's size and handle responsive components.
😎 📏 React hook to measure an element's size and handle responsive components.

REACT COOL DIMENSIONS A React hook that measure an element's size and handle responsive components with highly-performant way, using ResizeObserver. T

Jun 16, 2022
A utility for React to set 100vh equal to the actual browser inner window height.

react-viewport-height A utility for React to set 100vh equal to the actual browser inner window height. Since vh has troubles on mobile browsers (prim

Mar 5, 2022
🔄 Simple solution to handle undo\redo turned into React Hooks

Use Simple Undo - Simple solution to handle undo\redo turned into React Hooks. Read about Hooks feature. Documentation https://sandiiarov.github.io/us

Jan 11, 2022
New hooks variation for React, to handle states in an easier form.

New hooks variation for React, to handle states in an easier form.

Feb 1, 2022
A redux middleware to handle global loading

Redux Loading Middleware. A redux middleware to handle global loading fully compatible with redux and redux-zero Usage Redux loading middleware set a

Mar 7, 2019
POC-next-ssr-media-queries - An experiment and evaluation of different strategies to handle media queries when doing SSR

POC Next SSR media queries TLDR: useMediaQuery is more versatile, and future pro

Jan 4, 2022
☯️ React hook to determine if you are on the server, browser, or react native
☯️ React hook to determine if you are on the server, browser, or react native

useSSR ☯️ React hook to determine if you are on the server, browser, or react native Need to know when you're on the server, in the browser or in reac

Apr 15, 2022
React hook to communicate among browser context (tabs, windows, iframes)
React hook to communicate among browser context (tabs, windows, iframes)

react-window-communication-hook React hook to communicate among browsers contexts (windows, tabs, iframes). Example use case: When the user presses lo

Feb 8, 2022
Simple react hook to open browser file selector.

Welcome to use-file-picker ?? Simple react hook to open browser file selector. ?? Homepage Documentation Usage Simple txt reader Image reader Advanced

Jun 17, 2022
Use-clipboard-api - A React Hook that consumes Web Clipboard API

?? use-clipboard-api useClipboardApi() is a React Hook that consumes Web Clipboa

Jun 9, 2022