Wrapper around Next Image component

interface ImageFromBucket {
  props: ImageProps;
  src: string;
  alt?: string;
  className?: string;
  height?: number;
  width?: number;
  loader?: any;
}

const ImageFromBucket = ({ props, src, alt = '', className, height, width, loader }: ImageFromBucket) => {
  const [imageSrc, setImageSrc] = useState<string>(src);
  const [mutation, { error, loading }] = useMutation(GET_IMAGE);

  useEffect(() => {
    getPresignedUrlMutation({
      variables: {
        key: src,
      },
    }).then(data => {
      // ...
    });
  }, [mutation, src]);

  return <Image {...props} className={className} src={src} alt={alt} height={height} width={width} loader={loader} />;
};

export default ImageFromBucket;