Contract.tsx

└── src
    └── contexts
        ├── Contract.tsx

This Contract context template provides the contract binding to components.

Code

import { set_binder_tezos_toolkit } from '@completium/dapp-ts';
import constate from 'constate';
import { useState } from 'react';

import { FIXME as Contract } from '../bindings/FIXME'; // replace FIXME
import { useContractAddress } from './Settings';
import { useTezosToolkit } from './Taquito';

export const [
  ContractProvider,
  useContract
] = constate(
  () => {
    const tezos = useTezosToolkit()
    const address = useContractAddress()
    const [contract] = useState({
      contract: new Contract(address),
    });
    set_binder_tezos_toolkit(tezos)
    return contract;
  },
  (v) => v.contract
)

Comments:

• replace FIXME with contract name; for example in the Poll DApp example:

import { Poll as Contract } from '../bindings/poll';

• set_binder_tezos_toolkit provides dapp-ts package with the Tezos toolkit

Usage

import { useContract } from '../store/contract'

const contract = useContract()

See example DApp's detailed contract integration explanations.