Next Image

{shopImg && (
            <Image
              src={shopImg}
              alt="My Image"
              width={500}
              height={200}
              className={clsx('object-cover object-center', {
                'h-56 w-full': isImageLoaded,
                'hidden ': !isImageLoaded,
              })}
              onLoadingComplete={handleImageLoad}
              priority={true}
            />
          )}
          {!isImageLoaded && (
            <div className="h-56 w-full animate-pulse rounded-t-2xl bg-gray-300"></div>
          )}