So we are currently free tier of the vercel for our nextjs app and it has started throwing this 402 error in the console and images fail to load:

Failed to load resource: the server responded with a status of 402 ()

While i do understand we need to bump up our tier since free tier can only allow upto specific number of image optimisations, 1000? yea?

but bumping the tier is not an option here so i checked docs and we could add the boolean "unoptimized" to make such components load with image optimization off.

this is my code:

const CardImage = ({ src, alt, height, width, className }: CardImageProps) => {
   return (
      <>
         <Image
            src={`${src}`}
            height={height}
            width={width}
            className={`${className}`}
            alt={alt}
            loading="eager"
            priority
            unoptimized
         />
      </>
   );
};

Could anyone explain what to do at this point?