import React from 'react';
import PropTypes from 'prop-types';

import '../base';
import { visualProvided } from './VisualProvider';
import Icon from './Icon';
import styles from './List.EmptyItem.styl';

function EmptyListItem({ t, children, customEmptyIcon = undefined }) {

  return (
    <div className={styles.container}>
      <div className={styles.icon}><Icon name={customEmptyIcon || 'doka-icon-confused'} /></div>
      <span className={styles.children}>{children || t('listEmptyMessage')}</span>
    </div>
  );
}

EmptyListItem.propTypes = {
  children: PropTypes.node
};

EmptyListItem.defaultProps = {
  children: undefined
};

export default visualProvided(EmptyListItem);