Transfer NFTs (ERC721 Assets)

• Learn how to transfer with gasless for the ERC721 tokens from the Myria L2 to another L2 wallet.
• To inspect the function in the SDK with details payload and response format you can reference SDK Docs.

Prerequisites

• Make sure that you have MINTABLE_ERC721 tokens (such as your minted/purchased NFTs) in the L2 wallet
• You can mint the MINTABLE_ERC721 NFTs in your own collection, which can be referenced at the Minting ERC721 step.
• Or you can purchase the NFTs on Myria Marketplace.
• Or if your L2 wallet received the ERC-721 tokens from Airdrop / Campaign events in either Myria or Gaming Platform.

Transfer process

• Defined the NFTs token (with such of information - collectionID, tokenID, smart contract address) you want to execute the transfer.
• Make sure that you are the owner of the desired burned NFTs (MINTABLE_ERC721)
• Trigger the burn process.
• Query and tracking the status of batch transfer.

Implementation

info

You can find the full React implementation for transferring NFTs (ERC721 tokens) in the Myria React Samples repository.

Transfer NFTs (ERC-721 tokens) can either be performed on the Website or Server side.

• For the website, it is required the browser have a metamask extention to interact with to get a Metamask signature to authorize the owner of the tokens.
• For the server side, it is required for the Myria private key that you can retrieve in the Developer Portal Dashboard.

1. Set up a new React project

Transfer NFTs ERC-721 tokens require client-side interaction with the MetaMask wallet.

It's recommended to use React to implement such behavior.

You can create a React app via Create React App. Note, that the below project relies on the Web3.js library and needs custom configuration.

2. Create a myria-client.ts helper

It's recommended to have a separate .ts file for quick access to the MyriaClient.

For more details, use the Myria Core SDK overview.

3. Trigger the transfer tokens action

You can create the simple React component file with the below implementation such as TransferNFTsComponent.tsx

Sample Code with Details Implementation

   const mClient: IMyriaClient = {
      networkId: Network.SEPOLIA, // This network is coupled along with env - for Mainnet it is 1
      provider: web3Instance.currentProvider,
      web3: web3Instance,
      env: EnvTypes.STAGING, // Env that you're interacting on STAGING/PROD
    };

    const YOUR_NFT_CONTRACT_ADDRESS = "0xA06116D9...."; // Your NFTs smart contract 
    const RECEIVER_WALLET_ADDRESS = '0xd0D8A467E....'; // Your receiver/users wallet address
    const SENDER_WALLET_ADDRESS = '0x724f337bF0F....'; // Must be the owner of tokens, sender wallet address

    const moduleFactory = ModuleFactory.getInstance(mClient);
    const transactionManager = moduleFactory.getTransactionManager();

    const transferredItems: ItemSignableTransferParams[] = [
      {
        quantizedAmount: 1, // Should be 1 as always
        receiverWalletAddress: RECEIVER_WALLET_ADDRESS,
        tokenType: TokenType.MINTABLE_ERC721,
        tokenData: {
          tokenAddress: YOUR_NFT_CONTRACT_ADDRESS,
          tokenId: '1' // Your minted token ID
        },
      },
      {
        quantizedAmount: 1,
        receiverWalletAddress: RECEIVER_WALLET_ADDRESS,
        tokenType: TokenType.MINTABLE_ERC721,
        tokenData: {
          tokenAddress: YOUR_NFT_CONTRACT_ADDRESS,
          tokenId: '2' // Your minted token ID
        },
      },
      {
        quantizedAmount: 1,
        receiverWalletAddress: RECEIVER_WALLET_ADDRESS,
        tokenType: TokenType.MINTABLE_ERC721,
        tokenData: {
          tokenAddress: YOUR_NFT_CONTRACT_ADDRESS,
          tokenId: '3' // Your minted token ID
        },
      },
    ];

    const transferTokenParams: TransferTokenParams = {
      senderWalletAddress: SENDER_WALLET_ADDRESS,
      groupRequestId: '7257d29c-c96a-4302-8eaf-368a0d62b977', // Can use random UUID to generate groupRequestID
      requestId: '9cc6e9e4-aba3-4879-8043-421a0b4dddf8',  // Can use random UUID to generate requestID
      partnerRefId: 'Project-ID', // Project-ID on Myria System
      description: 'Test-Test Bulk Transfer',
      items: transferredItems,
    };

    const transferResult = await transactionManager.bulkTransferNfts(
      transferTokenParams,
    );

4. Query and tracking the status of batch transfer

You can create the simple React component file with the below implementation such as QueryTransferStatus.tsx

Sample Code with Details Implementation

const mClient: IMyriaClient = {
      networkId: Network.SEPOLIA,
      provider: web3Instance.currentProvider,
      web3: web3Instance,
      env: EnvTypes.STAGING,
    };

    const groupRequestID = "7257d29c-c96a-4302-8eaf-368a0d62b977";
    const partnerRefId = "Project-ID"; // Unique Project ID in Myria System
    const moduleFactory = ModuleFactory.getInstance(mClient);
    const transactionManager = moduleFactory.getTransactionManager();
    const result = await transactionManager.getTransactionsByGroupRequestIDAndPartnerRefID(
      groupRequestID,
      partnerRefId
    );

    console.log('Transaction result -> ', result);