import React from 'react';
import './UpgradeIcon.css';
import availableImage from '../../assets/images/release_available.png';
import ReactTooltip from 'react-tooltip';

export default props => {
  let placement = 'left';
  let toolTipText = 'UI Upgrade Available';
  if (props.release) {
    placement='bottom';
    toolTipText = 'New Release Available';
  }

  return props
    .available ?
    (
      <div className={'UpgradeIconOwner'}>
        <p data-tip='' data-for={placement}>
          <img alt=''
               onClick={props.clicked}
               src={availableImage}
               className={'UpgradeIcon'}/>
        </p>
        <ReactTooltip id={placement} place={placement}>{toolTipText}</ReactTooltip>
      </div>
    )
    : null;
};