All files / src/components/ColourLabel index.jsx

100% Statements 12/12
100% Branches 12/12
100% Functions 3/3
100% Lines 12/12
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55                  4x 8x   8x 2x     6x 1x     5x     2x 1x               1x                 1x           4x              
import styles from './style.postcss';
 
import React from 'react';
import pure from 'recompose/pure';
import classnames from 'classnames';
import is from 'is_js';
import Tooltip from 'components/Tooltip';
import PropTypes from 'prop-types';
 
export const ColourLabel = (props) => {
  const { text, initial, colour } = props;
 
  if (is.string(initial) && is.not.empty(initial)) {
    return renderSmall();
  }
 
  if (is.string(text) && is.not.empty(text)) {
    return renderBig();
  }
 
  return null;
 
  function renderSmall() {
    if (is.string(text) && is.not.empty(text)) {
      return <Tooltip text={text} className={styles.ColourLabel}>
        <div className={classnames(styles.ColourLabel_inner, styles.__small)}
            style={{ backgroundColor: colour }}>
          {initial}
        </div>
      </Tooltip>;
    }
 
    return <div className={styles.ColourLabel}>
      <div className={classnames(styles.ColourLabel_inner, styles.__small)}
          style={{ backgroundColor: colour }}>
        {initial}
      </div>
    </div>;
  }
 
  function renderBig() {
    return <div className={styles.ColourLabel}>
      <div className={styles.ColourLabel_inner} style={{ backgroundColor: colour }}>{text}</div>
    </div>;
  }
};
 
ColourLabel.propTypes = {
  initial: PropTypes.string,
  text: PropTypes.string,
  colour: PropTypes.string,
};
 
export default pure(ColourLabel);