form with input type file not showing up in frontend

[krishnadude98]

My code

import nftMarketplaceAbi from "../../constants/NftMarketplace.json";
import nftAbi from "../../constants/BasicNft.json";
import { useWeb3Contract } from "react-moralis";
import { chainId } from "react-moralis";
import networkMapping from "../../constants/networkMapping.json";
import { ethers } from "ethers";
import { useMoralis } from "react-moralis";
import styles from "@/styles/Home.module.css";

export default function mintNft() {
  const { web3, isWeb3Enabled } = useMoralis();

  const marketplaceAddress =
    networkMapping[chainId ? chainId : 11155111]["nftMarketplace"][0];

  return (
    <div className={styles.container}>
      <div className="bg-scroll  h-screen">
        <Form
          // onSubmit={approveAndList}
          data={[
            {
              name: "name",
              type: "text",
              inputWidth: "50%",
              value: "",
              key: "name",
            },
            {
              name: "image",
              type: "file",
              onChange: {}, // Handle file change event
            },
            {
              inputWidth: "100%",
              name: "Image",
              type: "file",
              value: "",
            },
            {
              name: "description",
              type: "text",
              inputWidth: "50%",
              value: "",
              key: "description",
            },
          ]}
          title="Mint Your Nft"
          id="MainForm"
        />
      </div>
    </div>
  );
}```

my frontend not contain the image section

[billgil]

hey @krishnadude98 Form was never updated to support the contribution of file upload. This library is pretty depreciated, i would recommend using https://react-hook-form.com/

I hope to rebuild it some time in the not too distant future, but for sure React Form hook is always your best bet