Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: update the js v6 page #56

Merged
merged 25 commits into from
Jun 27, 2024
Merged
Changes from all commits
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
e6a15eb
chore: update the js v6 page
Ngozi-Txfusion Jun 25, 2024
4e5df6e
chore: remove error handling
Ngozi-Txfusion Jun 25, 2024
dda1eda
Update content/sdk/10.js/00.ethers/20.v6/00.getting-started.md
Ngozi-Txfusion Jun 25, 2024
d99bd95
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
f680489
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
0c6e612
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
47ff836
Update content/sdk/10.js/00.ethers/20.v6/11.migration.md
Ngozi-Txfusion Jun 25, 2024
7fef9cf
Update content/sdk/10.js/00.ethers/20.v6/08.paymaster-utils.md
Ngozi-Txfusion Jun 25, 2024
a09f71f
Update content/sdk/10.js/00.ethers/20.v6/07.utils.md
Ngozi-Txfusion Jun 25, 2024
06a6474
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
b67864e
Update content/sdk/10.js/00.ethers/20.v6/11.migration.md
Ngozi-Txfusion Jun 25, 2024
3d0d585
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
7fe50cd
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
cd2dca7
chore: update provider v6
Ngozi-Txfusion Jun 25, 2024
664dc12
Update content/sdk/10.js/00.ethers/20.v6/03.providers.md
Ngozi-Txfusion Jun 25, 2024
15fef4b
chore: update lint
Ngozi-Txfusion Jun 25, 2024
b689630
chore: remove the double optional
Ngozi-Txfusion Jun 26, 2024
0762e0f
Update content/sdk/10.js/00.ethers/20.v6/05.accounts-l1-l2.md
Ngozi-Txfusion Jun 26, 2024
c5f4371
chore: update field group and collapsible
Ngozi-Txfusion Jun 26, 2024
3c87bb7
Merge branch 'main' into update-the-js-v6-page
Ngozi-Txfusion Jun 26, 2024
6bcbd4c
Update content/sdk/10.js/00.ethers/20.v6/04.accounts.md
Ngozi-Txfusion Jun 26, 2024
89ea868
chore: updated missing provider content
Ngozi-Txfusion Jun 26, 2024
c8fd2b6
chore: update types
Ngozi-Txfusion Jun 26, 2024
c790697
chore: added callout
Ngozi-Txfusion Jun 27, 2024
424a5ca
Merge branch 'main' into update-the-js-v6-page
danijelTxFusion Jun 27, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 0 additions & 14 deletions content/sdk/10.js/00.ethers/20.v6/00.getting-started.md
Original file line number Diff line number Diff line change
@@ -55,20 +55,6 @@ To fetch transaction details:
})();
```

## Error handling

Wrap the main logic in a try-catch block to handle potential errors:

```typescript
(async () => {
try {
// Your code here
} catch (error) {
console.error(`Error fetching transaction details from ZKsync: ${error}`);
}
})();
```

## Example code

Here is an example script demonstrating the usage of the SDK:
10 changes: 5 additions & 5 deletions content/sdk/10.js/00.ethers/20.v6/01.features.md
Original file line number Diff line number Diff line change
@@ -4,15 +4,15 @@ description: Explore ZKsync Era features and custom transactions
tags: ["zksync", "ethereum", "zksync Era", "transactions", "paymasters"]
---

ZKsync Era offers several unique features compared to Ethereum, which require some specific handling. This guide will
ZKsync Era offers several unique features compared to Ethereum, requiring specific handling. This guide will
help you understand these differences and how to work with them using the `zksync-ethers` library.

## Key differences

- **Account Abstraction**: ZKsync supports account abstraction, allowing accounts to have custom validation logic
and enabling paymaster support.
- **Deployment Transactions**: Contracts on ZKsync require bytecode to be passed in a separate field during deployment.
- **Fee System**: The fee system in ZKsync differs from Ethereum's, necessitating additional fields in transactions.
- **Fee System**: The fee system in ZKsync differs from Ethereum's, necessitating additional transaction fields.

::callout{icon="i-heroicons-light-bulb"}
Everything inside `customData` in `overrides` is related to ZKsync(L2 gas, etc.).
@@ -25,8 +25,8 @@ as EIP712 transactions. More details on EIP712 transactions can be found in the

## Overrides in transactions

`ethers.js` can automatically find the best `gasPrice`, `gasLimit`, `nonce`, and other important fields for
transactions. But sometimes, you need to set these values yourself. For example, you might want to set a
`ethers.js` can automatically find the best `gasPrice`, `gasLimit`, `nonce`, and other important transaction
fields. But sometimes, you need to set these values yourself. For example, you might want to set a
lower `gasPrice` or use a specific `nonce`.

In such cases, you can use an `Overrides` object to provide these values. This object lets you set fields
@@ -55,7 +55,7 @@ const tx = {
};
```

### CustomData Fields
### CustomData fields

- `gasPerPubdata`: Specifies L2 gas per published byte.
- `factoryDeps`: Array of contract bytecodes for deployment.
2 changes: 1 addition & 1 deletion content/sdk/10.js/00.ethers/20.v6/02.front-end.md
Original file line number Diff line number Diff line change
@@ -8,7 +8,7 @@ Learn how to integrate ZKsync Era into your front-end for the best user experien

## Immediate production deployment

If your front-end does not deploy new smart contracts, you don't need to change your codebase! All existing SDKs and
You don't need to change your codebase if your front-end does not deploy new smart contracts! All existing SDKs and
infrastructure will work seamlessly.

## Using ZKsync Era features
70 changes: 37 additions & 33 deletions content/sdk/10.js/00.ethers/20.v6/03.providers.md

Large diffs are not rendered by default.

389 changes: 198 additions & 191 deletions content/sdk/10.js/00.ethers/20.v6/04.accounts.md

Large diffs are not rendered by default.

52 changes: 25 additions & 27 deletions content/sdk/10.js/00.ethers/20.v6/05.accounts-l1-l2.md
Original file line number Diff line number Diff line change
@@ -1,48 +1,46 @@
---
title: Accounts | L1<->L2 Transactions
description:
title: Account Management | L1-L2 Transactions
description: Methods for handling transactions between L1 and L2 networks with ZKsync.
tags: ["zksync", "l1 to l2 transactions", "cryptocurrency", "ethereum", "wallet"]
---

This section explores the methods which allow the
[account](/sdk/js/ethers/v6/accounts) to send transactions among both L1 to L2 networks.
Learn the methods for managing accounts and facilitating transactions between Layer 1 (L1) and Layer 2 (L2)
networks using ZKsync.

If you want some background on how L1<->L2 interaction works on ZKsync, go through the
[introduction](https://docs.zksync.io/build/developer-reference/l1-l2-interop.html).
For an overview of L1-L2 interactions on ZKsync, visit the [Developer Reference](https://docs.zksync.io/build/developer-reference/l1-l2-interoperability).

Full examples of actions below are available on the [getting started](/sdk/js/ethers/v6/getting-started) page.
The examples of the following actions can be found on the [getting started](/sdk/js/ethers/v6/getting-started) page.

## Deposit

`Wallet` and `L1Signer` objects provide a deposit workflow.
For more information, please refer to the method specification [`Deposit`](/sdk/js/ethers/v6/accounts#deposit).
The `Wallet` and `L1Signer` classes offer a seamless deposit workflow. Detailed information can be found in
the [`Deposit`](/sdk/js/ethers/v6/accounts#deposit-1) method specification.

For a complete example of how to execute the deposit workflow, take a look at the following:
[Deposit ETH and ERC20 token](https://github.com/zksync-sdk/zksync2-examples/blob/main/js/src/01_deposit.ts).
For a guide on executing deposits, refer to this example: [Deposit ETH and ERC20 token](https://github.com/zksync-sdk/zksync2-examples/blob/main/js/src/01_deposit.ts).

## Request execute
## Request execution

`Wallet` and `L1Signer` objects provide an option to request execution of L2 transaction from L1. For more information,
please refer to the method specification [`requestExecute`](/sdk/js/ethers/v6/accounts#requestexecute).
Using `Wallet` and `L1Signer`, you can request the execution of L2 transactions from L1. More details are available
in the [`requestExecute`](/sdk/js/ethers/v6/accounts#requestexecute) method specification.

## Base cost
## Calculate base cost

`Wallet` and `L1Signer` objects provide an option to calculate base cost for L2 transaction. For more information,
please refer to the method specification [`getBaseCost`](/sdk/js/ethers/v6/accounts#getbasecost).
The `Wallet` and `L1Signer` classes also provide a way to calculate the base cost for L2 transactions. Refer to
the [`getBaseCost`](/sdk/js/ethers/v6/accounts#getbasecost) method specification for further details.

## Claim failed deposit

`Wallet` and `L1Signer` objects provide a claim fail deposit workflow. For more information,
please refer to the method specification [`claimFailedDeposit`](/sdk/js/ethers/v6/accounts#claimfaileddeposit).
In the event of a failed deposit, `Wallet` and `L1Signer` offer a recovery workflow. More information can be
found in the [`claimFailedDeposit`](/sdk/js/ethers/v6/accounts#claimfaileddeposit) method specification.

## Finalize withdraw
## Finalize withdrawal

`Wallet` and `L1Signer` objects provide a finalize withdraw workflow. For more information,
please refer to the method specification [`finalizeWithdrawal`](/sdk/js/ethers/v6/accounts#finalizewithdrawal).
`Wallet` and `L1Signer` support the workflow for finalizing withdrawals. Detailed instructions are available
in the [`finalizeWithdrawal`](/sdk/js/ethers/v6/accounts#finalizewithdrawal) method specification.

## Withdrawal
## Withdraw

`Wallet` and `Signer` objects provide a withdrawal workflow. For more information,
please refer to the method specification [`Withdraw`](/sdk/js/ethers/v6/accounts#withdraw).
Both `Wallet` and `Signer` classes support withdrawal workflows. For more details, see
the [`Withdraw`](/sdk/js/ethers/v6/accounts#withdraw) method specification.

For a complete example of how to execute the deposit workflow, take a look at the following:
[Withdraw ETH and ERC20 token](https://github.com/zksync-sdk/zksync2-examples/blob/main/js/src/04_withdraw.ts).
For a complete walkthrough on executing withdrawals, check out this example: [Withdraw ETH and ERC20 token](https://github.com/zksync-sdk/zksync2-examples/blob/main/js/src/04_withdraw.ts).
28 changes: 20 additions & 8 deletions content/sdk/10.js/00.ethers/20.v6/06.contracts.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,25 @@
---
title: Contracts
description:
title: Contract
description: Managing and deploying smart contracts with ZKsync.
tags: ["zksync", "smart contracts", "ethereum", "contractfactory", "erc20 tokens"]
---

`zksync-ethers` does not implement any new `Contract` class, since `ethers.Contract` fully works out of the box.
However, for convenience, the library still re-exports this class.
The `zksync-ethers` library leverages the existing `ethers.Contract` class for smart contract management, ensuring
full compatibility out of the box. For convenience, this class is re-exported within the library.

Since deploying smart contracts on ZKsync has some differences from deploying on Ethereum,
there is a need for a specific `ContractFactory` method. It supports the same interface as `ethers.ContractFactory`.
## Deploying smart contracts

In order to pay for smart contract interactions in ERC20 tokens, `customData` override should be used.
You can read more about accessing ZKsync features in [the features chapter](/sdk/js/ethers/v6/features).
Deploying smart contracts on ZKsync differs slightly from Ethereum. To accommodate these differences, a
specific `ContractFactory` method is provided. This method supports the same interface as `ethers.ContractFactory`.

### ContractFactory

The `ContractFactory` method facilitates the deployment of smart contracts on the ZKsync network. This method is
essential due to the unique requirements of deploying contracts on ZKsync compared to Ethereum.

### Paying with ERC20 tokens

To pay for smart contract interactions using ERC20 tokens, the `customData` override should be utilized. This
feature allows for more flexible payment options within the ZKsync network.

For more details on accessing ZKsync-specific features, refer to the [ZKsync Era Features](/sdk/js/ethers/v6/features).
25 changes: 19 additions & 6 deletions content/sdk/10.js/00.ethers/20.v6/07.utils.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
---
title: Utilities
description:
description: Essential utilities for building on ZKsync Era.
tags: ["zksync", "utilities", "ethereum", "smart contracts"]
---

The [utilities library](https://github.com/zksync-sdk/zksync-ethers/blob/main/src/utils.ts) contains
@@ -269,7 +270,9 @@ const l2ContractAddress = utils.applyL1ToL2Alias(l1ContractAddress);
// l2ContractAddress = "0x813A42B8205E5DedCd3374e5f4419843ADa77FFC"
```

See also [`undol1tol2alias`](#undol1tol2alias).
::callout
See also [`undol1tol2alias`](/sdk/js/ethers/v6/utils#undol1tol2alias).
::

### `checkBaseCost`

@@ -362,7 +365,7 @@ Returns the hash of an EIP712 transaction.
| Parameter | Type | Description |
| --------------- | ---------------------------------------------------------------------- | ---------------------------------------------- |
| `transaction` | `Transaction` or [`TransactionRequest`](/sdk/js/ethers/v6/types#transactionrequest) | EIP-712 transaction. |
| `ethSignature?` | [`EthereumSignature`](/sdk/js/ethers/v6/types#ethereumsignature) | ECDSA signature of the transaction (optional). |
| `ethSignature?` | [`EthereumSignature`](/sdk/js/ethers/v6/types#ethereumsignature) | ECDSA signature of the transaction. |

```ts
function eip712TxHash(transaction: any, ethSignature?: EthereumSignature): string;
@@ -385,8 +388,8 @@ Check out the default bridges documentation.
| `token` | `Address` | Token address. |
| `amount` | `BigNumberish` | Deposit amount. |
| `to` | `Address` | Recipient address. |
| `from?` | `Address` | Sender address (optional). |
| `gasPerPubdataByte?` | `BigNumberish` | Current gas per byte of pubdata (optional). |
| `from?` | `Address` | Sender address. |
| `gasPerPubdataByte?` | `BigNumberish` | Current gas per byte of pubdata. |

```ts
async function estimateDefaultBridgeDepositL2Gas(
@@ -561,8 +564,14 @@ const isValidSignature = await utils.isECDSASignatureCorrect(ADDRESS, message, s
// isValidSignature = true
```

::callout{icon="i-heroicons-exclamation-triangle" color="amber"}
For development and testing, it is recommended to use burner wallets. Avoid using real private keys to prevent security risks.
::

::callout
See also [`isMessageSignatureCorrect()`](#ismessagesignaturecorrect) and [`isTypedDataSignatureCorrect()`](#istypeddatasignaturecorrect)
to validate signatures.
::

### `isEIP1271SignatureCorrect`

@@ -582,8 +591,10 @@ the function returns true if the validation process results in the `EIP1271_MAGI
async function isEIP1271SignatureCorrect(provider: Provider, address: string, msgHash: string, signature: SignatureLike): Promise<boolean>;
```

::callout
See also [`isMessageSignatureCorrect()`](#ismessagesignaturecorrect) and [`isTypedDataSignatureCorrect()`](#istypeddatasignaturecorrect)
to validate signatures.
::

### `isETH`

@@ -774,7 +785,7 @@ Serializes an EIP712 transaction and include a signature if it is provided. Thro
| Parameter | Type | Description |
| ------------- | ----------------- | ---------------------------------------------------------------------- |
| `transaction` | `TransactionLike` | Transaction that needs to be serialized. |
| `signature?` | `SignatureLike` | Ethers signature that needs to be included in transactions (optional). |
| `signature?` | `SignatureLike` | Ethers signature that needs to be included in transactions. |

```ts
function serializeEip712(transaction: TransactionLike, signature?: ethers.SignatureLike): string;
@@ -843,4 +854,6 @@ const l1ContractAddress = utils.undoL1ToL2Alias(l2ContractAddress);
// const l1ContractAddress = "0x702942B8205E5dEdCD3374E5f4419843adA76Eeb"
```

::callout
See also [`applyl1tol2alias`](#applyl1tol2alias).
::
21 changes: 10 additions & 11 deletions content/sdk/10.js/00.ethers/20.v6/08.paymaster-utils.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
---
title: Paymaster Utilities
description:
description: Essential utilities for using paymasters on ZKsync Era.
tags: ["zksync", "paymaster", "blockchain", "ethereum", "cryptocurrency"]
---

The [paymaster utilities library](https://github.com/zksync-sdk/zksync-ethers/blob/main/src/paymaster-utils.ts) contains
essential utilities for using paymasters on ZKsync Era.
The [paymaster utilities library](https://github.com/zksync-sdk/zksync-ethers/blob/main/src/paymaster-utils.ts)
provides key utilities for interacting with paymasters on ZKsync Era.

## Contract interfaces

Constant ABI definition for
the [Paymaster Flow Interface](https://github.com/matter-labs/era-contracts/blob/583cb674a2b942dda34e9f46edb5a9f5b696b90a/l2-contracts/contracts/interfaces/IPaymasterFlow.sol).
Define the constant ABI for the [Paymaster Flow Interface](https://github.com/matter-labs/era-contracts/blob/583cb674a2b942dda34e9f46edb5a9f5b696b90a/l2-contracts/contracts/interfaces/IPaymasterFlow.sol):

```ts
const PAYMASTER_FLOW_ABI = new ethers.Interface(IPaymasterFlowABI);
@@ -19,7 +19,7 @@ const PAYMASTER_FLOW_ABI = new ethers.Interface(IPaymasterFlowABI);

### `getApprovalBasedPaymasterInput`

Returns encoded input for an approval-based paymaster.
Returns the encoded input for an approval-based paymaster.

#### Inputs

@@ -33,7 +33,7 @@ function getApprovalBasedPaymasterInput(paymasterInput: ApprovalBasedPaymasterIn

### `getGeneralPaymasterInput`

As above but for general-based paymaster.
Returns the encoded input for a general-based paymaster.

#### Inputs

@@ -47,8 +47,7 @@ function getGeneralPaymasterInput(paymasterInput: GeneralPaymasterInput): BytesL

### `getPaymasterParams`

Returns a correctly-formed `paymasterParams` object for common
[paymaster flows](https://docs.zksync.io/build/developer-reference/account-abstraction/paymasters#built-in-paymaster-flows).
Returns a correctly-formed `paymasterParams` object for common [paymaster flows](https://docs.zksync.io/build/developer-reference/account-abstraction/paymasters#built-in-paymaster-flows).

#### Inputs

@@ -65,7 +64,7 @@ Find out more about the [`PaymasterInput` type](/sdk/js/ethers/v6/types).

#### Examples

Creating `General` paymaster parameters.
Creating `General` paymaster parameters:

```ts
const paymasterAddress = "0x0a67078A35745947A37A552174aFe724D8180c25";
@@ -75,7 +74,7 @@ const paymasterParams = utils.getPaymasterParams(paymasterAddress, {
});
```

Creating `ApprovalBased` paymaster parameters.
Creating `ApprovalBased` paymaster parameters:

```ts
const result = utils.getPaymasterParams("0x0a67078A35745947A37A552174aFe724D8180c25", {
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
---
title: Smart Account Utilities
description:
description: Utilities for signing payloads and populating transactions with ECDSA and multiple ECDSA keys.
tags: ["zksync", "smart accounts", "ecdsa", "blockchain", "cryptocurrency"]
---

## Functions
@@ -40,6 +41,10 @@ const txHash = EIP712Signer.getSignedDigest(tx);
const result = await utils.signPayloadWithECDSA(txHash, PRIVATE_KEY);
```

::callout{icon="i-heroicons-exclamation-triangle" color="amber"}
For development and testing, it is recommended to use burner wallets. Avoid using real private keys to prevent security risks.
::

Sign message hash.

```ts
Loading