<SignInWithMetamaskButton>

The <SignInWithMetamaskButton> component is used to complete a one-click, cryptographically-secure sign-in flow using MetaMask.

How to use the <SignInWithMetamaskButton> component

Basic usage

Next.js

pages/index.js

import { SignInWithMetamaskButton } from '@oneauxilia/nextjs'

export default function Home() {
  return (
    <div>
      <h1> Sign in </h1>
      <SignInWithMetamaskButton />
    </div>
  )
}

React

Remix

Custom usage

In some cases, you will want to use your own button, or button text. You can do that by wrapping your button in the <SignInWithMetamaskButton> component.

Next.js

pages/index.js

import { SignInWithMetamaskButton } from '@oneauxilia/nextjs'

export default function Home() {
  return (
    <div>
      <h1> Sign in </h1>
      <SignInWithMetamaskButton mode="modal">
        <button>Sign in</button>
      </SignInWithMetamaskButton>
    </div>
  )
}

React

Remix