alova - add interceptor

interface/src/framework/ap/APSettingsForm.tsx

@@ -20,7 +20,7 @@ import {
 
 import { useI18nContext } from 'i18n/i18n-react';
 import { APProvisionMode } from 'types';
-import { numberValue, updateValueDirty, useRest2 } from 'utils';
+import { numberValue, updateValueDirty, useRest } from 'utils';
 
 import { createAPSettingsValidator, validate } from 'validators';
 
@@ -39,7 +39,7 @@ const APSettingsForm: FC = () => {
     blocker,
     saveData,
     errorMessage
-  } = useRest2<APSettings>({
+  } = useRest<APSettings>({
     read: APApi.readAPSettings,
     update: APApi.updateAPSettings
   });

interface/src/framework/mqtt/MqttSettingsForm.tsx

@@ -17,7 +17,7 @@ import {
   BlockNavigation
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
-import { numberValue, updateValueDirty, useRest2 } from 'utils';
+import { numberValue, updateValueDirty, useRest } from 'utils';
 
 import { createMqttSettingsValidator, validate } from 'validators';
 
@@ -33,7 +33,7 @@ const MqttSettingsForm: FC = () => {
     blocker,
     saveData,
     errorMessage
-  } = useRest2<MqttSettings>({
+  } = useRest<MqttSettings>({
     read: MqttApi.readMqttSettings,
     update: MqttApi.updateMqttSettings
   });

interface/src/framework/network/NetworkSettingsForm.tsx

@@ -43,7 +43,7 @@ import {
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
 
-import { numberValue, updateValueDirty, useRest2 } from 'utils';
+import { numberValue, updateValueDirty, useRest } from 'utils';
 
 import { validate } from 'validators';
 import { createNetworkSettingsValidator } from 'validators/network';
@@ -68,7 +68,7 @@ const WiFiSettingsForm: FC = () => {
     saveData,
     errorMessage,
     restartNeeded
-  } = useRest2<NetworkSettings>({
+  } = useRest<NetworkSettings>({
     read: NetworkApi.readNetworkSettings,
     update: NetworkApi.updateNetworkSettings
   });

interface/src/framework/ntp/NTPSettingsForm.tsx

@@ -19,7 +19,7 @@ import {
   BlockNavigation
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
-import { updateValueDirty, useRest2 } from 'utils';
+import { updateValueDirty, useRest } from 'utils';
 import { validate } from 'validators';
 import { NTP_SETTINGS_VALIDATOR } from 'validators/ntp';
 
@@ -35,7 +35,7 @@ const NTPSettingsForm: FC = () => {
     blocker,
     saveData,
     errorMessage
-  } = useRest2<NTPSettings>({
+  } = useRest<NTPSettings>({
     read: NTPApi.readNTPSettings,
     update: NTPApi.updateNTPSettings
   });

interface/src/framework/security/GenerateToken.tsx

@@ -10,16 +10,14 @@ import {
   TextField,
   Button
 } from '@mui/material';
-import { useCallback, useState, useEffect } from 'react';
+import { useRequest } from 'alova';
+import { useEffect } from 'react';
 
-import { toast } from 'react-toastify';
 import type { FC } from 'react';
-import type { Token } from 'types';
 import * as SecurityApi from 'api/security';
 import { MessageBox } from 'components';
 
 import { useI18nContext } from 'i18n/i18n-react';
-import { extractErrorMessage } from 'utils';
 
 interface GenerateTokenProps {
   username?: string;
@@ -27,24 +25,18 @@ interface GenerateTokenProps {
 }
 
 const GenerateToken: FC<GenerateTokenProps> = ({ username, onClose }) => {
-  const [token, setToken] = useState<Token>();
+  const { LL } = useI18nContext();
   const open = !!username;
 
-  const { LL } = useI18nContext();
-
-  const getToken = useCallback(async () => {
-    try {
-      setToken((await SecurityApi.generateToken(username)).data);
-    } catch (error) {
-      toast.error(extractErrorMessage(error, LL.PROBLEM_UPDATING()));
-    }
-  }, [username, LL]);
+  const { data: token, send: generateToken } = useRequest(SecurityApi.generateToken(username), {
+    immediate: false
+  });
 
   useEffect(() => {
     if (open) {
-      void getToken();
+      void generateToken();
     }
-  }, [open, getToken]);
+  }, [open, generateToken]);
 
   return (
     <Dialog onClose={onClose} aria-labelledby="generate-token-dialog-title" open={!!username} fullWidth maxWidth="sm">

interface/src/framework/security/ManageUsersForm.tsx

@@ -23,8 +23,7 @@ import { useRest } from 'utils';
 import { createUserValidator } from 'validators';
 
 const ManageUsersForm: FC = () => {
-  // TODO move to Alova
-  const { loadData, saving, data, setData, saveData, errorMessage } = useRest<SecuritySettings>({
+  const { loadData, saveData, saving, data, updateDataValue, errorMessage } = useRest<SecuritySettings>({
     read: SecurityApi.readSecuritySettings,
     update: SecurityApi.updateSecuritySettings
   });
@@ -85,7 +84,7 @@ const ManageUsersForm: FC = () => {
 
     const removeUser = (toRemove: User) => {
       const users = data.users.filter((u) => u.username !== toRemove.username);
-      setData({ ...data, users });
+      updateDataValue({ ...data, users });
     };
 
     const createUser = () => {
@@ -109,7 +108,7 @@ const ManageUsersForm: FC = () => {
     const doneEditingUser = () => {
       if (user) {
         const users = [...data.users.filter((u) => u.username !== user.username), user];
-        setData({ ...data, users });
+        updateDataValue({ ...data, users });
         setUser(undefined);
       }
     };

interface/src/framework/security/SecuritySettingsForm.tsx

@@ -18,16 +18,25 @@ const SecuritySettingsForm: FC = () => {
   const { LL } = useI18nContext();
 
   const [fieldErrors, setFieldErrors] = useState<ValidateFieldsError>();
-  // TODO move to Alova
-  const { loadData, saving, data, setData, origData, dirtyFlags, blocker, setDirtyFlags, saveData, errorMessage } =
-    useRest<SecuritySettings>({
-      read: SecurityApi.readSecuritySettings,
-      update: SecurityApi.updateSecuritySettings
-    });
+  const {
+    loadData,
+    saving,
+    data,
+    updateDataValue,
+    origData,
+    dirtyFlags,
+    setDirtyFlags,
+    blocker,
+    saveData,
+    errorMessage
+  } = useRest<SecuritySettings>({
+    read: SecurityApi.readSecuritySettings,
+    update: SecurityApi.updateSecuritySettings
+  });
 
   const authenticatedContext = useContext(AuthenticatedContext);
 
-  const updateFormValue = updateValueDirty(origData, dirtyFlags, setDirtyFlags, setData);
+  const updateFormValue = updateValueDirty(origData, dirtyFlags, setDirtyFlags, updateDataValue);
 
   const content = () => {
     if (!data) {

interface/src/framework/system/OTASettingsForm.tsx

@@ -18,7 +18,7 @@ import {
 } from 'components';
 
 import { useI18nContext } from 'i18n/i18n-react';
-import { numberValue, updateValueDirty, useRest2 } from 'utils';
+import { numberValue, updateValueDirty, useRest } from 'utils';
 
 import { validate } from 'validators';
 import { OTA_SETTINGS_VALIDATOR } from 'validators/system';
@@ -35,7 +35,7 @@ const OTASettingsForm: FC = () => {
     setDirtyFlags,
     blocker,
     errorMessage
-  } = useRest2<OTASettings>({
+  } = useRest<OTASettings>({
     read: SystemApi.readOTASettings,
     update: SystemApi.updateOTASettings
   });

interface/src/framework/system/SystemLog.tsx

@@ -16,7 +16,7 @@ import { SectionContent, FormLoader, BlockFormControlLabel, BlockNavigation } fr
 
 import { useI18nContext } from 'i18n/i18n-react';
 import { LogLevel } from 'types';
-import { updateValueDirty, useRest2 } from 'utils';
+import { updateValueDirty, useRest } from 'utils';
 
 export const LOG_EVENTSOURCE_URL = EVENT_SOURCE_ROOT + 'log';
 
@@ -52,7 +52,7 @@ const SystemLog: FC = () => {
   const { LL } = useI18nContext();
 
   const { loadData, data, updateDataValue, origData, dirtyFlags, setDirtyFlags, blocker, saveData, errorMessage } =
-    useRest2<LogSettings>({
+    useRest<LogSettings>({
       read: SystemApi.readLogSettings,
       update: SystemApi.updateLogSettings
     });

interface/src/framework/system/SystemStatusForm.tsx

@@ -57,8 +57,6 @@ const SystemStatusForm: FC = () => {
   const [confirmFactoryReset, setConfirmFactoryReset] = useState<boolean>(false);
   const [processing, setProcessing] = useState<boolean>(false);
   const [showingVersion, setShowingVersion] = useState<boolean>(false);
-  const [latestVersion, setLatestVersion] = useState<Version>();
-  const [latestDevVersion, setLatestDevVersion] = useState<Version>();
   const [restarting, setRestarting] = useState<boolean>();
 
   const { send: restartCommand } = useRequest(SystemApi.restart(), {
@@ -73,24 +71,10 @@ const SystemStatusForm: FC = () => {
     immediate: false
   });
 
-  const { data: data, send: loadData, error } = useRequest(SystemApi.readSystemStatus, { force: true });
+  const { data: latestVersion } = useRequest(SystemApi.getStableVersion);
+  const { data: latestDevVersion } = useRequest(SystemApi.getDevVersion);
 
-  useEffect(() => {
-    void axios.get(VERSIONCHECK_ENDPOINT).then((response) => {
-      setLatestVersion({
-        version: response.data.name,
-        url: response.data.assets[1].browser_download_url,
-        changelog: response.data.assets[0].browser_download_url
-      });
-    });
-    void axios.get(VERSIONCHECK_DEV_ENDPOINT).then((response) => {
-      setLatestDevVersion({
-        version: response.data.name.split(/\s+/).splice(-1),
-        url: response.data.assets[1].browser_download_url,
-        changelog: response.data.assets[0].browser_download_url
-      });
-    });
-  }, []);
+  const { data: data, send: loadData, error } = useRequest(SystemApi.readSystemStatus, { force: true });
 
   const restart = async () => {
     setProcessing(true);