Skip to content

Upgrading to V3

Upgrading to Starknet React V3

Overview

Starknet React V3 is a major revision of Starknet React, as such you should expect breaking changes.

Update Starknet.js to v6

The required version of Starknet.js is v6. Starknet React will simply not work with v5.

useContract

This hook now returns a typed contract, that is a contract that uses the provided ABI to provide type-safety.

The following example shows a smart contract with a type-safe transfer function.

import { type Abi } from "starknet";
import { useContract, useNetwork } from "@starknet-react/core";
 
const abi = [
  {
    type: "function",
    name: "transfer",
    state_mutability: "external",
    inputs: [
      {
        name: "recipient",
        type: "core::starknet::contract_address::ContractAddress",
      },
      {
        name: "amount",
        type: "core::integer::u256",
      },
    ],
    outputs: [],
  },
] as const satisfies Abi;
 
const { chain } = useNetwork();
const { contract } = useContract({
  abi,
  address: chain.nativeCurrency.address,
});
 
// Complete function name
contract.populate("t
transfer
// Argument types is also inferred contract.populate("transfer", ["0x0", 1n])

useContractRead

The hook is now called useReadContract. Notice that the hook is now type-safe: it will use the provided ABI to automatically parse the call arguments and response. If you are using Typescript, the autocomplete should also automatically complete functionName, the input parameters and the output data.

This hook requires a contract ABI generated by a recent version of the Cairo compiler. If you are interacting with an old contract, you should manually write the ABI spec or use a tool to automatically upgrade the ABI.

If you want the old (untyped) behavior, use the new useCall hook.

useContractWrite

The hook is now called useSendTransaction. The hook expects a list of Calls, you can use the new typed contract together with its populate method to create the list of calls.

useWaitForTransaction

This hook is now called useTransactionReceipt.