const [file, setFile] = useState(null); const [json, setJson] = useState(null); const [attribute, setAttribute] = useState(null); const [isPanelOpen, setIsPanelOpen] = useState(false); const uploadFileUpdateState = (body) => { asyncFetch("https://ipfs.near.social/add", { method: "POST", headers: { Accept: "application/json" }, body, }).then((res) => { const cid = res.body.cid; setFile(cid); asyncFetch(`https://ipfs.near.social/ipfs/${cid}`).then((res) => { setJson(res.body); }); }); }; const filesOnChange = (files) => { if (files) { setFile({ uploading: true, cid: null }); uploadFileUpdateState(files[0]); } }; return ( <div className="d-inline-block" id="deneme"> {json ? <p>{JSON.stringify(json)}</p> : null} <Files multiple={false} accepts={["application/json"]} clickable className="btn btn-outline-primary" onChange={filesOnChange} > {file.uploading ? <>Uploading</> : "Upload an Json "} </Files> </div> );