Troubleshooting Carousel Item Conflicts in Next.js with 'react-multi-carousel'

[amirshnll]

Describe the bug
I am utilizing "react-multi-carousel" to create four carousels on a single page in Next.js. To render images in these carousels, I make a request to my backend to retrieve image data. I create image items using var1.map... and incorporate them using the <Image> tag in Next.js. However, I am encountering an issue where the items in the carousels are getting mixed up and swapped between the carousels. Interestingly, when I use the standard HTML <img> tag, everything works fine, but the problem arises when I switch to the Next.js <Image> tag. Additionally, this bug does not appear in the development mode, but it manifests after the build process.