2023-03-12 18:17:28 +00:00
|
|
|
// project import
|
|
|
|
import Routes from './routes';
|
2023-03-13 21:06:19 +00:00
|
|
|
import * as React from 'react';
|
2023-03-12 18:17:28 +00:00
|
|
|
import ThemeCustomization from './themes';
|
|
|
|
import ScrollTop from './components/ScrollTop';
|
2023-03-13 21:06:19 +00:00
|
|
|
import Snackbar from '@mui/material/Snackbar';
|
2023-06-20 17:34:06 +00:00
|
|
|
import {Alert, Box} from '@mui/material';
|
|
|
|
import logo from './assets/images/icons/cosmos.png';
|
|
|
|
|
|
|
|
import * as API from './api';
|
2023-03-13 21:06:19 +00:00
|
|
|
|
2023-07-02 14:28:14 +00:00
|
|
|
import { setSnackit, snackit } from './api/wrap';
|
|
|
|
import { DisconnectOutlined } from '@ant-design/icons';
|
2023-03-13 21:06:19 +00:00
|
|
|
|
2023-03-12 18:17:28 +00:00
|
|
|
// ==============================|| APP - THEME, ROUTER, LOCAL ||============================== //
|
|
|
|
|
2023-06-20 17:34:06 +00:00
|
|
|
const LoadingAnimation = () => (
|
|
|
|
<div className="loader">
|
|
|
|
<div className="dot"></div>
|
|
|
|
<div className="dot"></div>
|
|
|
|
<div className="dot"></div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
|
|
|
|
export let SetPrimaryColor = () => {};
|
|
|
|
export let SetSecondaryColor = () => {};
|
|
|
|
export let GlobalPrimaryColor = '';
|
|
|
|
export let GlobalSecondaryColor = '';
|
|
|
|
|
2023-03-12 18:17:28 +00:00
|
|
|
const App = () => {
|
2023-03-13 21:06:19 +00:00
|
|
|
const [open, setOpen] = React.useState(false);
|
|
|
|
const [message, setMessage] = React.useState('');
|
2023-04-28 18:28:01 +00:00
|
|
|
const [severity, setSeverity] = React.useState('error');
|
2023-06-20 17:34:06 +00:00
|
|
|
const [statusLoaded, setStatusLoaded] = React.useState(false);
|
|
|
|
const [PrimaryColor, setPrimaryColor] = React.useState(API.PRIMARY_COLOR);
|
|
|
|
const [SecondaryColor, setSecondaryColor] = React.useState(API.SECONDARY_COLOR);
|
2023-07-02 14:28:14 +00:00
|
|
|
const [timeoutError, setTimeoutError] = React.useState(false);
|
2023-06-20 17:34:06 +00:00
|
|
|
|
|
|
|
SetPrimaryColor = (color) => {
|
|
|
|
setPrimaryColor(color);
|
|
|
|
GlobalPrimaryColor = color;
|
|
|
|
}
|
|
|
|
|
|
|
|
SetSecondaryColor = (color) => {
|
|
|
|
setSecondaryColor(color);
|
|
|
|
GlobalSecondaryColor = color;
|
|
|
|
}
|
|
|
|
|
|
|
|
React.useEffect(() => {
|
2023-07-02 14:28:14 +00:00
|
|
|
const timeout = setTimeout(
|
|
|
|
() => {
|
|
|
|
setTimeoutError(true);
|
|
|
|
}, 10000
|
|
|
|
)
|
2023-06-20 17:34:06 +00:00
|
|
|
API.getStatus(true).then((r) => {
|
2023-07-02 14:28:14 +00:00
|
|
|
clearTimeout(timeout);
|
|
|
|
if(r == "NOT_AVAILABLE") {
|
|
|
|
setTimeoutError(true);
|
|
|
|
}
|
|
|
|
else if(r) {
|
2023-06-20 17:34:06 +00:00
|
|
|
setStatusLoaded(true);
|
2023-07-02 14:28:14 +00:00
|
|
|
}
|
2023-06-20 17:34:06 +00:00
|
|
|
setPrimaryColor(API.PRIMARY_COLOR);
|
|
|
|
setSecondaryColor(API.SECONDARY_COLOR);
|
2023-07-02 14:28:14 +00:00
|
|
|
|
2023-06-20 17:34:06 +00:00
|
|
|
}).catch(() => {
|
2023-07-02 14:28:14 +00:00
|
|
|
clearTimeout(timeout);
|
2023-06-20 17:34:06 +00:00
|
|
|
setStatusLoaded(true);
|
|
|
|
setPrimaryColor(API.PRIMARY_COLOR);
|
|
|
|
setSecondaryColor(API.SECONDARY_COLOR);
|
|
|
|
});
|
|
|
|
}, []);
|
|
|
|
|
2023-04-28 18:28:01 +00:00
|
|
|
setSnackit((message, severity='error') => {
|
2023-03-13 21:06:19 +00:00
|
|
|
setMessage(message);
|
|
|
|
setOpen(true);
|
2023-04-28 18:28:01 +00:00
|
|
|
setSeverity(severity);
|
2023-03-13 21:06:19 +00:00
|
|
|
})
|
2023-06-20 17:34:06 +00:00
|
|
|
|
|
|
|
return statusLoaded ?
|
|
|
|
<ThemeCustomization PrimaryColor={PrimaryColor} SecondaryColor={SecondaryColor}>
|
2023-03-13 21:06:19 +00:00
|
|
|
<Snackbar
|
|
|
|
open={open}
|
|
|
|
autoHideDuration={5000}
|
|
|
|
onClose={() => {setOpen(false)}}
|
|
|
|
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
|
|
|
|
>
|
2023-04-28 18:28:01 +00:00
|
|
|
<Alert className={(open && severity == "error") ? 'shake' : ''} severity={severity} sx={{ width: '100%' }}>
|
2023-03-13 21:06:19 +00:00
|
|
|
{message}
|
|
|
|
</Alert>
|
|
|
|
</Snackbar>
|
2023-03-12 18:17:28 +00:00
|
|
|
<ScrollTop>
|
|
|
|
<Routes />
|
|
|
|
</ScrollTop>
|
|
|
|
</ThemeCustomization>
|
2023-06-20 17:34:06 +00:00
|
|
|
|
|
|
|
: <div>
|
|
|
|
<Box sx={{ position: 'fixed', top: 0, bottom: 0, left: 0, right: 0, display: 'flex', justifyContent: 'center', alignItems: 'center'}}>
|
|
|
|
{/* <img src={logo} style={{ display:'inline', height: '200px'}} className='pulsing' /> */}
|
2023-07-02 14:28:14 +00:00
|
|
|
{!timeoutError && <LoadingAnimation />}
|
|
|
|
{timeoutError && <DisconnectOutlined style={{
|
|
|
|
fontSize: '200px',
|
|
|
|
color: 'red',
|
|
|
|
}}/>}
|
2023-06-20 17:34:06 +00:00
|
|
|
</Box>
|
|
|
|
</div>
|
|
|
|
|
2023-03-12 18:17:28 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export default App;
|