# 🧙 OnchainMagic 🧙

By [James Quinn](https://paragraph.com/@james-quinn) · 2023-11-02

---

On Oct 26th, I launched the [OnchainMagic](https://www.onchainmagic.xyz/) ERC1155, ERC721 feed comment feature, similar to Instagram.

On this page, users can generate ERC1155 or ERC721 using comments (Zora's mintWithRewards) and users can view the comments in the on-chain storage.

And Integration of the ERC155, ERC721 [mintWithRewards](https://docs.zora.co/docs/smart-contracts/creator-tools/rewards) functionality. 🔌

![📲 Mobile First UI 📲](https://storage.googleapis.com/papyrus_images/cfdc16bd7d2c70fca1bafb73604e2444c257d4e9c83139895b9d06770990c556.png)

📲 Mobile First UI 📲

**Codebase**
============

*   **use1155Collect**
    

    .........
    
    const use1155Collect = (dropAddress, tokenId, comment = "🪄🪄🪄") => {
      ............
      ............
      const totalFee = BigNumber.from(publicSalePrice).add(zoraFee).toHexString()
      const totalFeeAsNumber = parseFloat(totalFee)
      const hasBalanceToPurchase = totalFeeAsNumber !== parseFloat(balance)
    
      const minterArguments = useMemo(() => {
        if (zorbOwner || connectedWallet)
          return defaultAbiCoder.encode(["address", "string"], [zorbOwner || connectedWallet, comment])
      }, [zorbOwner, connectedWallet, comment])
    
      const collect1155 = async () => {
        if (!prepare()) return
        if (!hasBalanceToPurchase) {
          toast.error("insufficient funds. please refill your wallet.")
          return
        }
    
        await sendTransaction(
          dropAddress,
          chainId,
          abi,
          "mintWithRewards",
          [minterAddress, tokenId, 1, minterArguments, createReferral],
          totalFee,
          "1 EDITION",
          comment ? "Comment" : "Collect",
          comment ? "Commented!" : "Collected!",
        )
      }
    
      return { collect1155, minterAddress }
    }
    
    export default use1155Collect
    

*   **use721Collect**
    

    .........
    
    const use1155Collect = (dropAddress, tokenId, comment = "🪄🪄🪄") => {
      ............
      ............
      const totalFee = BigNumber.from(publicSalePrice).add(zoraFee).toHexString()
      const totalFeeAsNumber = parseFloat(totalFee)
      const hasBalanceToPurchase = totalFeeAsNumber !== parseFloat(balance)
    
      const totalFee = BigNumber.from(publicSalePrice).add(zoraFee).toHexString()
      const totalFeeAsNumber = parseFloat(totalFee)
      const hasBalanceToPurchase = totalFeeAsNumber !== parseFloat(balance)
    
      const collect721 = async () => {
        if (!prepare()) return
    
        if (!hasBalanceToPurchase) {
          toast.error("insufficient funds. please refill your wallet.")
          return
        }
    
        await sendTransaction(
          dropAddress,
          chainId,
          abi,
          "mintWithRewards",
          [zorbOwner || connectedWallet, 1, comment, createReferral],
          totalFee,
          "1 EDITION",
          comment ? "Comment" : "Collect",
          comment ? "Commented!" : "Collected!",
        )
      }
    
      return { collect721 }
    }
    
    export default use1155Collect
    

*   **usePrivySendTransaction**
    

    ................................
    
    const usePrivySendTransaction = () => {
      const { sendTransaction: privySendTransaction } = usePrivy()
    
      const sendTransaction = async (
        to,
        chainId,
        abi,
        functionName,
        args,
        value = BigNumber.from("0").toHexString(),
        description = "",
        buttonText = "",
        customSuccessMessage = null,
      ) => {
        try {
          const data = new Interface(abi).encodeFunctionData(functionName, args)
          const unsignedTx = {
            to,
            chainId,
            data,
            value,
          }
    
          const uiConfig = {
            header: "OnchainMagic🪄",
            description,
            buttonText,
          }
    
          const txReceipt = await privySendTransaction(unsignedTx, uiConfig)
          .............................
    
          return txReceipt.transactionHash
        } catch (error) {
          ........................
          console.error("errorrr", error)
          return { error }
        }
      }
    
      return {
        sendTransaction,
      }
    }
    
    export default usePrivySendTransaction
    

**High quality work** achieved **super fast delivery**. 🌄⚡️🌄

I am proud that I can be of some help in generating profits for musicians who create music NFTs. 😉

---

*Originally published on [James Quinn](https://paragraph.com/@james-quinn/onchainmagic)*