alova - add interceptor

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) {