import React from 'react' import PropTypes from 'prop-types' import classnames from 'classnames' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import './Service.css' import Graph from './Graph.js' import config from '../config.json' const { slow_threshold: SLOW_THRESHOLD = 1500, } = config const icons = { alive: 'check-circle', slow: 'exclamation-circle', dead: 'times-circle', } const titles = { alive: 'This service is healthy.', slow: 'This service is slow, but responding.', dead: 'This service is unresponsive.', } export function getServiceState (status, latency, threshold = SLOW_THRESHOLD) { if (status && latency > threshold) { return 'slow' } return status ? 'alive' : 'dead' } export default function Service ({ graph, name, status, latency, description }) { const state = getServiceState(status, latency) const title = titles[state] const icon = icons[state] const className = classnames( 'service', `service-${state}` ) return (
{description}
{graph ?