Added health check component, axios, and status indicator

Author: mihailistov

templates/react/src/components/health-check/index.js

@@ -1,29 +1,6 @@
 import React, { useState, useEffect } from 'react'
 import axios from 'axios'
-import { withStyles } from '@material-ui/core/styles'
-import { red, green } from '@material-ui/core/colors'
-import Radio from '@material-ui/core/Radio'
-
-const radioStyle = (customColor) => ({
-  root: {
-    color: customColor,
-    '&$checked': {
-      color: customColor,
-    },
-  },
-  checked: {},
-})
-
-const CustomRadio = (customColor) => (
-  withStyles(radioStyle(customColor))(props => <Radio checked={true} color="default" {...props} />)
-)
-
-const GreenRadio = CustomRadio(green[600])
-const RedRadio = CustomRadio(red[600])
-
-function StatusIcon(props) {
-  return props.value === 200 ? <GreenRadio /> : <RedRadio />
-}
+import StatusIcon from './status-icon'
 
 function HealthCheck() {
   const [data, setData] = useState({ status: {} })

templates/react/src/components/health-check/status-icon.js

@@ -0,0 +1,27 @@
+import React from 'react'
+import { withStyles } from '@material-ui/core/styles'
+import { red, green } from '@material-ui/core/colors'
+import Radio from '@material-ui/core/Radio'
+
+const radioStyle = (customColor) => ({
+  root: {
+    color: customColor,
+    '&$checked': {
+      color: customColor,
+    },
+  },
+  checked: {},
+})
+
+const CustomRadio = (customColor) => (
+  withStyles(radioStyle(customColor))(props => <Radio checked={true} color="default" {...props} />)
+)
+
+const GreenRadio = CustomRadio(green[600])
+const RedRadio = CustomRadio(red[600])
+
+function StatusIcon(props) {
+  return props.value === 200 ? <GreenRadio /> : <RedRadio />
+}
+
+export default StatusIcon