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

// Style
/* istanbul ignore next */
if (typeof window !== 'undefined') require('./style.scss');

const HTTPStatus = ({ status }) => {
  let theme = '1';
  if (status >= 500) theme = '5';
  if (status >= 400) theme = '4';
  else if (status >= 300) theme = '3';
  else if (status >= 200) theme = '2';

  return (
    <code className={`HTTPStatus HTTPStatus_${theme}`}>
      <span className="HTTPStatus-chit" style={{ fontSize: '1.3em' }}>
        •
      </span>
      <span className="HTTPStatus-status" style={{ padding: 0 }}>
        {status}
      </span>
    </code>
  );
};

HTTPStatus.propTypes = {
  status: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
};

export default HTTPStatus;
