import Image from "next/image";
import { type ComponentProps } from "react";

const fallbackImage = "/fallback-image.png";
export const ImageFlbk = (props: ComponentProps<typeof Image>) => {
  return (
    <Image
      {...props}
      onLoad={(e) => {
        if (e.currentTarget.naturalWidth === 0) {
          e.currentTarget.src = fallbackImage;
        }
      }}
      onError={(e) => {
        e.currentTarget.src = fallbackImage;
      }}
    />
  );
};
