From 17ddfb535ff74dff5bf0364d69a0839bd2ace78c Mon Sep 17 00:00:00 2001 From: cv <34649812+cpvalente@users.noreply.github.com> Date: Sun, 13 Jun 2021 14:17:55 +0200 Subject: [PATCH] network info --- client/src/app/api/apiConstants.js | 1 + client/src/app/api/ontimeApi.js | 9 ++++ client/src/features/info/Info.jsx | 2 + client/src/features/info/Info.module.css | 11 ++++- client/src/features/info/InfoNif.jsx | 49 ++++++++++++++++++++++ server/src/controllers/ontimeController.js | 33 +++++++++++++++ server/src/routes/ontimeRouter.js | 9 +++- 7 files changed, 112 insertions(+), 2 deletions(-) create mode 100644 client/src/features/info/InfoNif.jsx diff --git a/client/src/app/api/apiConstants.js b/client/src/app/api/apiConstants.js index ba1a35c67..d6a0f2d2f 100644 --- a/client/src/app/api/apiConstants.js +++ b/client/src/app/api/apiConstants.js @@ -1,6 +1,7 @@ export const NODE_PORT = 4001; export const EVENT_TABLE = 'event'; export const EVENTS_TABLE = 'events'; +export const APP_TABLE = 'appinfo'; const calculateServer = () => { return window.location.origin.replace(window.location.port, `${NODE_PORT}/`); diff --git a/client/src/app/api/ontimeApi.js b/client/src/app/api/ontimeApi.js index 4ebc5f73b..6bd0557ba 100644 --- a/client/src/app/api/ontimeApi.js +++ b/client/src/app/api/ontimeApi.js @@ -1,6 +1,15 @@ import axios from 'axios'; import { ontimeURL } from './apiConstants'; +export const ontimePlaceholderInfo = { + networkInterfaces: [], +}; + +export const getInfo = async () => { + const res = await axios.get(ontimeURL + '/info'); + return res.data; +}; + export const downloadEvents = async () => { await axios({ url: ontimeURL + '/db', diff --git a/client/src/features/info/Info.jsx b/client/src/features/info/Info.jsx index 175c2722c..e741f7c32 100644 --- a/client/src/features/info/Info.jsx +++ b/client/src/features/info/Info.jsx @@ -3,6 +3,7 @@ import { useSocket } from 'app/context/socketContext'; import style from './Info.module.css'; import InfoTitle from './InfoTitle'; import InfoLogger from './InfoLogger'; +import InfoNif from './InfoNif'; import { useState } from 'react'; export default function Info() { @@ -71,6 +72,7 @@ export default function Info() { <>
{selected}
+ diff --git a/client/src/features/info/Info.module.css b/client/src/features/info/Info.module.css index 6f06843e7..bf5ce6831 100644 --- a/client/src/features/info/Info.module.css +++ b/client/src/features/info/Info.module.css @@ -30,6 +30,15 @@ color: #ccc; } +.if { + font-size: 0.8em; + color: #4bffabcc; + background-color: rgba(0, 0, 0, 0.13); + border-radius: 2px; + padding: 0 0.5em; + margin: 0 0.5em; +} + ul > li { font-size: 0.9em; color: #fff; @@ -37,7 +46,7 @@ ul > li { .log { overflow-y: scroll; - height: 40vh; + height: 30vh; } .info { diff --git a/client/src/features/info/InfoNif.jsx b/client/src/features/info/InfoNif.jsx new file mode 100644 index 000000000..cc46f9cf9 --- /dev/null +++ b/client/src/features/info/InfoNif.jsx @@ -0,0 +1,49 @@ +import { Icon } from '@chakra-ui/react'; +import { useState } from 'react'; +import { FiChevronUp } from 'react-icons/fi'; +import { APP_TABLE } from 'app/api/apiConstants'; +import { getInfo, ontimePlaceholderInfo } from 'app/api/ontimeApi'; +import { useFetch } from 'app/hooks/useFetch'; +import style from './Info.module.css'; + +export default function InfoNif() { + const { data, status } = useFetch(APP_TABLE, getInfo, { + placeholderData: ontimePlaceholderInfo, + }); + const [collapsed, setCollapsed] = useState(false); + + const isDev = process.env.NODE_ENV === 'development'; + const baseURL = `http://__IP__:${isDev ? 3000 : 4001}`; + + return ( +
+
+ Network Info + setCollapsed((c) => !c)} + /> +
+ + {!collapsed && ( +
+ {status === 'success' && ( + <> + {data?.networkInterfaces.map((e) => { + return ( + {`${e.name} - ${e.address}`} + ); + })} + + )} +
+ )} +
+ ); +} diff --git a/server/src/controllers/ontimeController.js b/server/src/controllers/ontimeController.js index 2d74bb73f..40eff7af4 100644 --- a/server/src/controllers/ontimeController.js +++ b/server/src/controllers/ontimeController.js @@ -7,6 +7,7 @@ import { block as blockDef, } from '../data/eventsDefinition.js'; import { dbModel } from '../data/dataModel.js'; +import { networkInterfaces } from 'os'; function getEventTitle() { return data.event.title; @@ -126,3 +127,35 @@ export const dbUpload = async (req, res) => { res.status(400).send({ message: error }); } }; + +/** + * @description Gets information on IPV4 non internal interfaces + * @returns {array} - Array of objects {name: ip} + */ +const getNetworkInterfaces = () => { + const nets = networkInterfaces(); + const results = []; + + for (const name of Object.keys(nets)) { + for (const net of nets[name]) { + // Skip over non-IPv4 and internal (i.e. 127.0.0.1) addresses + if (net.family === 'IPv4' && !net.internal) { + results.push({ + name: name, + address: net.address, + }); + } + } + } + return results; +}; + +// Create controller for POST request to '/ontime/info' +// Returns - +// TODO: Add version +export const getInfo = async (req, res) => { + const ni = getNetworkInterfaces(); + res.status(200).send({ + networkInterfaces: ni, + }); +}; diff --git a/server/src/routes/ontimeRouter.js b/server/src/routes/ontimeRouter.js index e5b5e5670..18368fd5e 100644 --- a/server/src/routes/ontimeRouter.js +++ b/server/src/routes/ontimeRouter.js @@ -2,10 +2,17 @@ import express from 'express'; import uploadJson from '../utils/upload.js'; export const router = express.Router(); -import { dbDownload, dbUpload } from '../controllers/ontimeController.js'; +import { + dbDownload, + dbUpload, + getInfo, +} from '../controllers/ontimeController.js'; // create route between controller and '/ontime/db' endpoint router.get('/db', dbDownload); // create route between controller and '/ontime/db' endpoint router.post('/db', uploadJson, dbUpload); + +// create route between controller and '/ontime/info' endpoint +router.get('/info', uploadJson, getInfo);