diff --git a/src/App.tsx b/src/App.tsx index 3758237..60c8f31 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,5 +1,6 @@ import { ThemeProvider } from "@emotion/react"; import { useEffect, useState } from "react"; +import Log_Menu from "./components/Log_Menu.tsx"; import { theme } from "./theme"; import BoxBasic from "./components/Box"; @@ -14,12 +15,18 @@ import { TableHead } from "@mui/material"; type getMessageReturn = [string[],string[],string[],string[],number[]] function App() { + // API responses to be shown const [time, setTime] = useState([]); const [source, setSource] = useState([]); const [debug, setDebug] = useState([]); const [logs, setLogs] = useState([]); const [log_lvl, setLog_lvl] = useState([]); + // Log_Menu Props + const [logFilter, setLogFilter] = useState(7); + const handleLogFilterChange = (newLogFilterValue: number) => { + setLogFilter(newLogFilterValue); + } useEffect(() => { async function fetchData( url: string, @@ -126,6 +133,7 @@ function App() { return (

Athena Logpanel

+ @@ -138,15 +146,21 @@ function App() { - {logs.map((log,index) => ( - + {logs.map((log,index) => { + if (log_lvl[index] <= logFilter) { + return ( + {time[index]} {debug[index]} {source[index]} {log} {/* sx={{ '&:last-child td, &:last-child th': { border: 0 } }} */} - - ))} + + ); + } else { + return null + } + })}
@@ -207,7 +221,7 @@ function logLevel(text: string): [string, string, number] { const restOfText = words.slice(2).join(' '); let debug = ""; let message = ""; - let level_val:number = 0; + let level_val:number; if (firstWord in debug_levels) { debug = firstWord; message = restOfText; diff --git a/src/components/Log_Menu.tsx b/src/components/Log_Menu.tsx new file mode 100644 index 0000000..0fca461 --- /dev/null +++ b/src/components/Log_Menu.tsx @@ -0,0 +1,44 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; + +interface Props { + logFilterValue: number; + onLogFilterChange: (newLogFilterValue: number) => void; +} + +const BasicSelect: React.FC = ({ logFilterValue, onLogFilterChange }) => { + const handleChange = (event: SelectChangeEvent) => { + const newLogFilterValue = event.target.value as unknown as number; + onLogFilterChange(newLogFilterValue); + }; + + return ( + + + Minimum Log Filter + + + + ); +} + +export default BasicSelect; \ No newline at end of file