fix: add function to get vtex product image in properly ratio

[IncognitaDev]

What is this contribution about?

The Vtex API returns the main image URL without sizes, which always returns the image in the biggest size in its proper ratio. However, it is common to use a default image ratio in shelves and PDPs. To do this, the required image sizes are necessary in the image URL so that the platform can fill blank spaces with a white background and guarantee that the image always fits the required ratio.

This PR adds a function that adds size to Vtex product image URLs to prevent cropping by the image component. This is important for stores that can contain multiple image ratios.

How to test it?

without the feature: https://deco-sites-openbox2-x160rqmdqg80.deno.dev/sofa-retratil-e-reclinavel-omega-200m-velosuede-11001207/p

with feature: https://deco-sites-openbox2-wrnw2rw39amg.deno.dev/sofa-retratil-e-reclinavel-omega-200m-velosuede-11001207/p

[tlgimenes]

This happens because the original image is in 412x274 and you are rendering an <Image witdh=488 height=488/>

Here's an example with <Image width=412 height=274/> with the right aspect without doing any modification to the code: https://deco-sites-openbox2-x160rqmdqg80.deno.dev/live/invoke/deco-sites/std/loaders/x/image.ts?src=https%3A%2F%2Fopenbox.vteximg.com.br%2Farquivos%2Fids%2F210606%2Fimage-242a601683c24e67a7b625044f49a58f.jpg%3Fv%3D638258192696630000&fit=cover&width=412&height=274

[IncognitaDev]

Yes, but the store has many ratios, some images can be square, other vertical rectangle and horizontal rectangle, and the web vitals recommend to use width and height on images tag, so, to use this props without crop the image when ration can change i think get they in properly ratio of vtex its a better solution.

[IncognitaDev]

actualy, i think image component should have option to crop or fit the image in required width and height.