How to deposit eth to contract writen in solidity on front-end app using useDapp

Question

Given i have this smart contract in remix

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;

contract DepositWithdraw {
    mapping(address => uint256) private balances;

    event Deposit(address indexed depositor, uint256 amount);
    event Withdrawal(address indexed withdrawer, uint256 amount);

    function deposit() public payable {
        balances[msg.sender] += msg.value;
        emit Deposit(msg.sender, msg.value);
    }

    function withdraw(uint256 amount) public {
        require(balances[msg.sender] >= amount, "Insufficient balance");
        balances[msg.sender] -= amount;
        payable(msg.sender).transfer(amount);
        emit Withdrawal(msg.sender, amount);
    }

    function balanceOf(address account) public view returns (uint256) {
        return balances[account];
    }
}

Deposit by remix ide works, but when I'm trying to deposit using useDapp lib in javascript by using useContractFunction I can't pass the amount to deposit. When I'm redirected to meta mask to accept transaction there is no amount shown.

my front-end code:

import { Contract } from 'ethers';
import { Interface } from 'ethers/lib/utils';
import { useContractFunction } from '@usedapp/core';
const contractAddress = // my contract address;
const ABI = new Interface(
  //...copied contract ABI from remix
);

const contract = new Contract(contractAddress, ABI);
const { send } = useContractFunction(contract, 'deposit');
// send(value) will error that deposit function argument length is no correct (it want 0 arguments)

tried adding third argument with options to useContractFunction but no success. When i call send without arguments it will process to metamask but no amount shown, only gas fees any ideas?

score 0 · Answer 1 · answered Mar 01 '23 at 22:47

I think the issue is that you are not passing the value of deposit to the send function correctly.

The send function should be called like this:

send({ value: 1 })

Here you can find more details about useContractFunction https://usedapp-docs.netlify.app/docs/guides/transactions/contract%20functions/

How to deposit eth to contract writen in solidity on front-end app using useDapp

1 Answers1