Merge pull request #1881 from proddy/dev

add back button

interface/src/components/layout/LayoutAppBar.tsx

@@ -1,5 +1,7 @@
 import type { FC } from 'react';
+import { useLocation, useNavigate } from 'react-router-dom';
 
+import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import MenuIcon from '@mui/icons-material/Menu';
 import { AppBar, IconButton, Toolbar, Typography } from '@mui/material';
 
@@ -10,7 +12,17 @@ interface LayoutAppBarProps {
   onToggleDrawer: () => void;
 }
 
-const LayoutAppBar: FC<LayoutAppBarProps> = ({ title, onToggleDrawer }) => (
+const LayoutAppBar: FC<LayoutAppBarProps> = ({ title, onToggleDrawer }) => {
+  const pathnames = useLocation()
+    .pathname.split('/')
+    .filter((x) => x);
+  const navigate = useNavigate();
+  let show_back = false;
+  if (pathnames.length > 1) {
+    show_back = pathnames[0] !== 'system' || pathnames[1] === 'espsystemstatus';
+  }
+
+  return (
     <AppBar
       position="fixed"
       sx={{
@@ -29,11 +41,23 @@ const LayoutAppBar: FC<LayoutAppBarProps> = ({ title, onToggleDrawer }) => (
         >
           <MenuIcon />
         </IconButton>
+
+        {show_back && (
+          <IconButton
+            color="inherit"
+            edge="start"
+            onClick={() => navigate(pathnames[0])}
+          >
+            <ArrowBackIcon />
+          </IconButton>
+        )}
+
         <Typography variant="h6" noWrap component="div">
           {title}
         </Typography>
       </Toolbar>
     </AppBar>
   );
+};
 
 export default LayoutAppBar;

interface/src/framework/system/SystemLog.tsx

@@ -75,7 +75,7 @@ const levelLabel = (level: LogLevel) => {
 const SystemLog: FC = () => {
   const { LL } = useI18nContext();
 
-  useLayoutTitle(LL.LOG_OF(''));
+  useLayoutTitle(LL.SYSTEM(0));
 
   const {
     loadData,

interface/src/framework/system/SystemStatus.tsx

@@ -47,7 +47,7 @@ import RestartMonitor from './RestartMonitor';
 const SystemStatus: FC = () => {
   const { LL } = useI18nContext();
 
-  useLayoutTitle(LL.STATUS_OF(''));
+  useLayoutTitle(LL.SYSTEM(0));
 
   const { me } = useContext(AuthenticatedContext);
 

interface/src/project/SystemActivity.tsx

@@ -27,7 +27,7 @@ const SystemActivity: FC = () => {
 
   const { LL } = useI18nContext();
 
-  useLayoutTitle(LL.ACTIVITY());
+  useLayoutTitle(LL.SYSTEM(0));
 
   const stats_theme = tableTheme({
     Table: `