Quick Start

Initialize

To use the Face Wallet Kit, create a Kit object.

import { Face } from '@haechi-labs/face-sdk';
import { Kit, getMetaMask, getWalletConnect } from '@haechi-labs/face-kit';
import { LoginProvider } from '@haechi-labs/face-types';

// Put the initialized face instance to Kit
const face = new Face(/* ... */);

const kit = new Kit(face, {
  providers: [ 
    /* You can set social providers you want use */ 
    LoginProvider.Google,
    LoginProvider.Apple,
    LoginProvider.Discord
  ],
  externalWalletOptions: {
    wallets: [
      getMetaMask(),
      getWalletConnect({ options: { projectId: wcProjectId } })
    ],
    expanded: false,
  },
});

Connect

Open the Face Wallet Kit modal by calling the kit.connect() method.

import { ConnectedWallet } from '@haechi-labs/face-types';

const connectedWallet: ConnectedWallet = await kit.connect();

You can now connect Face Wallet's social login and external wallets(like MetaMask, WalletConnect) to your Dapp via the Face Wallet Kit modal.


Wagmi Connector

await kit.connect() returns an object of type ConnectedWallet. This contains a Wagmi Connector object. You can now use this Connector to do whatever you want.

const provider = new providers.Web3Provider(
  await wallet.connector.getProvider()
);
const signer = provider.getSigner();

const receiverAddress = '0x9C4206e78bFfca62a4821A5079A7bF46986f6da6';
const amount = ethers.utils.parseEther('0.1');

const tx = await signer.sendTransaction({
    to: receiverAddress,
    value: amount,
});

const receipt = await tx.wait();
const txHash = receipt.transactionHash;

Other methods of the Connector can be found in the Wagmi Connector's interface. For more information, please visit to the following link: https://github.com/wagmi-dev/references/blob/main/packages/connectors/src/base.ts


Auto connect

If the user is already connected to the wallet, the user can connect right away without connecting modal with the following code.

// Put the initialized face instance to Kit
const face = new Face(/* ... */);

// Initialize Kit instance
const kit = new Kit(/* ... */);

const isConnected = await kit.isConnected();
if (isConnected) {
  // The wallet will be connected right away without connecting modal.
  const connectedWallet = await kit.connect();
  console.log('Kit reconnected!', connectedWallet);
}