/* eslint-disable @next/next/no-img-element */ import React from "react"; import cls from "./fallbackImage.module.scss"; import Image from "next/image"; type Props = { src?: string; alt?: string; fill?: boolean; sizes?: string; quality?: number; priority?: boolean; width?: number; height?: number; onError?: (e: React.SyntheticEvent) => void; style?: React.CSSProperties; }; export default function FallbackImage({ src, alt = "image", onError, style, fill, width, height, }: Props) { const isValidSrc = src && (src.startsWith("/") || src.startsWith("http://") || src.startsWith("https://")); if (!isValidSrc) { console.error("Invalid image source:", src); return null; // Prevent rendering if src is invalid (author: @frenchfkingbaguette) } return ( {alt} { (e.target as HTMLImageElement).style.visibility = "hidden"; onError?.(e); }} /> ); }