From e75c163248980c2ba07e99f756d3dec657bb24ed Mon Sep 17 00:00:00 2001 From: bourquecharles Date: Fri, 25 Jun 2021 09:35:47 -0400 Subject: [PATCH] Waiting for trace --- public/locales/de/translation.json | 6 +- public/locales/en/translation.json | 6 +- public/locales/es/translation.json | 6 +- public/locales/fr/translation.json | 6 +- public/locales/pt/translation.json | 6 +- .../index.js => UpgradeFooter.js} | 0 .../index.js => UpgradeWaitingBody.js} | 29 +- src/components/FirmwareUpgradeModal/index.js | 121 +++--- .../LatestStatisticsModal.js | 10 +- .../StatisticsChartList.js | 6 +- src/components/InterfaceStatistics/index.js | 35 +- .../TraceModal/WaitingForTraceBody.js | 101 +++++ src/components/TraceModal/index.js | 369 +++++++++++------- src/components/TraceModal/index.module.scss | 4 + src/layout/Sidebar/index.module.scss | 4 +- src/utils/deviceHelper.js | 16 + 16 files changed, 468 insertions(+), 257 deletions(-) rename src/components/FirmwareUpgradeModal/{containers/UpgradeFooter/index.js => UpgradeFooter.js} (100%) rename src/components/FirmwareUpgradeModal/{containers/UpgradeWaitingBody/index.js => UpgradeWaitingBody.js} (82%) create mode 100644 src/components/TraceModal/WaitingForTraceBody.js create mode 100644 src/utils/deviceHelper.js diff --git a/public/locales/de/translation.json b/public/locales/de/translation.json index 5972819..d6c92a3 100644 --- a/public/locales/de/translation.json +++ b/public/locales/de/translation.json @@ -19,7 +19,7 @@ }, "commands": { "error": "Fehler beim Senden des Befehls!", - "success": "Befehl erfolgreich übermittelt", + "success": "Der Befehl wurde erfolgreich gesendet. Sie können das Ergebnis im Befehlsprotokoll anzeigen", "title": "Gerätebefehle" }, "common": { @@ -160,8 +160,10 @@ "trace": { "choose_network": "Netzwerk auswählen", "directions": "Starten Sie eine Fernverfolgung dieses Geräts für eine bestimmte Dauer oder eine Anzahl von Paketen", + "download_trace": "Klicke hier zum herunterladen", "packets": "Pakete", - "title": "Trace-Gerät" + "title": "Trace-Gerät", + "waiting_seconds": "Verstrichene Zeit: {{seconds}} Sekunden" }, "upgrade": { "command_submitted": "Befehl gesendet", diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 5bdf131..5358d68 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -19,7 +19,7 @@ }, "commands": { "error": "Error while submitting command!", - "success": "Command submitted successfully", + "success": "Command submitted successfully, you can look at the Commands log for the result", "title": "Device Commands" }, "common": { @@ -160,8 +160,10 @@ "trace": { "choose_network": "Choose network", "directions": "Launch a remote trace of this device for either a specific duration or a number of packets", + "download_trace": "Click here to download", "packets": "Packets", - "title": "Trace Device" + "title": "Trace Device", + "waiting_seconds": "Time Elapsed: {{seconds}} seconds" }, "upgrade": { "command_submitted": "Command submitted", diff --git a/public/locales/es/translation.json b/public/locales/es/translation.json index 62e7c90..79da791 100644 --- a/public/locales/es/translation.json +++ b/public/locales/es/translation.json @@ -19,7 +19,7 @@ }, "commands": { "error": "¡Error al enviar el comando!", - "success": "Comando enviado con éxito", + "success": "Comando enviado con éxito, puede consultar el registro de Comandos para ver el resultado", "title": "Comandos del dispositivo" }, "common": { @@ -160,8 +160,10 @@ "trace": { "choose_network": "Elija la red", "directions": "Lanzar un rastreo remoto de este dispositivo por una duración específica o por una cantidad de paquetes", + "download_trace": "Haga click aquí para descargar", "packets": "Paquetes", - "title": "Dispositivo de seguimiento" + "title": "Dispositivo de seguimiento", + "waiting_seconds": "Tiempo transcurrido: {{seconds}} segundos" }, "upgrade": { "command_submitted": "Comando enviado", diff --git a/public/locales/fr/translation.json b/public/locales/fr/translation.json index c1064ef..89ab4a9 100644 --- a/public/locales/fr/translation.json +++ b/public/locales/fr/translation.json @@ -19,7 +19,7 @@ }, "commands": { "error": "Erreur lors de la soumission de la commande !", - "success": "Commande soumise avec succès", + "success": "Commande soumise avec succès, vous pouvez consulter le journal des commandes pour le résultat", "title": "Commandes de l'appareil" }, "common": { @@ -160,8 +160,10 @@ "trace": { "choose_network": "Choisir le réseau", "directions": "Lancer une trace à distance de cet appareil pour une durée spécifique ou un nombre de paquets", + "download_trace": "Cliquez ici pour télécharger", "packets": "Paquets", - "title": "Dispositif de traçage" + "title": "Dispositif de traçage", + "waiting_seconds": "Temps écoulé : {{seconds}} secondes" }, "upgrade": { "command_submitted": "Commande soumise", diff --git a/public/locales/pt/translation.json b/public/locales/pt/translation.json index fac5310..5d02ed5 100644 --- a/public/locales/pt/translation.json +++ b/public/locales/pt/translation.json @@ -19,7 +19,7 @@ }, "commands": { "error": "Erro ao enviar comando!", - "success": "Comando enviado com sucesso", + "success": "Comando enviado com sucesso, você pode consultar o log de Comandos para ver o resultado", "title": "Comandos de dispositivo" }, "common": { @@ -160,8 +160,10 @@ "trace": { "choose_network": "Escolha a rede", "directions": "Lançar um rastreamento remoto deste dispositivo para uma duração específica ou um número de pacotes", + "download_trace": "Clique aqui para baixar", "packets": "Pacotes", - "title": "Dispositivo de rastreamento" + "title": "Dispositivo de rastreamento", + "waiting_seconds": "Tempo decorrido: {{seconds}} segundos" }, "upgrade": { "command_submitted": "Comando enviado", diff --git a/src/components/FirmwareUpgradeModal/containers/UpgradeFooter/index.js b/src/components/FirmwareUpgradeModal/UpgradeFooter.js similarity index 100% rename from src/components/FirmwareUpgradeModal/containers/UpgradeFooter/index.js rename to src/components/FirmwareUpgradeModal/UpgradeFooter.js diff --git a/src/components/FirmwareUpgradeModal/containers/UpgradeWaitingBody/index.js b/src/components/FirmwareUpgradeModal/UpgradeWaitingBody.js similarity index 82% rename from src/components/FirmwareUpgradeModal/containers/UpgradeWaitingBody/index.js rename to src/components/FirmwareUpgradeModal/UpgradeWaitingBody.js index a81d27a..b94ad25 100644 --- a/src/components/FirmwareUpgradeModal/containers/UpgradeWaitingBody/index.js +++ b/src/components/FirmwareUpgradeModal/UpgradeWaitingBody.js @@ -24,7 +24,7 @@ const UpgradeWaitingBody = ({ serialNumber }) => { .get(`/device/${encodeURIComponent(serialNumber)}/status`, options) .then((response) => response.data.connected) .catch(() => {}); - } + }; const getFirmwareVersion = () => { const options = { @@ -38,28 +38,27 @@ const UpgradeWaitingBody = ({ serialNumber }) => { .get(`/device/${encodeURIComponent(serialNumber)}`, options) .then((response) => response.data.firmware) .catch(() => {}); - } + }; const refreshStep = () => { - if(currentStep === 0 && !getDeviceConnection){ + if (currentStep === 0 && !getDeviceConnection) { const labelsToAdd = [ t('upgrade.device_disconnected'), t('upgrade.device_upgrading_firmware'), t('upgrade.waiting_for_device'), ]; - setLabelsToShow([...labelsToShow, ...labelsToAdd]) + setLabelsToShow([...labelsToShow, ...labelsToAdd]); setCurrentStep(1); - } - else if(currentStep === 1 && getDeviceConnection()){ + } else if (currentStep === 1 && getDeviceConnection()) { const newFirmware = `: ${getFirmwareVersion()}`; const labelsToAdd = [ t('upgrade.device_reconnected'), - `${t('upgrade.new_version')}: ${newFirmware}` + `${t('upgrade.new_version')}: ${newFirmware}`, ]; setLabelsToShow([...labelsToShow, ...labelsToAdd]); setCurrentStep(2); } - } + }; useEffect(() => { const refreshIntervalId = setInterval(() => { @@ -68,7 +67,7 @@ const UpgradeWaitingBody = ({ serialNumber }) => { const timerIntervalId = setInterval(() => { setSecondsElapsed(secondsElapsed + 1); - }) + }, 1000); return () => { clearInterval(refreshIntervalId); @@ -79,10 +78,14 @@ const UpgradeWaitingBody = ({ serialNumber }) => { return (
- { - labelsToShow.map((label) =>

{new Date().toString()}: {label}

) - } -

{t('common.seconds_elapsed')}: {secondsElapsed}

+ {labelsToShow.map((label) => ( +

+ {new Date().toString()}: {label} +

+ ))} +

+ {t('common.seconds_elapsed')}: {secondsElapsed} +

); diff --git a/src/components/FirmwareUpgradeModal/index.js b/src/components/FirmwareUpgradeModal/index.js index 7edf9d9..07f1b6a 100644 --- a/src/components/FirmwareUpgradeModal/index.js +++ b/src/components/FirmwareUpgradeModal/index.js @@ -9,7 +9,7 @@ import { CRow, CInput, CInvalidFeedback, - CModalFooter + CModalFooter, } from '@coreui/react'; import React, { useState, useEffect } from 'react'; import { useTranslation } from 'react-i18next'; @@ -21,9 +21,10 @@ import 'react-widgets/styles.css'; import { getToken } from 'utils/authHelper'; import axiosInstance from 'utils/axiosInstance'; import eventBus from 'utils/eventBus'; -import ButtonFooter from './containers/UpgradeFooter'; +import getDeviceConnection from 'utils/deviceHelper'; +import ButtonFooter from './UpgradeFooter'; import styles from './index.module.scss'; -import UpgradeWaitingBody from './containers/UpgradeWaitingBody'; +import UpgradeWaitingBody from './UpgradeWaitingBody'; const FirmwareUpgradeModal = ({ show, toggleModal }) => { const { t } = useTranslation(); @@ -37,10 +38,18 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { const [disabledWaiting, setDisableWaiting] = useState(false); const [waitingForUpgrade, setWaitingForUpgrade] = useState(false); const [showWaitingConsole, setShowWaitingConsole] = useState(false); - const [lastResult, setLastResult] = useState(null); + const [deviceConnected, setDeviceConnected] = useState(true); const selectedDeviceId = useSelector((state) => state.selectedDeviceId); const toggleNow = () => { + if(isNow){ + setWaitForUpgrade(false); + setDisableWaiting(true); + } + else{ + setDisableWaiting(false); + } + setIsNow(!isNow); }; @@ -48,20 +57,6 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { setWaitForUpgrade(waitForUpgrade); }; - const getDeviceConnection = async () => { - const options = { - headers: { - Accept: 'application/json', - Authorization: `Bearer ${getToken()}`, - }, - }; - - return axiosInstance - .get(`/device/${encodeURIComponent(selectedDeviceId)}/status`, options) - .then((response) => response.data.connected) - .catch(() => false); - } - const formValidation = () => { let valid = true; if (firmware.trim() === '') { @@ -87,11 +82,12 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { }, [firmware, date]); useEffect(() => { - if(selectedDeviceId !== null && show){ + if (selectedDeviceId !== null && show) { const asyncGet = async () => { - const isConnected = await getDeviceConnection(); + const isConnected = await getDeviceConnection(selectedDeviceId); setDisableWaiting(!isConnected); - } + setDeviceConnected(isConnected); + }; asyncGet(); } }, [show]); @@ -112,18 +108,16 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { uri: firmware, }; axiosInstance - .post(`/device/${encodeURIComponent(selectedDeviceId)}/upgrade`, parameters, { headers }) - .then((response) => { - setLastResult(response); - if(waitForUpgrade) { + .post(`/device/${encodeURIComponent(selectedDeviceId)}/reboot`, parameters, { headers }) + .then(() => { + if (waitForUpgrade) { + console.log('waiting'); setShowWaitingConsole(true); } }) .catch(() => { - setLastResult('error'); }) .finally(() => { - console.log(lastResult); setBlockFields(false); setWaitingForUpgrade(false); eventBus.dispatch('actionCompleted', { message: 'An action has been completed' }); @@ -131,16 +125,14 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { } }; - if(showWaitingConsole){ + if (showWaitingConsole) { return ( {t('upgrade.title')} - + @@ -158,37 +150,6 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => {
{t('upgrade.directions')}
- - -

{t('common.execute_now')}

- - - - - -

{t('upgrade.firmware_uri')}

@@ -209,7 +170,41 @@ const FirmwareUpgradeModal = ({ show, toggleModal }) => { -

{t('upgrade.wait_for_upgrade')}

+

{t('common.execute_now')}

+ + + + + + + ); -} +}; LatestStatisticsModal.propTypes = { serialNumber: PropTypes.string.isRequired, diff --git a/src/components/InterfaceStatistics/StatisticsChartList.js b/src/components/InterfaceStatistics/StatisticsChartList.js index 1fe5c39..16b43db 100644 --- a/src/components/InterfaceStatistics/StatisticsChartList.js +++ b/src/components/InterfaceStatistics/StatisticsChartList.js @@ -60,14 +60,15 @@ const StatisticsChartList = ({ selectedDeviceId, lastRefresh }) => { // Looping through the interfaces of the log for (const inter of log.data.interfaces) { interfaceList[interfaceTypes[inter.name]][0].data.push( - Math.floor(inter.counters.tx_bytes / 1024), + inter.counters?.tx_bytes? Math.floor(inter.counters.tx_bytes / 1024) : 0 ); interfaceList[interfaceTypes[inter.name]][1].data.push( - Math.floor(inter.counters.rx_bytes / 1024), + inter.counters?.rx_bytes? Math.floor(inter.counters.rx_bytes / 1024) : 0 ); } } + const options = { chart: { id: 'chart', @@ -105,7 +106,6 @@ const StatisticsChartList = ({ selectedDeviceId, lastRefresh }) => { interfaceList, settings: options, }; - if (statOptions !== newOptions) { setStatOptions(newOptions); } diff --git a/src/components/InterfaceStatistics/index.js b/src/components/InterfaceStatistics/index.js index 7a393e7..9593e39 100644 --- a/src/components/InterfaceStatistics/index.js +++ b/src/components/InterfaceStatistics/index.js @@ -1,7 +1,17 @@ import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; import PropTypes from 'prop-types'; -import { CDropdown, CDropdownToggle, CDropdownMenu, CDropdownItem, CCard, CCardHeader, CCardBody, CRow, CCol } from '@coreui/react'; +import { + CDropdown, + CDropdownToggle, + CDropdownMenu, + CDropdownItem, + CCard, + CCardHeader, + CCardBody, + CRow, + CCol, +} from '@coreui/react'; import { cilOptions } from '@coreui/icons'; import CIcon from '@coreui/icons-react'; import StatisticsChartList from './StatisticsChartList'; @@ -15,7 +25,7 @@ const DeviceStatisticsCard = ({ selectedDeviceId }) => { const toggleLatestModal = () => { setShowLatestModal(!showLatestModal); - } + }; const refresh = () => { setLastRefresh(new Date().toString()); @@ -26,20 +36,19 @@ const DeviceStatisticsCard = ({ selectedDeviceId }) => { -

{t('statistics.title')}

 + +

{t('statistics.title')}

+ - + {t('common.refresh')} - {t('statistics.show_latest')} + + {t('statistics.show_latest')} + @@ -49,7 +58,11 @@ const DeviceStatisticsCard = ({ selectedDeviceId }) => { - + ); }; diff --git a/src/components/TraceModal/WaitingForTraceBody.js b/src/components/TraceModal/WaitingForTraceBody.js new file mode 100644 index 0000000..9444d32 --- /dev/null +++ b/src/components/TraceModal/WaitingForTraceBody.js @@ -0,0 +1,101 @@ +import React, { useState, useEffect } from 'react'; +import { useTranslation } from 'react-i18next'; +import PropTypes from 'prop-types'; +import { CModalBody, CButton, CSpinner } from '@coreui/react'; +import { getToken } from 'utils/authHelper'; +import axiosInstance from 'utils/axiosInstance'; + +import styles from './index.module.scss'; + +const WaitingForTraceBody = ({serialNumber, commandUuid}) => { + const { t } = useTranslation(); + const [secondsElapsed, setSecondsElapsed] = useState(0); + const [waitingForFile, setWaitingForFile] = useState(true); + + const getTraceResult = () => { + const options = { + headers: { + Accept: 'application/json', + Authorization: `Bearer ${getToken()}`, + }, + }; + + axiosInstance + .get(`/command/${encodeURIComponent(commandUuid)}`, options) + .then((response) => { + if(response.data.waitingForFile === 0){ + setWaitingForFile(false); + } + }) + .catch(() => {}); + } + + const downloadTrace = () => { + const options = { + headers: { + Accept: 'application/octet-stream', + Authorization: `Bearer ${getToken()}`, + }, + responseType: 'arraybuffer', + }; + + axiosInstance + .get(`/file/${commandUuid}?serialNumber=${serialNumber}`, options) + .then((response) => { + const blob = new Blob([response.data], { type: 'application/octet-stream' }); + const link = document.createElement('a'); + link.href = window.URL.createObjectURL(blob); + link.download = `Trace_${commandUuid}.pcap`; + link.click(); + }); + } + + useEffect(() => { + const timer = setInterval(() => { + setSecondsElapsed(secondsElapsed + 1); + }, 1000); + if(!waitingForFile){ + clearInterval(timer); + } + return () => { + clearInterval(timer); + } + }, [waitingForFile, secondsElapsed]); + + useEffect(() => { + const refreshStatus = setInterval(() => { + getTraceResult(); + }, 5000); + if(!waitingForFile){ + clearInterval(refreshStatus); + } + return () => { + clearInterval(refreshStatus); + } + }, [waitingForFile]); + + return ( + +

{t('trace.waiting_seconds', {seconds: secondsElapsed})}

+
+
+ + + ); +} + +WaitingForTraceBody.propTypes = { + serialNumber: PropTypes.string.isRequired, + commandUuid: PropTypes.string.isRequired, +}; + +export default WaitingForTraceBody; diff --git a/src/components/TraceModal/index.js b/src/components/TraceModal/index.js index e4e3f62..4afdbd1 100644 --- a/src/components/TraceModal/index.js +++ b/src/components/TraceModal/index.js @@ -9,6 +9,7 @@ import { CRow, CInvalidFeedback, CSelect, + CSwitch, CForm, CInputRadio, CFormGroup, @@ -19,28 +20,44 @@ import { useTranslation } from 'react-i18next'; import DatePicker from 'react-widgets/DatePicker'; import PropTypes from 'prop-types'; import { useSelector } from 'react-redux'; -import { convertDateToUtc, dateToUnix } from 'utils/helper'; +import { dateToUnix } from 'utils/helper'; import 'react-widgets/styles.css'; import { getToken } from 'utils/authHelper'; import axiosInstance from 'utils/axiosInstance'; import eventBus from 'utils/eventBus'; +import getDeviceConnection from 'utils/deviceHelper'; import LoadingButton from 'components/LoadingButton'; import SuccessfulActionModalBody from 'components/SuccessfulActionModalBody'; +import WaitingForTraceBody from './WaitingForTraceBody'; import styles from './index.module.scss'; const TraceModal = ({ show, toggleModal }) => { const { t } = useTranslation(); const [hadSuccess, setHadSuccess] = useState(false); const [hadFailure, setHadFailure] = useState(false); - const [waiting, setWaiting] = useState(false); + const [blockFields, setBlockFields] = useState(false); const [usingDuration, setUsingDuration] = useState(true); const [duration, setDuration] = useState(20); const [packets, setPackets] = useState(100); const [chosenDate, setChosenDate] = useState(new Date().toString()); const [responseBody, setResponseBody] = useState(''); const [chosenInterface, setChosenInterface] = useState('up'); + const [isDeviceConnected, setIsDeviceConnected] = useState(false); + const [isNow, setIsNow] = useState(true); + const [waitForTrace, setWaitForTrace] = useState(false); + const [waitingForTrace, setWaitingForTrace] = useState(false); + const [commandUuid, setCommandUuid] = useState(null); + const selectedDeviceId = useSelector((state) => state.selectedDeviceId); + const toggleWaitForTrace = () => { + setWaitForTrace(!waitForTrace); + } + + const toggleNow = () => { + setIsNow(!isNow); + } + const setDate = (date) => { if (date) { setChosenDate(date.toString()); @@ -48,35 +65,27 @@ const TraceModal = ({ show, toggleModal }) => { }; useEffect(() => { + setWaitForTrace(false); setHadSuccess(false); setHadFailure(false); - setWaiting(false); setChosenDate(new Date().toString()); setResponseBody(''); setDuration(20); setPackets(100); setChosenInterface('up'); + setWaitingForTrace(false); }, [show]); const doAction = () => { + setBlockFields(true); setHadFailure(false); setHadSuccess(false); - setWaiting(true); const token = getToken(); - const dateChosen = new Date(chosenDate); - const now = new Date(); - let utcDateString = dateChosen.toISOString(); - - if (dateChosen <= now) { - const newDate = new Date(); - newDate.setSeconds(newDate.getSeconds() + 60); - utcDateString = newDate.toISOString(); - } const parameters = { serialNumber: selectedDeviceId, - when: dateChosen <= now ? 0 : dateToUnix(utcDateString), + when: isNow ? 0 : dateToUnix(new Date(chosenDate)), network: chosenInterface, }; @@ -93,158 +102,218 @@ const TraceModal = ({ show, toggleModal }) => { axiosInstance .post(`/device/${encodeURIComponent(selectedDeviceId)}/trace`, parameters, { headers }) - .then(() => { + .then((response) => { setHadSuccess(true); + if(waitForTrace) { + setCommandUuid(response.data.UUID); + setWaitingForTrace(true); + } }) .catch(() => { setResponseBody(t('commands.error')); setHadFailure(true); }) .finally(() => { - setWaiting(false); + setBlockFields(false); + setBlockFields(false); eventBus.dispatch('actionCompleted', { message: 'An action has been completed' }); }); }; + useEffect(() => { + if (selectedDeviceId !== null && show) { + const asyncGet = async () => { + const isConnected = await getDeviceConnection(selectedDeviceId); + setIsDeviceConnected(isConnected); + }; + asyncGet(); + } + }, [show]); + + + const getBody = () => { + if(waitingForTrace){ + return ( + + ); + } + if(hadSuccess){ + return( + + ); + } + return ( +
+ +
{t('trace.directions')}
+ + + setUsingDuration(true)} + > + {t('common.duration')} + + + + setUsingDuration(false)} + > + {t('trace.packets')} + + + + + + {usingDuration ? 'Duration: ' : 'Packets: '} + + + {usingDuration ? ( + + + + + + + ) : ( + + + + + + + )} + + + + {t('trace.choose_network')}: + + + setChosenInterface('up')}> + + + Up + + + setChosenInterface('down')}> + + + Down + + + + + + + +

{t('common.execute_now')}

+ + + + + + + {t('common.need_date')} + + + + + + + {t('common.cancel')} + + +
+ ); + } + return ( {t('trace.title')} - {hadSuccess ? ( - - ) : ( -
- -
{t('trace.directions')}
- - - setUsingDuration(true)} - > - {t('common.duration')} - - - - setUsingDuration(false)} - > - {t('trace.packets')} - - - - - - {usingDuration ? 'Duration: ' : 'Packets: '} - - - {usingDuration ? ( - - - - - - - ) : ( - - - - - - - )} - - - - -

{t('common.date')}:

- - - setDate(date)} - min={convertDateToUtc(new Date())} - /> - - - {t('common.need_date')} - - {t('trace.choose_network')}: - - - setChosenInterface('up')}> - - - Up - - - setChosenInterface('down')}> - - - Down - - - - - - - - - - - {t('common.cancel')} - - -
- )} + {getBody()} ); }; diff --git a/src/components/TraceModal/index.module.scss b/src/components/TraceModal/index.module.scss index ac83ce9..7596431 100644 --- a/src/components/TraceModal/index.module.scss +++ b/src/components/TraceModal/index.module.scss @@ -5,3 +5,7 @@ .spacedColumn { margin-top: 7px; } + +.centerDiv { + text-align: center; +} diff --git a/src/layout/Sidebar/index.module.scss b/src/layout/Sidebar/index.module.scss index 7a8ab70..edc4f70 100644 --- a/src/layout/Sidebar/index.module.scss +++ b/src/layout/Sidebar/index.module.scss @@ -1,6 +1,6 @@ .sidebarImgFull { - height: 75px; - width: 75px; + height: 100px; + width: 230px; } .sidebarImgMinimized { diff --git a/src/utils/deviceHelper.js b/src/utils/deviceHelper.js new file mode 100644 index 0000000..7fd318d --- /dev/null +++ b/src/utils/deviceHelper.js @@ -0,0 +1,16 @@ +import { getToken } from 'utils/authHelper'; +import axiosInstance from 'utils/axiosInstance'; + +export default async (deviceId) => { + const options = { + headers: { + Accept: 'application/json', + Authorization: `Bearer ${getToken()}`, + }, + }; + + return axiosInstance + .get(`/device/${encodeURIComponent(deviceId)}/status`, options) + .then((response) => response.data.connected) + .catch(() => false); +};