import React from 'react';
import { formatMessage } from 'umi-plugin-locale';
import { Icon } from 'antd';

import styles from './style.less';

export interface AccountItemProps {
  title: string;
  message?: string;
  preview?: string;
  onClick?: () => any;
  className?: string;
  showGo?: boolean;
}

const AccountItem: React.FC<AccountItemProps> = ({
  title,
  message = '',
  preview = '',
  onClick,
  className = '',
  showGo = true,
}) => {
  const titleText = formatMessage({ id: title });
  return (
    <div className={`${styles.item} ${className}`} onClick={onClick}>
      <span className={styles.title}>{titleText}</span>
      <span className={styles.message}>{message}</span>
      {preview && <span className={styles.preview}>{preview}</span>}
      {showGo && <Icon className={styles.go} type="right" />}
    </div>
  );
};

export default AccountItem;
