useConnect

Connection flow

A dApp must connect with the wallet before communication between dApps and wallet can begin. A dApp can only have one connection at a time.

Usage

import { useConnect } from '@puzzlehq/sdk';

export const ConnectPage = () => {
  const { connect, data, error, loading } = useConnect({
    dAppInfo: {
      name: "<YOUR DAPP NAME>",
      description: "<YOUR DAPP DESCRIPTION>",
      iconUrl: "<YOUR DAPP ICON URL>",
    },
    permissions: {
      programIds: {
        [Network.AleoMainnet]: ['dapp_1.aleo', 'dapp_2.aleo', 'dapp_2_imports.aleo']
        [Network.AleoTestnet]: ['dapp_3.aleo', 'dapp_3_imports_1.aleo', 'dapp_3_imports_2.aleo']
      }
    }
  });

  return (
    <div>
      <button
        onClick={ () => connect() }
        disabled={ loading }
      >
        connect to puzzle
      </button>
      { data && <p>you did it!</p> }
      { error && <p>error connecting: {error}</p> }
    </div>
  )
}

Types

See the connect page for types.