update check page

src/layout/MainLayout/index.js

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { Outlet } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
+import { useLocation } from 'react-router-dom';
 
 // material-ui
 import { useTheme } from '@mui/material/styles';
@@ -31,7 +32,8 @@ const MainLayout = () => {
   const theme = useTheme();
   const matchDownLG = useMediaQuery(theme.breakpoints.down('lg'));
   const dispatch = useDispatch();
-
+  const location = useLocation();
+  const hideNavbarRoutes = ['/databaseHealthCheck']
   const { drawerOpen } = useSelector((state) => state.menu);
 
   // drawer toggler
@@ -55,18 +57,26 @@ const MainLayout = () => {
   }, [drawerOpen]);
 
   return (
-    <Box sx={{backgroundColor:'#ffffff', display: 'flex', width: '100%', flexDirection: "column", paddingTop: { xs: "5px", sm: "25px", md: "43px" }}}>
-      <Header/>
-      {/* <Drawer open={open} handleDrawerToggle={handleDrawerToggle} /> */}
-      <Box style={{ width: '100%', flexGrow: 1 } } sx={{ paddingTop: "38px" }}>
-        {/* <Toolbar /> */}
-        {/* <Breadcrumbs navigation={navigation} title /> */}
-        <Outlet />
-      </Box>
-      <Box sx={{borderTop: "3px solid #0C489E"}}>
-         <Footer/>
-      </Box>
-    </Box>
+    <>
+      {!hideNavbarRoutes.includes(location.pathname) && (
+        <Box sx={{backgroundColor:'#ffffff', display: 'flex', width: '100%', flexDirection: "column", paddingTop: { xs: "5px", sm: "25px", md: "43px" }}}>
+          <Header/>
+          {/* <Drawer open={open} handleDrawerToggle={handleDrawerToggle} /> */}
+          <Box style={{ width: '100%', flexGrow: 1 } } sx={{ paddingTop: "38px" }}>
+            {/* <Toolbar /> */}
+            {/* <Breadcrumbs navigation={navigation} title /> */}
+            <Outlet />
+          </Box>
+          <Box sx={{borderTop: "3px solid #0C489E"}}>
+            <Footer/>
+          </Box>
+        </Box>
+      )}
+      {hideNavbarRoutes.includes(location.pathname) && (
+          <Outlet />
+      )}
+    </>
+    
   );
 };
 

src/pages/extra-pages/DatabaseHealthCheck/index.js

@@ -1,31 +1,10 @@
-import { Grid, Typography, Stack, } from '@mui/material';
-import { useState, useEffect, lazy } from "react";
+import { useState, useEffect } from "react";
 
-import Loadable from 'components/Loadable';
-// import { useIntl, FormattedMessage } from "react-intl";
 import { get } from "utils/HttpUtils"
-import {GET_SYS_SETTING} from "utils/ApiPathConst"
-
-import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png'
-const BackgroundHead = {
-    backgroundImage: `url(${titleBackgroundImg})`,
-    width: 'auto',
-    height: 'auto',
-    backgroundSize: 'contain',
-    backgroundRepeat: 'no-repeat',
-    backgroundColor: '#0C489E',
-    backgroundPosition: 'right'
-}
-
-const LoadingComponent = Loadable(lazy(() => import('pages/extra-pages/LoadingComponent')));
-
-// import DownloadIcon from '@mui/icons-material/Download';
+import {GET_SYS_CHECKING} from "utils/ApiPathConst"
 
 const DatabaseHealthCheck = () => {
-    // const intl = useIntl();
-    // const { locale } = intl;
-    const [onReady, setOnReady] = useState(false);
-    const [sysEnv, setSysEnv] = useState("");
+    const [sysEnv, setSysEnv] = useState("'N/A");
 
     useEffect(() => {
         loadSysSetting();
@@ -37,41 +16,16 @@ const DatabaseHealthCheck = () => {
 
     const loadSysSetting = () => {
         get({
-            url: GET_SYS_SETTING,
+            url: GET_SYS_CHECKING,
             onSuccess: (responseData) => {
                 // console.log(responseData)
                 setSysEnv(responseData.sysEnv);
-                setOnReady(true);
             }
         });
     }
 
     return (
-        !onReady ?
-            <Grid container sx={{ minHeight: '87vh', mb: 3 }} direction="column" justifyContent="center" alignItems="center">
-                <Grid item>
-                    <LoadingComponent />
-                </Grid>
-            </Grid>
-            :
-            (
-                <Grid container sx={{ minHeight: '87vh', mb: 3}} direction="column" alignItems="center" >
-                    <Grid item xs={12} md={12} width="100%">
-                        <div style={BackgroundHead}>
-                            <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center">
-                                <Typography ml={15} color='#FFF' variant="h4" sx={{ display: { xs: 'none', sm: 'none', md: 'block'} }}>
-                                    Database Health Check
-                                </Typography>
-                            </Stack>
-                        </div>
-                    </Grid>
-                    <Grid container justifyContent="center" alignItems="center" >
-                        <Grid item xs={12} md={12} ml={15}>
-                            <div>{sysEnv}</div> Connection OK
-                        </Grid>
-                    </Grid>
-                </Grid>
-            )
+        <div>{sysEnv}</div>
     );
 
 }

src/utils/ApiPathConst.js

@@ -13,6 +13,7 @@ export const PRIVACY_POLICY_PATH = apiPath+'/privacyPolicy';
 export const I_AM_SMART_PATH = apiPath+'/smart/call/iAmSmart';
 export const I_AM_SMART_APP_PATH = apiPath+'/smart/call/app/iAmSmart';
 export const GET_SYS_SETTING = apiPath+'/sys';
+export const GET_SYS_CHECKING = apiPath+'/sysCheck';
 
 //Group Config
 export const GET_GROUP_LIST_PATH = apiPath+'/group';