From 2aa38f111726b94832444eb58e1efcce9acbf9d0 Mon Sep 17 00:00:00 2001 From: Charles Date: Mon, 17 Jan 2022 15:30:45 +0100 Subject: [PATCH] Version 2.5.25: added refresh to logs/health/wifi analysis, added vendors to wifi analysis, changed configure feedback to use toast --- package-lock.json | 4 +- package.json | 2 +- public/locales/de/translation.json | 3 +- public/locales/en/translation.json | 3 +- public/locales/es/translation.json | 3 +- public/locales/fr/translation.json | 3 +- public/locales/pt/translation.json | 3 +- src/components/ConfigureModal/index.js | 11 +++- src/components/DeviceHealth/index.js | 7 ++- src/components/DeviceLogs/index.js | 7 ++- src/components/WifiAnalysis/WifiAnalysis.js | 10 ++-- src/components/WifiAnalysis/index.js | 59 +++++++++++++++++---- 12 files changed, 90 insertions(+), 25 deletions(-) diff --git a/package-lock.json b/package-lock.json index ad074a8..f12fc26 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "ucentral-client", - "version": "2.5.24", + "version": "2.5.25", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "ucentral-client", - "version": "2.5.24", + "version": "2.5.25", "dependencies": { "@coreui/coreui": "^3.4.0", "@coreui/icons": "^2.0.1", diff --git a/package.json b/package.json index 1b8ba6e..2ad6a25 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ucentral-client", - "version": "2.5.24", + "version": "2.5.25", "dependencies": { "@coreui/coreui": "^3.4.0", "@coreui/icons": "^2.0.1", diff --git a/public/locales/de/translation.json b/public/locales/de/translation.json index b8f29da..80b88b0 100644 --- a/public/locales/de/translation.json +++ b/public/locales/de/translation.json @@ -804,6 +804,7 @@ "mode": "Modus", "network_diagram": "Netzwerkdiagramm", "radios": "Radios", - "title": "WLAN-Analyse" + "title": "WLAN-Analyse", + "vendor": "Verkäufer" } } diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 4ab6816..c283780 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -804,6 +804,7 @@ "mode": "Mode", "network_diagram": "Network Diagram", "radios": "Radios", - "title": "Wi-Fi Analysis" + "title": "Wi-Fi Analysis", + "vendor": "Vendor" } } diff --git a/public/locales/es/translation.json b/public/locales/es/translation.json index 9ed11e9..35cf43d 100644 --- a/public/locales/es/translation.json +++ b/public/locales/es/translation.json @@ -804,6 +804,7 @@ "mode": "Modo", "network_diagram": "Diagrama de Red", "radios": "Radios", - "title": "Análisis de Wi-Fi" + "title": "Análisis de Wi-Fi", + "vendor": "Vendedor" } } diff --git a/public/locales/fr/translation.json b/public/locales/fr/translation.json index dec75e8..e026672 100644 --- a/public/locales/fr/translation.json +++ b/public/locales/fr/translation.json @@ -804,6 +804,7 @@ "mode": "Mode", "network_diagram": "Diagramme de réseau", "radios": "Radios", - "title": "Analyse Wi-Fi" + "title": "Analyse Wi-Fi", + "vendor": "vendeur" } } diff --git a/public/locales/pt/translation.json b/public/locales/pt/translation.json index 27ffb62..f89c932 100644 --- a/public/locales/pt/translation.json +++ b/public/locales/pt/translation.json @@ -804,6 +804,7 @@ "mode": "Modo", "network_diagram": "Diagrama de rede", "radios": "Rádios", - "title": "Análise de Wi-Fi" + "title": "Análise de Wi-Fi", + "vendor": "fornecedor" } } diff --git a/src/components/ConfigureModal/index.js b/src/components/ConfigureModal/index.js index 190e469..cd62ac8 100644 --- a/src/components/ConfigureModal/index.js +++ b/src/components/ConfigureModal/index.js @@ -20,7 +20,7 @@ import React, { useState, useEffect } from 'react'; import { useTranslation } from 'react-i18next'; import PropTypes from 'prop-types'; import 'react-widgets/styles.css'; -import { useAuth, useDevice } from 'ucentral-libs'; +import { useAuth, useDevice, useToast } from 'ucentral-libs'; import { checkIfJson } from 'utils/helper'; import axiosInstance from 'utils/axiosInstance'; import eventBus from 'utils/eventBus'; @@ -29,6 +29,7 @@ import SuccessfulActionModalBody from 'components/SuccessfulActionModalBody'; const ConfigureModal = ({ show, toggleModal }) => { const { t } = useTranslation(); const { currentToken, endpoints } = useAuth(); + const { addToast } = useToast(); const { deviceSerialNumber } = useDevice(); const [hadSuccess, setHadSuccess] = useState(false); const [hadFailure, setHadFailure] = useState(false); @@ -91,7 +92,13 @@ const ConfigureModal = ({ show, toggleModal }) => { { headers }, ) .then(() => { - setHadSuccess(true); + addToast({ + title: t('common.success'), + body: t('commands.command_success'), + color: 'success', + autohide: true, + }); + toggleModal(); }) .catch(() => { setResponseBody('Error while submitting command!'); diff --git a/src/components/DeviceHealth/index.js b/src/components/DeviceHealth/index.js index b66ca7b..a7a5ad8 100644 --- a/src/components/DeviceHealth/index.js +++ b/src/components/DeviceHealth/index.js @@ -11,7 +11,7 @@ import { CPopover, } from '@coreui/react'; import CIcon from '@coreui/icons-react'; -import { cilTrash } from '@coreui/icons'; +import { cilSync, cilTrash } from '@coreui/icons'; import { useTranslation } from 'react-i18next'; import DatePicker from 'react-widgets/DatePicker'; import { dateToUnix } from 'utils/helper'; @@ -231,6 +231,11 @@ const DeviceHealth = () => { + + + + + ); diff --git a/src/components/DeviceLogs/index.js b/src/components/DeviceLogs/index.js index 8645b3a..c09e587 100644 --- a/src/components/DeviceLogs/index.js +++ b/src/components/DeviceLogs/index.js @@ -12,7 +12,7 @@ import { CPopover, } from '@coreui/react'; import CIcon from '@coreui/icons-react'; -import { cilTrash } from '@coreui/icons'; +import { cilSync, cilTrash } from '@coreui/icons'; import { useTranslation } from 'react-i18next'; import DatePicker from 'react-widgets/DatePicker'; import { dateToUnix } from 'utils/helper'; @@ -250,6 +250,11 @@ const DeviceLogs = () => { + + + + + { setShow(!show); }; const columns = [ - { key: 'radio', label: '#', _style: { width: '5%' } }, - { key: 'bssid', label: 'BSSID', _style: { width: '14%' } }, - { key: 'mode', label: t('wifi_analysis.mode'), _style: { width: '9%' }, sorter: false }, - { key: 'ssid', label: 'SSID', _style: { width: '17%' } }, + { key: 'radio', label: '#', _style: { width: '1%' } }, + { key: 'bssid', label: 'BSSID', _style: { width: '1%' } }, + { key: 'vendor', label: t('wifi_analysis.vendor'), _style: { width: '15%' }, sorter: false }, + { key: 'mode', label: t('wifi_analysis.mode'), _style: { width: '1%' }, sorter: false }, + { key: 'ssid', label: 'SSID', _style: { width: '15%' } }, { key: 'rssi', label: 'RSSI', _style: { width: '5%' }, sorter: false }, { key: 'rxRate', label: 'Rx Rate', _style: { width: '7%' }, sorter: false }, { key: 'rxBytes', label: 'Rx', _style: { width: '7%' }, sorter: false }, @@ -70,6 +71,7 @@ const WifiAnalysisTable = ({ t, data, loading }) => { sorter sorterValue={{ column: 'radio', asc: true }} scopedSlots={{ + bssid: (item) => {item.bssid}, radio: (item) => {item.radio.radio}, rxMcs: (item) => centerIfEmpty(item.rxMcs), rxNss: (item) => centerIfEmpty(item.rxNss), diff --git a/src/components/WifiAnalysis/index.js b/src/components/WifiAnalysis/index.js index 5cc2c9a..3258ac5 100644 --- a/src/components/WifiAnalysis/index.js +++ b/src/components/WifiAnalysis/index.js @@ -19,7 +19,7 @@ import { CPopover, } from '@coreui/react'; import CIcon from '@coreui/icons-react'; -import { cilX } from '@coreui/icons'; +import { cilSync, cilX } from '@coreui/icons'; import RadioAnalysisTable from './RadioAnalysis'; import WifiAnalysisTable from './WifiAnalysis'; @@ -67,9 +67,33 @@ const WifiAnalysis = () => { return ips; }; - const parseAssociationStats = (json) => { + const getVendors = async (bssids) => { + setLoading(true); + setRange(19); + + const options = { + headers: { + Accept: 'application/json', + Authorization: `Bearer ${currentToken}`, + }, + }; + + return axiosInstance + .get(`${endpoints.owgw}/api/v1/ouis?macList=${bssids.join(',')}`, options) + .then((response) => { + const newObj = bssids; + for (const tag of response.data.tagList) { + newObj[tag.tag] = tag.value; + } + return newObj; + }) + .catch(() => ({})); + }; + + const parseAssociationStats = async (json) => { const newParsedAssociationStats = []; const newParsedRadioStats = []; + const bssidObj = {}; for (const stat of json.data) { const associations = []; @@ -123,6 +147,8 @@ const WifiAnalysis = () => { if ('associations' in ssid) { for (const association of ssid.associations) { + bssidObj[association.bssid] = 0; + const data = { radio: radioInfo, ...extractIp(stat.data, association.bssid), @@ -149,6 +175,16 @@ const WifiAnalysis = () => { newParsedAssociationStats.push(associations); } + // Adding Vendor info to associations + const vendors = await getVendors(Object.keys(bssidObj)); + + for (let i = 0; i < newParsedAssociationStats.length; i += 1) { + for (let y = 0; y < newParsedAssociationStats[i].length; y += 1) { + newParsedAssociationStats[i][y].vendor = + vendors[newParsedAssociationStats[i][y].bssid] ?? '-'; + } + } + // Radio Stats const ascOrderedRadioStats = newParsedRadioStats.reverse(); setParsedRadioStats(ascOrderedRadioStats); @@ -203,14 +239,19 @@ const WifiAnalysis = () => { return (
- - - - - {t('wifi_analysis.network_diagram')} + +
+ + + - - + +
+
+ + {t('wifi_analysis.network_diagram')} + +