"use client";

// import Image from "next/image";
import React from "react";

const ImageWithFallback = (props: {
  src: string;
  alt: string;
  className: string;
}) => {
  // const [imgSrc, setImgSrc] = useState(props.src);

  // console.log("img: ", props?.src);
  // console.log("imgSrc: ", imgSrc);

  return (
    // <Image
    //   width={300}
    //   height={450}
    //   // src={props?.src}
    //   // alt={props?.alt}
    //   // {...props}
    //   src="http://images.amazon.com/images/P/0440234743.01.LZZZZZZZ.jpg"
    //   alt="asd"
    //   onError={(error) => {
    //     console.log("error: ", error?.target);
    //     console.error("Image loading failed. Error target:", error.target);
    //     console.error("Switching to fallback URL.");
    //     setImgSrc(
    //       // "https://davidkoepp.com/wp-content/themes/blankslate/images/Movie%20Placeholder.jpg"
    //       "https://www.claws.in/static/book-cover-placeholder-e1563706855534.jpg"
    //     );
    //   }}
    // />
    <img src={props?.src} alt={props?.alt} width={300} height={450} />
  );
};

export default ImageWithFallback;
