import React from 'react';
import { Glyphicon } from 'react-bootstrap';
import { STATUS_DEFS } from '../../constants/parcelStatuses';

function StatusDisplay(props) {
  const { status, ref, ...triggerHandler } = props;
  return (
    <span ref={ref} {...triggerHandler}>
      <Glyphicon glyph={STATUS_DEFS[status].icon} style={{ marginRight: 10 }} />{' '}
      {STATUS_DEFS[status].label}
    </span>
  );
}

export default StatusDisplay;
