Skip to content

Instantly share code, notes, and snippets.

@technophile-04

technophile-04/page.tsx

Created May 8, 2025 09:06
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save technophile-04/440c3844aa9f8163b38fa10b313356b6 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save technophile-04/440c3844aa9f8163b38fa10b313356b6 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. technophile-04 revised this gist May 8, 2025. No changes.
  2. technophile-04 created this gist May 8, 2025.
    43 changes: 43 additions & 0 deletions page.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,43 @@
    "use client";

    import type { NextPage } from "next";
    import { erc20Abi } from "viem";
    import { useAccount, useWriteContract } from "wagmi";
    import { useTransactor } from "~~/hooks/scaffold-eth";

    const ERC20_ABI = erc20Abi;

    const Home: NextPage = () => {
    const { address: connectedAddress } = useAccount();

    // Dynamic address
    const dynmaicAddress = "0x0000000000000000000000000000000000000000";

    // Using wagmi write hook
    const { writeContractAsync } = useWriteContract();

    // Using scaffold-eth transactor hook
    const writeTx = useTransactor();

    const handleButtonClick = async () => {
    // First we create a function that will be used to write to the contract (passing args to wagmi's write hoook)
    const makeWriteWithParams = () =>
    writeContractAsync({
    abi: ERC20_ABI,
    address: dynmaicAddress,
    functionName: "transfer",
    args: [connectedAddress || "", 100n],
    });

    // Then we use the transactor hook to send the transaction
    await writeTx(makeWriteWithParams);
    };

    return (
    <>
    <button onClick={handleButtonClick}>Click me</button>
    </>
    );
    };

    export default Home;