diff --git a/www/docs/guides/automatic_cairo_ABI_parsing.md b/www/docs/guides/automatic_cairo_ABI_parsing.md index f0a5b8a65..ce5b65ae7 100644 --- a/www/docs/guides/automatic_cairo_ABI_parsing.md +++ b/www/docs/guides/automatic_cairo_ABI_parsing.md @@ -19,7 +19,7 @@ First, you need to wrap your ABI in a array and export it as a `const`. Example: ```js -export const tAbi = [ +export const ABI = [ { type: 'function', name: 'increase_balance', @@ -35,35 +35,48 @@ export const tAbi = [ ] as const; ``` -Later on, to use it in our code, we have 2 options. - -### Option 1 +Later on, to use it in our code: ```js -import { tAbi } from '../__mocks__/hello'; -import { TypedContract } from '../src'; +import { Contract, RpcProvider, constants } from 'starknet'; + +const address = "YOUR_ADDRESS_HERE"; +const provider = new RpcProvider({ nodeUrl: `${yourNodeUrl}` }); +const contract = new Contract(ABI, address, provider).typedv2(ABI); -let cairo1Contract: TypedContract; // tAbi is your Cairo contract ABI +// Notice the autocompletion and typechecking in your editor +const result = await contract.increase_balance(100); ``` -After that, you can use `cairo1Contract` in your code as you would before, but with autocomplete and type checking! +After that, you can use `contract` in your code as you would before, but with autocompletion and typechecking! -For example: +### Generate `abi.ts` from the contract class -```js -const tx = await cairo1Contract.increase_balance(100); +If you have your contract class in a Json file, you can use the abiwan CLI to generate the `abi.ts` typescript file + +```bash +npx abi-wan-kanabi --input /path/to/contract_class.json --output /path/to/abi.ts ``` -### Option 2 +### Usage for deployed contracts -```js -import { tAbi } from '../__mocks__/hello'; +Let's say you want to interact with the [Ekubo: Core](https://starkscan.co/contract/0x00000005dd3d2f4429af886cd1a3b08289dbcea99a294197e9eb43b0e0325b4b) contract + +You need to first get the **ABI** of the contract and export it in a typescript file, you can do so using one command combining both [`starkli`](https://github.com/xJonathanLEI/starkli) (tested with version 0.2.3) and `npx abi-wan-kanabi`: -// ... +```bash +starkli class-at "0x00000005dd3d2f4429af886cd1a3b08289dbcea99a294197e9eb43b0e0325b4b" --network mainnet | npx abi-wan-kanabi --input /dev/stdin --output abi.ts +``` -let cairo1Contract = new Contract(compiledHelloSierra.abi, dd.deploy.contract_address, account); +```typescript +import { Contract, RpcProvider, constants } from "starknet"; +import { ABI } from "./abi"; -let cairo1ContractTyped = cairo1Contract.typed(tAbi); +const address = "0x00000005dd3d2f4429af886cd1a3b08289dbcea99a294197e9eb43b0e0325b4b"; +const provider = new RpcProvider({ nodeUrl: constants.NetworkName.SN_MAIN }); +const contract = new Contract(ABI, address, provider).typedv2(ABI); -cairo1ContractTyped.test_bool(); +// Notice the types inferred for the parameter and the returned value +const primary_inteface_id = contract.get_primary_interface_id() +const protocol_fees_collected = contract.get_protocol_fees_collected('0x1') ``` diff --git a/www/docs/guides/connect_contract.md b/www/docs/guides/connect_contract.md index 660e9c272..d4ef7dff8 100644 --- a/www/docs/guides/connect_contract.md +++ b/www/docs/guides/connect_contract.md @@ -42,6 +42,7 @@ const compiledContract = json.parse(fs.readFileSync("./compiledContracts/test.js // initialize provider const provider = new RpcProvider({ nodeUrl: `${myNodeUrl}` }); + // initialize deployed contract const testAddress = "0x7667469b8e93faa642573078b6bf8c790d3a6184b2a1bb39c5c923a732862e1"; const compiledTest = json.parse(fs.readFileSync("./compiledContracts/test.json").toString("ascii")); @@ -49,3 +50,9 @@ const compiledTest = json.parse(fs.readFileSync("./compiledContracts/test.json") // connect the contract const myTestContract = new Contract(compiledTest.abi, testAddress, provider); ``` + +## Typechecking and autocompletion + +If you want to have typechecking and autocompletion for your contracts functions calls and catch typing errors early, you can use Abiwan! + +See [this guide](./automatic_cairo_ABI_parsing.md) for more details.