update

frontend/client-portal/src/pages/AlarmCenter/ServiceMonitoring.tsx

@@ -18,6 +18,7 @@ import Iconify from '../../components/Iconify';
 // utils
 import useSettings from '../../hooks/useSettings';
 import { useState, SyntheticEvent } from 'react';
+import { useNavigate } from 'react-router-dom';
 // sections
 // import ListTable from '../../sections/claimreports/ListTable';
 // import ClaimStatusCard from '../../sections/claimreports/ClaimStatusCard';
@@ -101,19 +102,28 @@ const StyledTab = styled((props: StyledTabProps) => <Tab disableRipple {...props
   })
 );
 
+
+
 export default function ServiceMonitoring() {
   const { themeStretch } = useSettings();
+  const navigate = useNavigate();
+
 
   const [value, setValue] = useState(0);
   const handleChange = (event: SyntheticEvent, newValue: number) => {
     setValue(newValue);
+
   };
 
+
   return (
     <Page title="Service Monitoring 123456">
       <Container maxWidth={themeStretch ? false : 'xl'}>
         <Stack direction="row" alignItems="center" sx={{ marginBottom: 2 }}>
-          <IconButton sx={{ marginRight: '10px', color: '#424242' }}>
+          <IconButton onClick={() => 
+          navigate('/alarm-center')
+        }
+             sx={{ marginRight: '10px', color: '#424242' }}>
             <Iconify icon="heroicons-outline:arrow-narrow-left" />
           </IconButton>
           <Typography variant="h5">Service Monitoring</Typography>
@@ -271,7 +281,7 @@ export default function ServiceMonitoring() {
                 <StyledTab icon={<Favorite />} label="Daily Monitoring" {...a11yProps(0)} />
                 <StyledTab
                   icon={<Iconify icon="heroicons-solid:beaker" />}
-                  label="Item Two"
+                  label="Laboratorium Result"
                   {...a11yProps(1)}
                 />
               </StyledTabs>