26 lines
596 B
JavaScript
26 lines
596 B
JavaScript
|
import React from 'react'
|
||
|
import PropTypes from 'prop-types'
|
||
|
|
||
|
import './DegradedNotice.css'
|
||
|
|
||
|
const DegradedNotice = ({ services }) => {
|
||
|
const keys = Object.keys(services)
|
||
|
const serviceNames = keys.join(', ')
|
||
|
const plural = keys.length === 1 ? '' : 's'
|
||
|
|
||
|
return (
|
||
|
<div className="degraded-notice">
|
||
|
<header>{keys.length} service{plural} are unreachable</header>
|
||
|
<p>
|
||
|
elstat is having trouble contacting <strong>{serviceNames}</strong>.
|
||
|
</p>
|
||
|
</div>
|
||
|
)
|
||
|
}
|
||
|
|
||
|
DegradedNotice.propTypes = {
|
||
|
services: PropTypes.object.isRequired,
|
||
|
}
|
||
|
|
||
|
export default DegradedNotice
|