Added loading phase, label changes for wifi scan.

2025-10-30 02:12:33 +00:00 · 2021-06-29 10:44:32 -04:00
parent f6876d13fe
commit d8ab92531f
7 changed files with 101 additions and 42 deletions
--- a/public/locales/de/translation.json
+++ b/public/locales/de/translation.json
@@ -150,7 +150,12 @@
 		"active": "Aktiven Scan aktivieren",
 		"channel": "Kanal",
 		"directions": "Starten Sie einen WLAN-Scan dieses Geräts, der ungefähr 25 Sekunden dauern sollte.",
-		"results": "Ergebnisse des WLAN-Scans"
+		"re_scan": "Erneut scannen",
+		"result_directions": "Bitte klicken Sie auf die Schaltfläche '$t(scan.re_scan)', wenn Sie einen Scan mit derselben Konfiguration wie beim letzten Scan durchführen möchten.",
+		"results": "Ergebnisse des WLAN-Scans",
+		"scan": "Scan",
+		"scanning": "Scannen... ",
+		"waiting_directions": "Bitte warten Sie auf das Scanergebnis. Dies kann bis zu 25 Sekunden dauern. Sie können den Vorgang später beenden und die Ergebnisse aus der Befehlstabelle anzeigen."
 	},
 	"statistics": {
 		"data": "Daten (KB)",
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -150,7 +150,12 @@
 		"active": "Enable active scan",
 		"channel": "Channel",
 		"directions": "Launch a wifi scan of this device, which should take approximately 25 seconds.",
-		"results": "Wifi Scan Results"
+		"re_scan": "Re-Scan",
+		"result_directions": "Please click the '$t(scan.re_scan)' button if you would like to do a scan with the same configuration as the last.",
+		"results": "Wifi Scan Results",
+		"scan": "Scan",
+		"scanning": "Scanning... ",
+		"waiting_directions": "Please wait for the scan result. This may take up to 25 seconds. You can exit and look at the results from the commands table later."
 	},
 	"statistics": {
 		"data": "Data (KB)",
--- a/public/locales/es/translation.json
+++ b/public/locales/es/translation.json
@@ -150,7 +150,12 @@
 		"active": "Habilitar escaneo activo",
 		"channel": "Canal",
 		"directions": "Ejecute un escaneo wifi de este dispositivo, que debería tomar aproximadamente 25 segundos.",
-		"results": "Resultados de escaneo Wifi"
+		"re_scan": "Vuelva a escanear",
+		"result_directions": "Haga clic en el botón '$ t (scan.re_scan)' si desea realizar un escaneo con la misma configuración que el anterior.",
+		"results": "Resultados de escaneo Wifi",
+		"scan": "Escanear",
+		"scanning": "Exploración... ",
+		"waiting_directions": "Espere el resultado del escaneo. Esto puede tardar hasta 25 segundos. Puede salir y ver los resultados de la tabla de comandos más adelante."
 	},
 	"statistics": {
 		"data": "Datos (KB)",
--- a/public/locales/fr/translation.json
+++ b/public/locales/fr/translation.json
@@ -150,7 +150,12 @@
 		"active": "Activer l'analyse active",
 		"channel": "Canal",
 		"directions": "Lancez une analyse wifi de cet appareil, ce qui devrait prendre environ 25 secondes.",
-		"results": "Résultats de l'analyse Wi-Fi"
+		"re_scan": "Nouvelle analyse",
+		"result_directions": "Veuillez cliquer sur le bouton '$t(scan.re_scan)' si vous souhaitez effectuer un scan avec la même configuration que le précédent.",
+		"results": "Résultats de l'analyse Wi-Fi",
+		"scan": "Balayage",
+		"scanning": "Balayage... ",
+		"waiting_directions": "Veuillez attendre le résultat de l'analyse. Cela peut prendre jusqu'à 25 secondes. Vous pouvez quitter et consulter les résultats du tableau des commandes plus tard."
 	},
 	"statistics": {
 		"data": "Données (Ko)",
--- a/public/locales/pt/translation.json
+++ b/public/locales/pt/translation.json
@@ -150,7 +150,12 @@
 		"active": "Habilitar varredura ativa",
 		"channel": "Canal",
 		"directions": "Inicie uma verificação de wi-fi deste dispositivo, o que deve levar aproximadamente 25 segundos.",
-		"results": "Resultados da verificação de wi-fi"
+		"re_scan": "Verificar novamente",
+		"result_directions": "Clique no botão '$ t (scan.re_scan)' se desejar fazer uma varredura com a mesma configuração da anterior.",
+		"results": "Resultados da verificação de wi-fi",
+		"scan": "Varredura",
+		"scanning": "Scanning... ",
+		"waiting_directions": "Por favor, aguarde o resultado da verificação. Isso pode levar até 25 segundos. Você pode sair e ver os resultados da tabela de comandos mais tarde."
 	},
 	"statistics": {
 		"data": "Dados (KB)",
--- a/src/components/WifiScanModal/index.js
+++ b/src/components/WifiScanModal/index.js
@@ -9,6 +9,7 @@ import {
  CForm,
  CSwitch,
  CCol,
+  CSpinner
 } from '@coreui/react';
 import React, { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -29,6 +30,7 @@ const WifiScanModal = ({ show, toggleModal }) => {
  const [waiting, setWaiting] = useState(false);
  const [choseVerbose, setVerbose] = useState(true);
  const [activeScan, setActiveScan] = useState(false);
+  const [hideOptions, setHideOptions] = useState(false);
  const [channelList, setChannelList] = useState([]);
  const selectedDeviceId = useSelector((state) => state.selectedDeviceId);

@@ -47,6 +49,7 @@ const WifiScanModal = ({ show, toggleModal }) => {
    setChannelList([]);
    setVerbose(true);
    setActiveScan(false);
+    setHideOptions(false);
  }, [show]);

  const parseThroughList = (scanList) => {
@@ -104,6 +107,7 @@ const WifiScanModal = ({ show, toggleModal }) => {

        if (scanList) {
          setChannelList(parseThroughList(scanList));
+          setHideOptions(true);
          setHadSuccess(true);
        } else {
          setHadFailure(true);
@@ -124,6 +128,7 @@ const WifiScanModal = ({ show, toggleModal }) => {
        <CModalTitle>{t('actions.wifi_scan')}</CModalTitle>
      </CModalHeader>
      <CModalBody>
+        <div hidden={hideOptions || waiting}>
          <h6>{t('scan.directions')}</h6>
          <CRow className={styles.spacedRow}>
            <CCol md="3">
@@ -157,14 +162,32 @@ const WifiScanModal = ({ show, toggleModal }) => {
              </CForm>
            </CCol>
          </CRow>
-        <div className={styles.spacedRow} hidden={!hadSuccess && !hadFailure}>
+        </div>
+        <div hidden={!waiting}>
+          <CRow>
+            <CCol>
+              <h6>{t('scan.waiting_directions')}</h6>
+            </CCol>
+          </CRow>
+          <CRow>
+            <CCol className={styles.centerDiv}>
+              <CSpinner />
+            </CCol>
+          </CRow>
+        </div>
+        <div hidden={!hadSuccess && !hadFailure}>
+          <CRow className={styles.bottomSpace}>
+            <CCol>
+              <h6>{t('scan.result_directions')}</h6>
+            </CCol>
+          </CRow>
          <WifiChannelTable channels={channelList} />
        </div>
      </CModalBody>
      <CModalFooter>
        <LoadingButton
-          label={t('common.start')}
-          isLoadingLabel={t('common.loading_ellipsis')}
+          label={(!hadSuccess && !hadFailure) ? t('scan.scan') : t('scan.re_scan')}
+          isLoadingLabel={t('scan.scanning')}
          isLoading={waiting}
          action={doAction}
          variant="outline"
@@ -172,7 +195,7 @@ const WifiScanModal = ({ show, toggleModal }) => {
          disabled={waiting}
        />
        <CButton color="secondary" onClick={toggleModal}>
-          {t('common.cancel')}
+        {(!hadSuccess && !hadFailure && waiting) ? t('common.cancel') : t('common.close')}
        </CButton>
      </CModalFooter>
    </CModal>
--- a/src/components/WifiScanModal/index.module.scss
+++ b/src/components/WifiScanModal/index.module.scss
@@ -9,3 +9,14 @@
 .spacedSwitch {
  padding-left: 5%;
 }
+
+.bottomSpace {
+  margin-bottom: 20px;
+}
+
+.centerDiv {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 20px;
+}