import React, {Component} from 'react'
import {MdThumbDown, MdThumbUp} from 'react-icons/lib/md'
import Button from 'components/utils/button'
import classNames from 'classnames/bind'

let cx = classNames.bind(require('styles/blacklist.scss'))

export class Blacklist extends Component {
  render() {
    let title = 'Blacklister'
    let text = 'Par défaut ce candidat n’apparaitra dans la liste des candidats disponibles quand vous créez une nouvelle mission'
    let button = <Button icon={MdThumbDown} onClick={this.props.on_dismiss}>{title}</Button>
    return (
      <GenericPopover text={text} button={button}/>
    )
  }
}

export class Whitelist extends Component {
  render() {
    let title = 'Re-Intégrer'
    let text = 'Par défaut ce candidat apparaitra dans la liste des candidats disponibles quand vous créez une nouvelle mission'
    let button = <Button icon={MdThumbUp} onClick={this.props.on_dismiss}>{title}</Button>
    return (
      <GenericPopover text={text} button={button}/>
    )
  }
}

const GenericPopover = (props) => {
  return (
    <div className={cx('blacklist')}>
      <div className={cx('blacklist__text')}>
        {props.text}
      </div>
      {props.button}
    </div>
  )
}