feat: adding new abi-typegen package (#570)

Author: arboleya

.changeset/config.json

@@ -7,7 +7,7 @@
     }
   ],
   "commit": false,
-  "fixed": [["@fuel-ts/*", "fuels", "typechain-target-fuels", "fuelchain"]],
+  "fixed": [["@fuel-ts/*", "fuels"]],
   "linked": [],
   "access": "public",
   "baseBranch": "master",

.changeset/ten-students-dress.md

@@ -0,0 +1,8 @@
+---
+"@fuel-ts/abi-typegen": minor
+"@fuel-ts/contract": minor
+"@fuel-ts/example-contract": minor
+"fuels": minor
+---
+
+Replace `fuelchain` and `typechain-target-fuels` with `abi-typegen`

.eslintignore

@@ -1,13 +1,12 @@
+.hbs
 node_modules/
 coverage/
 dist/
 packages/example-contract/src/example-contract-types
-packages/typechain-target-fuels/static
-packages/typechain-target-fuels/example
 packages/providers/src/__generated__
 out
 CHANGELOG.md
 
 # Docs files
 _includes/js/custom.js
-docs/examples/
+docs/examples/

.prettierignore

@@ -1,11 +1,12 @@
+*.hbs
+
 dist
 .coverage_*
 coverage
 node_modules
 docs/examples/
 /packages/example-contract/src/example-contract-types/
-/packages/typechain-target-fuels/static/
-/packages/typechain-target-fuels/example/
+
 __generated__
 out
 CHANGELOG.md

.vscode/extensions.json

@@ -2,6 +2,7 @@
   "recommendations": [
     "orta.vscode-jest",
     "esbenp.prettier-vscode",
-    "dbaeumer.vscode-eslint"
+    "dbaeumer.vscode-eslint",
+    "ionutvmi.path-autocomplete"
   ]
 }

.vscode/settings.json

@@ -18,5 +18,16 @@
   },
   "[json]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[handlebars]": {
+    "editor.formatOnSave": false,
+    "editor.formatOnPaste": false
+  },
+  "path-autocomplete.includeExtension": true,
+  "path-autocomplete.extensionOnImport": true,
+  "path-autocomplete.excludedItems": {
+    // do not mess with defaut auto-complete for `js` and `ts`
+    "**/*.ts": { "when": "**" },
+    "**/*.js": { "when": "**" }
   }
 }

README.md

@@ -18,7 +18,6 @@
 - [Import](#import)
 - [Calling Contracts](https://fuellabs.github.io/fuels-ts/guide/calling-contracts)
 - [Generate Contract Types from ABI](https://fuellabs.github.io/fuels-ts/guide/contracts/generate-contract-types-from-abi)
-  - [Dependencies](#dependencies)
   - [Using Generated Types](https://fuellabs.github.io/fuels-ts/guide/types/using-generated-types)
 - [Deploying Contracts](https://fuellabs.github.io/fuels-ts/guide/contracts/deploying-contracts)
 - [CLI](/#CLI)
@@ -83,12 +82,13 @@ $ yarn exec fuels -h
 Usage: fuels [options] [command]
 
 Options:
-  -V, --version   output the version number
-  -h, --help      display help for command
+  -V, --version      output the version number
+  -h, --help         display help for command
 
 Commands:
-  versions        checks for version incompatibilities
-  help [command]  display help for command
+  versions           check for version incompatibilities
+  typegen [options]  generate typescript from contract abi json files
+  help [command]     display help for command
 ```
 
 ## License

docs/QUICKSTART.md

@@ -299,7 +299,7 @@ Notice an important thing here; The **`Contract id`** is the address of the depl
 Now we are going to;
 
 1. **Initialize a React project.**
-2. **Install the `fuels` SDK dependencies.**
+2. **Install the `fuels` SDK.**
 3. **Modify the App.**
 4. **Run our project.**
 
@@ -315,13 +315,9 @@ npx create-react-app frontend --template typescript
 
 The command will generate a react app using [`Create React App`](https://create-react-app.dev/).
 
-#### 4.2 Install the `fuels` SDK dependencies.
+#### 4.2 Install the `fuels` SDK
 
-On this step we need to install 3 dependencies for the project:
-
-1. `fuels`: The umbrella package that includes all the main tools; `Wallet`, `Contracts`, `Providers` and more.
-2. `fuelchain`: Fuelchain is the ABI TypeScript generator.
-3. `typechain-target-fuels`: The Fuelchain Target is the specific interpreter for the [Fuel ABI Spec](https://github.com/FuelLabs/fuel-specs/blob/master/specs/protocol/abi.md).
+Now we install the `fuels` umbrella package that includes all the main tools; all the classes such as `Wallet`, `Contracts`, `Providers` and more. Also, it is our utility for ABI TypeScript generation.
 
 > ABI stands for Application Binary Interface. ABI's inform the application the interface to interact with the VM, in other words, they provide info to the APP such as what methods a contract has, what params, types it expects, etc...
 
@@ -331,26 +327,32 @@ Inside `my-fuel-dapp/frontend` run;
 
 ```sh
 npm install fuels --save
-npm install fuelchain typechain-target-fuels --save-dev
 ```
 
 ##### Generating contract types
 
-To make it easier to interact with our contract we use `fuelchain` to interpret the output ABI JSON from our contract. This JSON was created on the moment we executed the `forc build` to compile our Sway Contract into binary. If you see the folder `my-fuel-dapp/contract/out` you will be able to see the ABI JSON there. If you want to learn more, read the [ABI Specs here](https://github.com/FuelLabs/fuel-specs/blob/master/specs/protocol/abi.md).
+To make it easier to interact with our contract we use `fuels typegen` to interpret the output ABI JSON from our contract. This JSON was created on the moment we executed the `forc build` to compile our Sway Contract into binary. If you see the folder `my-fuel-dapp/contract/out` you will be able to see the ABI JSON there. If you want to learn more, read the [ABI Specs here](https://github.com/FuelLabs/fuel-specs/blob/master/specs/protocol/abi.md).
 
 Inside `my-fuel-dapp/frontend` run;
 
 ```sh
-npx fuelchain --target=fuels --out-dir=./src/contracts ../contract/out/debug/*-abi.json
+npx fuels typegen -i ../contract/out/debug/*-abi.json -o ./src/contracts
 ```
 
 You should see something like this:
 
 ```sh
-Successfully generated 4 typings!
+$ npx fuels typegen -i ../counter-contract/out/debug/*-abi.json -o ./src/contracts
+Generating files..
+
+ - src/contracts/ContractAbi.d.ts
+ - src/contracts/factories/ContractAbi__factory.ts
+ - src/contracts/index.ts
+
+Done.⚡
 ```
 
-Now you should be able to find a new folder `my-fuel-dapp/frontend/src/contracts`. This folder was auto-generated by our `fuelchain` command, this files abstract the work we would need to do, to create a contract instance, and also generate a complete TypeScript interface to the Contract, making easy to develop.
+Now you should be able to find a new folder `my-fuel-dapp/frontend/src/contracts`. This folder was auto-generated by our `fuels typegen` command, this files abstract the work we would need to do, to create a contract instance, and also generate a complete TypeScript interface to the Contract, making easy to develop.
 
 ### 3. Modify the App.
 
@@ -364,7 +366,7 @@ import React, { useEffect, useState } from "react";
 import { Wallet } from "fuels";
 import "./App.css";
 
-// Import the contract factory from the folder generated by the fuelchain
+// Import the contract factory from the folder generated by the `fuels typegen`
 // command
 import { ContractAbi__factory } from "./contracts";
 

docs/_guide/abi-typegen/generate-contract-types-from-abi.md

@@ -7,17 +7,16 @@ See also [types](../types/).
 #### Dependencies
 
 ```sh
-yarn add -D fuelchain typechain-target-fuels
+yarn add fuels
 ```
 
 #### Generate Types
 
 ```sh
-yarn exec fuelchain --target=fuels --out-dir=types abi.json
+yarn exec fuels -i ./abis/*-abi.json -o ./types
 ```
 
 Note:
 
-- `target`: will always be `fuels`
-- `out-dir`: the output directory for the generated types
-- `abi.json`: the relative path to the JSON file for the ABI
+- `-i`: the relative path/global to the ABI JSON file(s)
+- `-o`: the output directory for the generated types

docs/guide/abi-typegen/generate-contract-types-from-abi.md

@@ -15,17 +15,16 @@ See also [types](../types/).
 #### Dependencies
 
 ```sh
-yarn add -D fuelchain typechain-target-fuels
+yarn add fuels
 ```
 
 #### Generate Types
 
 ```sh
-yarn exec fuelchain --target=fuels --out-dir=types abi.json
+yarn exec fuels -i ./abis/*-abi.json -o ./types
 ```
 
 Note:
 
-- `target`: will always be `fuels`
-- `out-dir`: the output directory for the generated types
-- `abi.json`: the relative path to the JSON file for the ABI
+- `-i`: the relative path/global to the ABI JSON file(s)
+- `-o`: the output directory for the generated types