Web Developer

<Typography id="modal-modal-description" sx={{ mt: 2 }} onClick={()=>fileInput.current.click()}>           <img src={Gallery} style={{ height:'4vh',width:'4vw'}}    /> <span >Upload from Gallery</span>           <input type="file" ref={fileInput} accept='.jpg,.jpeg,.png'  name="file" style={{display:'none'}}  onChange={handleFileChange}/>           </Typography> 5:46 Gaurav pandey const handleFileChange = (e) => {     const file = e.target.files[0];     console.log(file);     setSelectedFile(file);     handleUpload(file);     // const imageUrl = URL.createObjectURL(file);     // setPicture(imageUrl);     setOpen(false);   }; ...

  import React , { useEffect , useState } from 'react' import { ToastContainer , toast } from '../../../node_modules/react-toastify' ;   import '../../../node_modules/react-toastify/dist/ReactToastify.css' ;   import Swal from '../../../node_modules/sweetalert2' ; import { useRef , useCallback } from 'react' ; import Webcam from '../../../node_modules/react-webcam' ; import './style/WebcamComponent.css' ;   // Create a CSS file for styling import { FiArrowLeft } from "react-icons/fi" ; import topImg from '../../Assets/babybump/Group.png' ; // import topImg from '../assets/Group.png'; // import leftImg from '../assets/Vector 1762.png'; import leftImg from '../../Assets/babybump/Vector 1762.png' ; // import phoneImg from '../assets/Group 39286.png'; import phoneImg from '../../Assets/babybump/Group 39286.png' ; // import trashImg from '../asse...