Upload image to S3 in React + Typescript

aws_config.js

import Amplify, { Auth, Storage } from 'aws-amplify';

Amplify.configure({
    Auth: {
        identityPoolId: 'XX-XXXX-X:XXXXXXXX-XXXX-1234-abcd-1234567890ab', //REQUIRED - Amazon Cognito Identity Pool ID
        region: 'XX-XXXX-X', // REQUIRED - Amazon Cognito Region
        userPoolId: 'XX-XXXX-X_abcd1234', //OPTIONAL - Amazon Cognito User Pool ID
        userPoolWebClientId: 'XX-XXXX-X_abcd1234', //OPTIONAL - Amazon Cognito Web Client ID
    },
    Storage: {
        AWSS3: {
            bucket: '', //REQUIRED -  Amazon S3 bucket name
            region: 'XX-XXXX-X', //OPTIONAL -  Amazon service region
        }
    }
});

uploadImageInReact.ts

const [file, setFile] = useState<File>()
  
async function uploadImage() {
  const path = "my/path/your/path"
  const fileName = "fileName"
  const fileExtention = file?.name.split('.').pop()
  const key = `${path}/${fileName}.${fileExtention}`
  
  return await Storage.put(key, file, { level: 'public' })
}