Изображение Nextjs GraphCms слишком большое, как использовать значение преобразования

Question

Я использую функцию преобразования GraphCms в своем запросе, например:

      image {
    width
    height
    url(transformation: {image: { resize: { width:$imageWidth, fit: clip } }
                        document: { output: { format: webp } }
                    })
    altText
}

но когда я использую изображение как

      <Image
   src={image.url}
   alt={String(image.altText)}
   width={Number(image.width)}
   height={Number(image.height)}/>

изображение слишком большое, и мой макет испорчен :(

Есть ли способ использовать фактически измененный размер?

Если нет, то в какую сторону повернуть?

Единственный способ, который приходит на ум, - создать константу с размером ширины и выполнить некоторые вычисления с фактической шириной и высотой, но мне кажется, что это требует много времени :(