/* eslint-disable react/prop-types */
import React from 'react';
import LazyImage from '~hooks/lazy-image';
import { imagePrettyUrl } from '~helpers/getters';

import verify from '../../../images/verify.svg';
import styles from './author.module.scss';

const AuthorAndVerify = ({ authorName, authorImage, imgWidth = 30, imgHeight = 30 }) =>
  authorImage && (
    <div className={styles.authorVerifyContainer}>
      <LazyImage
        alt={authorName}
        src={imagePrettyUrl(authorImage, imgWidth, imgHeight)}
        width={imgWidth}
        height={imgHeight}
      />
      <LazyImage src={verify} alt="verify" width={10} height={10} />
    </div>
  );

export default AuthorAndVerify;
