// // Copyright 2020 DxOS // import clsx from 'clsx'; import React, { useContext, useEffect, useState } from 'react'; import { makeStyles } from '@material-ui/core'; import Link from '@material-ui/core/Link'; import Toolbar from '@material-ui/core/Toolbar'; import ErrorIcon from '@material-ui/icons/Error'; import LoadingIcon from '@material-ui/icons/Wifi'; import RunningIcon from '@material-ui/icons/CheckCircle'; import PublicIcon from '@material-ui/icons/Public'; import grey from '@material-ui/core/colors/grey'; import green from '@material-ui/core/colors/green'; import red from '@material-ui/core/colors/red'; import { version } from '../../package.json'; import { ConsoleContext, useStatusReducer } from '../hooks'; const useStyles = makeStyles((theme) => ({ root: { display: 'flex', flexDirection: 'row', flex: 1, justifyContent: 'space-around', backgroundColor: grey[900], color: grey[400] }, left: { width: 160 }, right: { width: 160, textAlign: 'right' }, center: { flex: 1, textAlign: 'center' }, icon: { margin: '0 2px' }, link: { color: grey[400] }, error: { color: red[500] }, running: { color: green[500] }, loading:{ color: theme.palette.primary.dark } })); const StatusBar = () => { const classes = useStyles(); const [{ loading, error }] = useStatusReducer(); const [isLoading, setLoading] = useState(loading); const { config } = useContext(ConsoleContext); useEffect(() => { let t; if (loading) { setLoading(loading); t = setTimeout(() => { setLoading(false); }, 1000); } return () => clearTimeout(t); }, [loading]); const StatusIcon = ({ error }) => { if (error) { return ( ); } else { return ( ); } }; return ( (c) {config.app.org} {version} ); }; export default StatusBar;