more alova ports

interface/src/framework/network/NetworkSettingsForm.tsx

@@ -18,6 +18,7 @@ import {
   InputAdornment,
   TextField
 } from '@mui/material';
+// eslint-disable-next-line import/named
 import { updateState, useRequest } from 'alova';
 import { useContext, useEffect, useState } from 'react';
 import { toast } from 'react-toastify';
@@ -29,6 +30,7 @@ import type { FC } from 'react';
 
 import type { NetworkSettings } from 'types';
 import * as NetworkApi from 'api/network';
+import * as SystemApi from 'api/system';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -40,7 +42,7 @@ import {
   BlockNavigation
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
-import * as EMSESP from 'project/api';
+
 import { numberValue, updateValueDirty, useRest2 } from 'utils';
 
 import { validate } from 'validators';
@@ -71,7 +73,7 @@ const WiFiSettingsForm: FC = () => {
     update: NetworkApi.updateNetworkSettings
   });
 
-  const { send: restartCommand } = useRequest(EMSESP.restart(), {
+  const { send: restartCommand } = useRequest(SystemApi.restart(), {
     immediate: false
   });
 

interface/src/framework/network/WiFiNetworkScanner.tsx

@@ -1,82 +1,63 @@
 import PermScanWifiIcon from '@mui/icons-material/PermScanWifi';
 import { Button } from '@mui/material';
-import { useEffect, useState, useCallback, useRef } from 'react';
+import { useRequest } from 'alova';
+import { useState, useCallback, useRef } from 'react';
 import { toast } from 'react-toastify';
 
 import WiFiNetworkSelector from './WiFiNetworkSelector';
 import type { FC } from 'react';
-import type { WiFiNetwork, WiFiNetworkList } from 'types';
 import * as NetworkApi from 'api/network';
 import { ButtonRow, FormLoader, SectionContent } from 'components';
 
 import { useI18nContext } from 'i18n/i18n-react';
 
 const NUM_POLLS = 10;
-const POLLING_FREQUENCY = 500;
-
-const compareNetworks = (network1: WiFiNetwork, network2: WiFiNetwork) => {
-  if (network1.rssi < network2.rssi) return 1;
-  if (network1.rssi > network2.rssi) return -1;
-  return 0;
-};
+const POLLING_FREQUENCY = 1000;
 
 const WiFiNetworkScanner: FC = () => {
   const { LL } = useI18nContext();
 
   const pollCount = useRef(0);
-  const [networkList, setNetworkList] = useState<WiFiNetworkList>();
   const [errorMessage, setErrorMessage] = useState<string>();
 
+  const { data: networkList, send: getNetworkList } = useRequest(NetworkApi.listNetworks, {
+    immediate: false
+  });
+
+  const {
+    send: scanNetworks,
+    onSuccess: onSuccessScanNetworks,
+    onError: onErrorScanNetworks
+  } = useRequest(NetworkApi.scanNetworks);
+
   const finishedWithError = useCallback((message: string) => {
     toast.error(message);
-    setNetworkList(undefined);
     setErrorMessage(message);
+    pollCount.current = 0;
   }, []);
 
-  const pollNetworkList = useCallback(async () => {
-    try {
-      const response = await NetworkApi.listNetworks();
-      if (response.status === 202) {
-        const completedPollCount = pollCount.current + 1;
-        if (completedPollCount < NUM_POLLS) {
-          pollCount.current = completedPollCount;
-          setTimeout(pollNetworkList, POLLING_FREQUENCY);
-        } else {
-          finishedWithError(LL.PROBLEM_LOADING());
-        }
-      } else {
-        const newNetworkList = response.data;
-        newNetworkList.networks.sort(compareNetworks);
-        setNetworkList(newNetworkList);
-      }
-    } catch (error) {
-      if (error.response) {
-        finishedWithError(LL.PROBLEM_LOADING() + ' ' + error.response?.data.message);
+  onErrorScanNetworks((event) => {
+    console.log('onErrorScanNetworks'); // TODO fix
+    if (event.error?.message === 'Wait') {
+      // 202
+      console.log('not ready...: ', event.error?.message); // TODO fix
+      const completedPollCount = pollCount.current + 1;
+      if (completedPollCount < NUM_POLLS) {
+        pollCount.current = completedPollCount;
+        setTimeout(scanNetworks, POLLING_FREQUENCY);
       } else {
         finishedWithError(LL.PROBLEM_LOADING());
       }
+    } else {
+      finishedWithError(LL.PROBLEM_LOADING());
     }
-  }, [finishedWithError, LL]);
+  });
 
-  const startNetworkScan = useCallback(async () => {
+  onSuccessScanNetworks(() => {
+    console.log('onCompleteScanNetworks'); // TODO fix
     pollCount.current = 0;
-    setNetworkList(undefined);
-    setErrorMessage(undefined);
-    try {
-      await NetworkApi.scanNetworks();
-      setTimeout(pollNetworkList, POLLING_FREQUENCY);
-    } catch (error) {
-      if (error.response) {
-        finishedWithError(LL.PROBLEM_LOADING() + ' ' + error.response?.data.message);
-      } else {
-        finishedWithError(LL.PROBLEM_LOADING());
-      }
-    }
-  }, [finishedWithError, pollNetworkList, LL]);
-
-  useEffect(() => {
-    void startNetworkScan();
-  }, [startNetworkScan]);
+    void getNetworkList(); // fetch the list
+  });
 
   const renderNetworkScanner = () => {
     if (!networkList) {
@@ -93,7 +74,7 @@ const WiFiNetworkScanner: FC = () => {
           startIcon={<PermScanWifiIcon />}
           variant="outlined"
           color="secondary"
-          onClick={startNetworkScan}
+          onClick={scanNetworks}
           disabled={!errorMessage && !networkList}
         >
           {LL.SCAN_AGAIN()}&hellip;