Not able to get thumbUrl for dragger in ant design while uploading file on onChange Function

Question

While uploading the file for ant Design dragger. I tried to find many ways to solve this issue but didn't get any solution. As to display the image I need a base64 image.

import {Upload} from 'antd';

const { Dragger } = Upload;

function Add(props){
  const {form} = props;
  const draggerProps = {
    listType: 'picture',
    name: 'file',
    multiple: true,
    maxCount: 5,
    accept: 'image/*',
    beforeUpload() {
      return false;
    },
    onChange(info) {
      const { fileList,file } = info;
      console.log(file, fileList, 'fileList');
      form.setFieldsValue({ images: fileList });
      console.log(form.getFieldsValue(), 'form');
    }
  }
  return(
    <>
      <div className="image-upload-container-wrapper">
        <Dragger {...draggerProps}>
          <p className="ant-upload-drag-icon">
            <img src={FieldImagePlaceholder} alt="Field Placeholder" />
          </p>
          <p className="ant-upload-text">
            <span className="dragger-text-blue">Select</span> or Drag and Drop Images
          </p>
        </Dragger>
      </div>
    </>
  );
}
export default Add;

While adding photo to dragger I did't get thumbUrl for the same file but for all previous file I am getting the thumbUrl.

Here is the console while uploading first image:

Here is the console while uploading second image: