React-AWS S3 for JS Error: The XML you provided was not well-formed or did not validate against our published schema

Question

I am using AWS for first time. I am trying to upload files in multipart in AWS S3 in React. Using AWS S3 for JS v3. I was able to upload images but when I tried to upload any videos or .exe file, it shows the below error.

Uncaught (in promise) MalformedXML: The XML you provided was not well-formed or did not validate against our published schema
    at S3ServiceException.ServiceException [as constructor]

Here is the code of my component

import { Upload } from "@aws-sdk/lib-storage";
import { S3Client, S3 } from "@aws-sdk/client-s3";

const Screen = () => {

    const upload = (file) =>{
        var file = file.target.files[0]

        const target = { Bucket:"name", Key: file.name, Body:file };
        const creds = {accessKeyId:"", secretAccessKey:""}
        try {
            const parallelUploads3 = new Upload({
            client: new S3Client({region:"ap-south-1",credentials:creds }),
            leavePartsOnError: false,
            params: target,
            });

            parallelUploads3.on("httpUploadProgress", (progress) => {
            console.log(progress);
            });

        parallelUploads3.done();
        } catch (e) {
            console.log(e);
        }
    }   

    return (
        <>
            <input type='file' onChange={upload} />
        </>
    )
} 

Is there any configuration that I missed? The file gets uploaded when i add the partition as below

client: new S3Client({region:"ap-south-1",credentials:creds }),
partSize: '5MB',
leavePartsOnError: false

But the app crashes when i upload files of greater size like 1+GB.

Any idea how this can be fixed. Please let me know if you need further details. Or any other approach that you would suggest!