/**
 * Image Component
 */

import React from "react";

import "./image.scss";

import { Image } from "antd";

import PropTypes from "prop-types";

// import 'antd/dist/antd.css';
// import { src } from './../../rc-image-lib/image';

/**
 * Use `Image` for Image you need to keep.
 */
export default function ImageWrapper({ src, className, width = 150 }) {
  return (
    <div className={`image-box ${className}`}>
      <Image width={width} src={src} />
    </div>
  );
}

ImageWrapper.propTypes = {
  /** The source URL of the image. */
  src: PropTypes.string.isRequired,
  
  /** A custom class name for the image wrapper component. */
  className: PropTypes.string,

  /** The width of the image, in pixels. */
  width: PropTypes.number,

  /**  An optional click handler function that will be called when the image wrapper is clicked. */
  onClick: PropTypes.func,
};

ImageWrapper.defaultProps = {
  className: "",
  width: 150,
  onClick: null,
};
