@futureverse/signer

Futureverse Signer

Provides a signer interface with common methods for signing messages, transactions and extrinsics.

Installation

NPM:

    npm install @futureverse/signer --save

Yarn:

    yarn add @futureverse/signer

Usage

Wagmi useFutureverseSigner Hook

The example below shows how to create a hook (useFutureverseSigner) to get the signer interface from wagmi wallet client.

import { clientToSigner } from '@futureverse/signer';
import { useMemo } from 'react';
import { type Connector, useWalletClient } from 'wagmi';

/** Action to convert a Viem Client to a Futureverse Signer. */
export function useFutureverseSigner({ chainId, connector }: { chainId?: number; connector?: Connector } = {}) {
  const { data: client } = useWalletClient({ chainId, connector });

  return useMemo(() => (client ? clientToSigner(client) : undefined), [client]);
}

Signing a message

import { useCallback } from 'react';
import { useFutureverseSigner } from './useFutureverseSigner';

function MessageSignerDemo() {
  const { signer } = useFutureverseSigner();

  const signExtrinsic = useCallback(async () => {
    if (!signer) return;
    const message = 'message to sign';
    return await signer.signMessage(message);
  }, [signer]);

  // Your UI code to call signExtrinsic
  return <></>;
}

Signing a Root Network extrinsic

import { userSession } from '@futureverse/auth';
import { useTrnApi } from '@futureverse/transact-react';
import { useCallback } from 'react';
import { useFutureverseSigner } from './useFutureverseSigner';

function ExtrinsicSignerDemo() {
  const { userSession } = useAuth();
  const { trnApi } = useTrnApi();
  const { signer } = useFutureverseSigner();

  const signExtrinsic = useCallback(async () => {
    if (!signer) return;
    if (!trnApi) return;
    if (!userSession?.eoa) return;
    const collectionId = '<your collection id>';
    const numberOfTokens = 1; // How many tokens to mint
    const address = 'FuturePass or address to mint to';
    const extrinsic = trnApi.tx.nft.mint(collectionId, numberOfTokens, address);
    return await signer.signExtrinsic(trnApi, extrinsic, userSession.eoa);
  }, [signer]);

  // Your UI code to call signExtrinsic
  return <></>;
}