TypeError: Cannot read properties of null (reading 'files')

i'm creating a form that requires image upload but it's throwing an error "TypeError: Cannot read properties of null (reading 'files')"....

This is my code.... function ImageUpload({ files, setFile }) { const { useState } = React;

const [message, setMessage] = useState(); const handleFile = (e) => { setMessage(""); let file = e.target.files;

for (let i = 0; i < file.length; i++) {
  const fileType = file[i]["type"];
  const validImageTypes = ["image/gif", "image/jpeg", "image/png"];
  if (validImageTypes.includes(fileType)) {
    setFile([...files, file[i]]);
  } else {
    setMessage("only images accepted");
  }
}

};

const removeImage = (i) => { setFile(files.filter((x) => x.name !== i)); };

const client = new Client() .setEndpoint(String(process.env.NEXT_PUBLIC_APPWRITE_URL)) .setProject(String(process.env.NEXT_PUBLIC_ENDPOINT)); const storage = new Storage(client);

const promise = storage.createFile( (String(process.env.NEXT_PUBLIC_BUCKET_ID),file), ID.unique(), document.getElementById("uploader").files[0] );

promise.then(function (response) { console.log(response); // Success }, function (error) { console.log(error); // Failure });

return (

please help

Btw, it's best to use 3 back ticks with multi-line code. See https://www.markdownguide.org/extended-syntax/#syntax-highlighting

What's the full stack trace? I'm not sure if the error is on the Appwrite side. It might be your code before Appwrite