Square CreditCard payment in Reactjs

Question

I am trying to integrate react-square-web-payments-sdk , Need to add creditcard holder name field in the paymentform and how can i mention the amount to be deducted from card to do that please check the below code and let me know still i need to add anything more.

I have installed react-square-web-payments-sdk and added creditCard in paymentform and getting the fields like cardnumber, mm/yy, cvv. and zipcode, But i need Cardholder name and no need of zip code, How can i do that and from my below code how can i show how much money to be deducted. Below is my component.

const Payment = () => {
  const [errorMessage, setErrorMessage] = useState(null);
  
  const onNonceGenerated = async (error, nonce) => {
    if (error) {
      setErrorMessage(error.message);
      return;
    }


    // Your code to process the payment
    try {
      // Call your server to process the payment
      const response = await fetch("/process-payment", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({ nonce }),
      });
      console.log(response, "resp");
      if (!response.ok) {
        throw new Error("Failed to process payment");
      }

      // Payment was successful
      alert("Payment successful!");
    } catch (error) {
      setErrorMessage(error.message);
    }
  };

  return (
    <div className="container">
      {errorMessage && <p>{errorMessage}</p>}
      <PaymentForm
        applicationId="sandbox-Id"
        locationId="locationId"
        cardTokenizeResponseReceived={async (token, verifiedBuyer) => {
            console.log(token,"token");
            console.log(verifiedBuyer,"verifiedBuyer");
            const response = await fetch("/api/pay", {
              method: "POST",
              headers: {
                "Content-type": "application/json",
              },
              body: JSON.stringify({
                sourceId: token.token,
              }),
            });
            console.log(await response.json());
          }}
      >
        
        <CreditCard
          buttonProps={{
            css: {
              backgroundColor: "#E56B6F",
              fontSize: "14px",
              color: "#fff",
              "&:hover": {
                backgroundColor: "#E56B6F",
              },
            },
            
          }}
          
        />
      </PaymentForm>
    </div>
  );
};