import React from 'react'
import classNames from 'classnames'

import Style from './style.less'

function computeLevel (num) {
    switch (true) {
      case num >= 200:
        return 13;
      case num > 100:
        return 12;
      case num > 50:
        return 11;
      case num > 40:
        return 10;
      case num > 30:
        return 9;
      case num > 20:
        return 8;
      case num > 20:
        return 8;
      case num > 10:
        return 7;
      case num >= 6:
        return 6;
      case num > 0:
        return num;
      default:
        return 0;
    }
  }
  
  export default function HotBlock(props) {
    const level = computeLevel(props.number)

    const cls = classNames(Style.hotblock, Style[`bkg-${level}`])

    return (<div className={cls}>{props.children}</div>)
  }
  