Using Next.js 14 App Router with Typescript.
I created a component with Image list mosaic,
The idea behind it is to create a mosaic form of gallery of images,
each image will not have fixed size but different size depends on the image.

however i have problem with 2 problem,
first is the placeholder of the image is not shown before the full upload of the image (supposed to be solid dominant color as image.background)
second seems like layout="responsive" is a legacy and not supporting anymore,
i tried to follow examples from the documentations but got lost in it,
will really appreciate any help

I attached image to show code snippet and how the gallery is looks like