import * as React from 'react';
import styles from './ArtistCard.scss';
import classNames from 'classnames/bind';
import { Link } from 'react-router-dom';
import Img from './Img';
import { IArtist } from 'metarare';

const cx = classNames.bind(styles);

export interface IArtistCardProps extends IArtist {
  className: string;
}

export default function ArtistCard ({
  id,
  name,
  thumbnail_image,
  className
}: IArtistCardProps) {
  return (
    <div className={cx("artist_card", className )}>
      <div className={cx("card_wrap")}>
          <div className={cx("thumb_area")}>
              <Img
                src={thumbnail_image}
                alt=""
                width="260"
                height="260"
                className={cx("thumb")}
              />
           
          </div>
          <div className={cx("info_area")}>{name}</div>
      </div>
    </div>
  );
}
