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

import './Status.css'
import Incident from './Incident'

const Status = ({ incident }) => {
  let view = null
  if (incident) {
    view = <Incident incident={incident}/>
  } else {
    view = 'All systems operational'
  }

  const className = classnames(
    'status',
    incident == null ? 'status-good' : 'status-bad',
  )
  return (
    <div className={className}>
      {view}
    </div>
  )
}

Status.propTypes = {
  incident: PropTypes.object,
}

export default Status