Page cover image

Finnie Wallet

Integrate your dApp with Finnie wallet

useFinnie

To integrate with Finnie use the useFinnie hook and import it is as easy as:

import { useFinnie } from "components/finnie";

useFinnie hook exports many variables and helpers to integrate with Finnie.

const {
    state: { connectFinnie, disconnectFinnie, walletAddress, walletBalance, isFinnieConnected, isLoading, isError }
  } = useFinnie();

connectFinnie a function to call to try to connect to Finnie. e.g:

<button onClick={connectFinnie}>Connect to finnie</button>

When connectFinnie succeed you'll have:

  1. Your Finnie address in walletAddress

  2. Both your KOII and Arweave balance in walletBalance

  3. isFinnieConnected set to true

When connectFinnie fail you'll have:

  1. isError set to false

  2. isFinnieConnected set to false

When you're still in the process of connecting to Finnie you'll have isLoading set to true

e.g:

import { useFinnie } from "components/finnie";

function Component() {
  const {
    state: { connectFinnie, isLoading, isError, walletAddress, isFinnieConnected }
  } = useFinnie();

  return (
    <>
      <button onClick={connectFinnie}>{isLoading ? "Connecting..." : isFinnieConnected ? "Connected βœ“" : "Connect to finnie"}</button>

      {isFinnieConnected && (
        <p>
          Connected. Your wallet address is: <code>{walletAddress}</code>
        </p>
      )}

      {isError && <p>An error occurred while connecting to finnie.</p>}
    </>
  );
}

Calling disconnectFinnie will disconnect the connection to Finnie.

Finnie Wallet API

When you're connected to Finnie, you can interact with any Finnie exposed API. e.g: The sendKoiiTip function inside api/finnie.ts used to send KOII from your wallet to another address.

export const sendKoiiTip = async (artistAddress: string, amount: number) => {
  const extension = window.koiiWallet;
  return await extension.sendKoii(artistAddress, amount);
};

Last updated