Identity (Viem/Wagmi)

For a live demo of the identity integration (using development identity contracts), visit:

Contracts

Installation

To integrate identity-sdk into your project, you can easily install it from npm:

npm install @goodsdks/citizen-sdk

or if you prefer using Yarn:

yarn add @goodsdks/citizen-sdk

Available Methods in the Identity SDK:

getWhitelistedRoot(account: Address): Promise<{ isWhitelisted: boolean; root: Address }>
getIdentityExpiryData(account: Address): Promise<IdentityExpiryData>
generateFVLink(popupMode?: boolean, callbackUrl?: string, chainId?: number): Promise<string>
submitAndWait(params: SimulateContractParameters, onHash?: (hash: 0x${string}) => void): Promise<any>
calculateIdentityExpiry(lastAuthenticated: bigint, authPeriod: bigint): IdentityExpiry

Using the Wagmi SDK

The Identity SDK is built on top of Wagmi and provides a React hook for interacting with the Identity smart contracts. It abstracts the complexity of blockchain interactions, making it easier to integrate identity functionalities into your React applications.

Initialization

First, ensure that you have set up Wagmi in your React application. Then, import and use the useIdentitySDK hook as shown below.

import React from 'react';
import { WagmiProvider } from 'wagmi';
import { useIdentitySDK } from '@goodsdks/citizen-sdk';

const IdentityComponent = () => {
  const identitySDK = useIdentitySDK('production');

  const checkWhitelistedRoot = async (account: string) => {
    try {
      const { isWhitelisted, root } = await identitySDK.getWhitelistedRoot(account);
      console.log(`Is Whitelisted: ${isWhitelisted}, Root: ${root}`);
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <div>
      <button onClick={() => checkWhitelistedRoot('0xYourEthereumAddress')}>
        Check Whitelisted Root
      </button>
    </div>
  );
};

const App = () => (
  <WagmiProvider>
    <IdentityComponent />
  </WagmiProvider>
);

Using the Viem SDK

The Viem SDK provides a set of utility functions to interact directly with the Identity smart contracts. It is suitable for backend services or environments where React is not used.

Initialization

import { PublicClient, WalletClient } from "viem"
import { initializeIdentityContract, IdentitySDK } from "./viem-sdk"

const publicClient = new PublicClient({
  /* configuration */
})
const walletClient = new WalletClient({
  /* configuration */
})
const contractAddress = "0xYourContractAddress"

const identitySDK = new IdentitySDK(publicClient, walletClient, "production")

References

PreviousIdentity (Ethers v5 / React)NextUseful Links

Last updated 2 days ago

Was this helpful?

import React from 'react'; import { WagmiProvider } from 'wagmi'; import { useIdentitySDK } from '@goodsdks/citizen-sdk'; const IdentityComponent = () => { const identitySDK = useIdentitySDK('production'); const checkWhitelistedRoot = async (account: string) => { try { const { isWhitelisted, root } = await identitySDK.getWhitelistedRoot(account); console.log(`Is Whitelisted: ${isWhitelisted}, Root: ${root}`); } catch (error) { console.error(error); } }; return ( <div> <button onClick={() => checkWhitelistedRoot('0xYourEthereumAddress')}> Check Whitelisted Root </button> </div> ); }; const App = () => ( <WagmiProvider> <IdentityComponent /> </WagmiProvider> );

import { PublicClient, WalletClient } from "viem" import { initializeIdentityContract, IdentitySDK } from "./viem-sdk" const publicClient = new PublicClient({ /* configuration */ }) const walletClient = new WalletClient({ /* configuration */ }) const contractAddress = "0xYourContractAddress" const identitySDK = new IdentitySDK(publicClient, walletClient, "production")