Hooks

@tria-sdk/connect

import * from @tria-sdk/connect;

useTriaConnector

const { globalData } = useTriaConnector({ walletUrl: "https://wallet.tria.so" });

type globalDataType {
    eventType : Object 
}

useAccount

const { account } = useAccount();

export type Account = {
  triaName: string | null;
  evm: {
    address: string;
  };
};

export type useAccountResponse = {
  account: Account | null;
};

useChainName

1. Pass this to the wallet SDK as selectedChainName

const { chainName } = useChainName();

type useChainResponse = {
  chainName: string | null;
};

useSignMessage

1. Provide the message and chainName as parameters to the useSignMessage hook.

2. Execute the signing process by invoking the signMessage function.

3. Upon completion, you will receive the signature in the returned data.

import { useSignMessage } from "@tria-sdk/connect";

const { 
  data, // signature
  isError, 
  isLoading, 
  isSuccess, 
  signMessage 
} = useSignMessage(
  calldata: SignMessageParams,
  dappDetails?: dappDetails,
  authUrl: string = 'https://auth.tria.so',
  environment: ENV = 'mainnet'
);

type SignMessageParams = {
  message: string;
  chainName: string;
};

type useSignMessageResponse = {
  data: string | null;
  isLoading: boolean;
  isError: boolean;
  isSuccess: boolean;
  signMessage: () => Promise<boolean>;
};

<button onClick={signMessage}>Sign Message</button>

useSendTransaction

1. Supply the amount, recipient address or tria name, chain name, and token address as parameters to the useSendTransaction hook.

2. Execute the desired transaction by invoking the sendTransaction function.

3. Upon completion, you will receive the transaction hash (txHash) and a link to view the transaction on the explorer (viewOnExplorer) in the returned data.

import { useSendTransaction } from "@tria-sdk/connect";

useSendTransaction(
  calldata: SendParams,
  dappDetails?: dappDetails,
  authUrl: string = 'https://auth.tria.so',
  environment: ENV = 'mainnet'
): useSendTxnResponse;

type SendParams = {
  amount: number;
  recepientAddress: string;
  chainName: string;
  tokenAddress?: string;
};

type useSendTxnResponse = {
  data: TxnDataResponse | null;
  isLoading: boolean;
  isError: boolean;
  isSuccess: boolean;
  sendTransaction: Function;
};

type TxnDataResponse = {
  txnId: string;
  viewInExplorer: string;
  wait?: Function;
};

<button onClick={() => sendTransaction()}>send Transaction</button>

Example:

{
	amount: 1, // 1 Matic
	recipientAddress: "lladawn825@tria",
	chainName: "POLYGON",
	tokenAddress: null // null when sending native token
}

{
	amount: 1.5, // 1.5 USDC
	recipientAddress: "lladawn825@tria",
	chainName: "POLYGON",
	tokenAddress: "0x2791Bca1f2de4661ED88A30C99A7a9449Aa84174" // ERC20 token address
}

useSendNft

useSendNft(
  calldata: SendNftParams,
  dappDetails?: dappDetails,
  authUrl: string = 'https://auth.tria.so',
  environment: ENV = 'mainnet'
): useSendNftResponse;

type SendNftParams = {
  chainName: string;
  recipientTriaName: string;
  nftDetails: {
    type: string;
    tokenAddress: string;
    tokenId: string;
    amount: number;
  };
};

type useSendNftResponse = {
  data: TxnDataResponse | null;
  isLoading: boolean;
  isError: boolean;
  isSuccess: boolean;
  sendNft: Function;
};

type TxnDataResponse = {
  txnId: string;
  viewInExplorer: string;
  wait?: Function;
};

useContractRead

1. Send the chainName and contractDetails

2. Get the response in data field as expected from contract

useContractRead(
    params: ReadContractParams
): useContractReadResponse;

type ReadContractParams = {
  chainName: string;
  contractDetails: ContractDetails;
};

type ContractDetails {
    contractAddress: string;
    abi: Object[];
    functionName: string;
    args: any[];
    value?: number; // not needed in read
}

type useContractReadResponse = {
  data: any;
  isLoading: boolean;
  isError: boolean;
  isSuccess: boolean;
};

Example use case:

• parse this data suppose fetching price of NFT before minting

• parse wei to ether to send as value in contractDetails in useContractWrite

// Get Mint price before calling Mint

const chainName = "POLYGON";
const contractDetails = {
      contractAddress: '0x5927Aa58fb36691A4be262c63955b47b67c6e641',
      abi: [
        {
          inputs: [
            { internalType: 'uint256', name: 'id', type: 'uint256' },
            { internalType: 'uint256', name: 'amount', type: 'uint256' },
          ],
          name: 'getItemsNativePrice',
          outputs: [{ internalType: 'uint256', name: '', type: 'uint256' }],
          stateMutability: 'view',
          type: 'function',
        },
      ],
      functionName: 'getItemsNativePrice',
      args: [1, 1],
   };

const { data, isLoading, isError, isSuccess } = useContractRead({
    chainName,
    contractDetails
  });

// data -> is the data returned from contract
const value = ethers.utils.formatEther(data); // pass this to useContractWrite

useContractWrite

1. Provide the chain name, payToken, and contractDetails as arguments to the useContractWrite hook.

2. Invoke the write function to execute the desired action.

3. you will get the returned txnHash in the data response.

useContractWrite(
  calldata: WriteContractParams,
  dappDetails?: dappDetails,
  authUrl: string = 'https://auth.tria.so',
  environment: ENV = 'mainnet'
): useContractWriteResponse;

type WriteContractParams = {
  chainName: string;
  payToken?: {
    tokenAddress: string;
    amount: number;
  };
  contractDetails: ContractDetails;
};

interface ContractDetails {
    contractAddress: string;
    abi: Object[];
    functionName: string;
    args: any[];
    value?: number;
    enableTriaName?: boolean; // true, if passing triaName in args
}

type useContractWriteResponse = {
  data: TxnDataResponse | null;
  isLoading: boolean;
  isError: boolean;
  isSuccess: boolean;
  write: Function;
};

type TxnDataResponse = {
  txnId: string;
  viewInExplorer: string;
  wait?: Function;
};

<button onClick={() => write()}>Call Contract</button>

• Examples

example 1:

const chainName = "POLYGON";
const contractDetails = {
		contractAddress: "0xd1fD14e3Cf4f96E63A1561681dc8765DF8f7Cf91",
		abi: [
		  {
		    inputs: [
		      { internalType: "uint256", name: "_tokenID", type: "uint256" },
		      { internalType: "address", name: "_claimer", type: "address" },
		    ],
		    name: "claimCoupon",
		    outputs: [],
		    stateMutability: "nonpayable",
		    type: "function",
		  },
		],
		functionName: "claimCoupon",
		args: [1, "0x7Ae1bBCe3557D46313a960C0982637967eF5c1f7"],
		value: 0, // non payable function, or if fees in ERC20
}

example 2:

const chainName = "POLYGON";
const contractDetails = {
    contractAddress: '0x5927Aa58fb36691A4be262c63955b47b67c6e641',
    abi: [
      {
        inputs: [
          { internalType: 'uint256', name: 'id', type: 'uint256' },
          { internalType: 'uint256', name: 'amount', type: 'uint256' },
        ],
        name: 'mint',
        outputs: [],
        stateMutability: 'payable',
        type: 'function',
      },
    ],
    functionName: 'mint',
    args: [1, 1],
    value: itemPrice, // eg. 8 // if 8 MATIC // this itemPrice you can fetch from useReadContract as mentioned in it's example
  };

useSwitchChain

const { switchChain } = useSwitchChain();

swtchChain(chainName: string);

Internal hooks