Untitled

import { useWeb3 } from "@components/provider"
import { Loader } from "@components/ui"
import { useAccount } from "@components/web3/hooks"
import { useState } from "react"
import { RiContactsBookLine } from "react-icons/ri"



const Input = ({ placeholder, name, type, value, handleChange }) => (
    <input 
      placeholder={placeholder}
      type={type}
      min="0.0000"
      step="0.0001"
      value={value}
      onChange={(e) => handleChange(e, name)}
      className="my-2 w-full rounded-sm p-2 outline-none bg-transparent text-white border-none text-sm white-glassmorphism"
    />
  )

export default function SetForm() {
  const { isLoading, contract, provider, providerUrl, web3 } = useWeb3()
  const { account } = useAccount()
  const [txLoading, settxLoading] = useState(false)
  const [formData, setformData] = useState({ addressTo: "", amount: "", keyword: "", message: "" })
  // const toBN = value => web3.utils.toBN(value)
  // const toWei = value => web3.utils.toWei(String(value))

  const handleChange = (e, name) => {
    setformData((prevState) => ({ ...prevState, [name]: e.target.value }))
  };

  const handleSubmit = (e) => {
    const { addressTo, amount, keyword, message } = formData
    
    e.preventDefault()

    if(!addressTo || !amount || !keyword || !message ) return

    sendTx(web3)
  }

  

const sendTx = async (web3) => {
  if (web3) {
    const { addressTo, amount, keyword, message } = formData
    const parsedAmount = web3.utils.toWei(amount, "ether")
    const data = {from: account.data, to: addressTo, gas: "0x5208", value: parsedAmount}
    data = JSON.parse(JSON.stringify(data))
    try {
      const resultTx = await web3.eth.sendTransaction(data) 
      console.log(resultTx)
      // const receipt = await web3.eth.getTransactionReceipt() ----> su yontemi kullanarak "sendTransaction"i teyit etmem lazim. ve hemen asagida bulunan "addToBlockchain"i bu konfirmasyondan sonra calistirmam lazim
      const resultAdd = await contract.methods.addToBlockchain(
        addressTo,
        parsedAmount,
        keyword,
        message
        ).send({from: account.data})
      console.log(resultAdd)
    } catch (error) {
      console.log(error)
      throw new Error("No ethereum object")
    }
  }
}

  return (
      
    <div className="p-5 sm:w-96 w-full flex flex-col justify-start items-center blue-glassmorphism">
        <Input placeholder="Address To" name="addressTo" type="text" handleChange={handleChange} /> 
        <Input placeholder="Amount (ETH)" name="amount" type="number" handleChange={handleChange} />
        <Input placeholder="Keyword (Gif)" name="keyword" type="text" handleChange={handleChange} />
        <Input placeholder="Enter Message" name="message" type="text" handleChange={handleChange} /> 
       
        <div className="h-[1px] w-full bg-gray-400 my-2" />

        { false ? (
          <Loader />
        ) : (
          <button
            type="button"
            onClick={handleSubmit}
            className="text-white w-full mt-2 border-[1px] p-2 border-[#3d4f7c] rounded-full cursor-pointer"
          >
            Send Now
          </button>
        )}
    </div>
    )
}