Skip to content

near-examples/frontend-multiple-contracts

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Interact With Multiple Contracts

A frontend-only example showing how to interact with multiple contracts simultaneously.

What This Example Shows

  1. How to view methods in multiple contracts
  2. How to call methods in multiple contracts simultaneously

Multiple Transactions

near-api-js allows to dispatch multiple transactions simultaneously, so the user interacts with the wallet only once. However, the transactions remain independent.

const guestTx = {
  receiverId: GUEST_ADDRESS,
  actions: [
    // You can batch actions against a contract: If any fails, they ALL get reverted 
    {
      type: 'FunctionCall',
      params: {
        methodName: 'add_message', args: { text: greeting.value },
        gas: THIRTY_TGAS, deposit: GUEST_DEPOSIT
      }
    }
  ]
}

const helloTx = {
  receiverId: HELLO_ADDRESS,
  actions: [
    {
      type: 'FunctionCall',
      params: {
        methodName: 'set_greeting', args: { greeting: greeting.value },
        gas: THIRTY_TGAS, deposit: NO_DEPOSIT
      }
    }
  ]
}

// Ask the user to sign the **independent** transactions
await wallet.signAndSendTransactions({ transactions: [ helloTx, guestTx ] })

In this example, the user signs two independent transactions:

  1. A transaction to call set_greeting in our Hello NEAR example
  2. A transaction to call add_message in our GuestBook example

Important Note: Even when the user accepts signing the transactions at the same time, the transactions remain independent. This is, if one fails, the other is NOT rollback.

In NEAR, only Actions against a same contract can be batched, so if one action fails they all get reverted.

Quickstart

Clone this repository locally or open it in gitpod. Then follow these steps:

1. Install Dependencies

npm install

2. Start the Frontend

Start the web application to interact with your smart contract

npm start

Learn More

  1. Learn more about the contract through its README.
  2. Check our documentation.

About

An example on how to interact with multiple contracts from a frontend

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 59.1%
  • CSS 24.5%
  • HTML 16.4%