fix restart monitor

interface/src/api/endpoints.ts

@@ -11,14 +11,14 @@ export const EVENT_SOURCE_ROOT = 'http://' + host + '/es/';
 
 export const alovaInstance = createAlova({
   statesHook: ReactHook,
-  // timeout: 3000, // timeout not used because of uploading firmware
-  // localCache: null,
-  localCache: {
-    GET: {
-      mode: 'placeholder', // see https://alova.js.org/learning/response-cache/#cache-replaceholder-mode
-      expire: 2000
-    }
-  },
+  timeout: 2000, // timeout not used because of uploading firmware
+  localCache: null,
+  // localCache: {
+  //   GET: {
+  //     mode: 'placeholder', // see https://alova.js.org/learning/response-cache/#cache-replaceholder-mode
+  //     expire: 2000
+  //   }
+  // },
   requestAdapter: xhrRequestAdapter(),
   beforeRequest(method) {
     if (localStorage.getItem(ACCESS_TOKEN)) {

interface/src/api/system.ts

@@ -1,7 +1,7 @@
 import { alovaInstance, alovaInstanceGH } from './endpoints';
 import type { OTASettings, SystemStatus, LogSettings, Version } from 'types';
 
-// SystemStatus - also used to ping in Restart monitor
+// SystemStatus - also used to ping in Restart monitor for pinging
 export const readSystemStatus = () => alovaInstance.Get<SystemStatus>('/rest/systemStatus');
 
 // commands
@@ -45,6 +45,7 @@ export const uploadFile = (file: File) => {
   const formData = new FormData();
   formData.append('file', file);
   return alovaInstance.Post('/rest/uploadFile', formData, {
+    timeout: 60000, // override timeout for uploading firmware - 1 minute
     enableUpload: true
   });
 };

interface/src/framework/system/RestartMonitor.tsx

@@ -1,5 +1,5 @@
-import { useRetriableRequest } from '@alova/scene-react';
-import { useState } from 'react';
+import { useRequest } from 'alova';
+import { useRef, useState, useEffect } from 'react';
 import type { FC } from 'react';
 
 import * as SystemApi from 'api/system';
@@ -7,26 +7,34 @@ import { FormLoader } from 'components';
 
 import { useI18nContext } from 'i18n/i18n-react';
 
+const RESTART_TIMEOUT = 2 * 60 * 1000;
+const POLL_INTERVAL = 3000;
+
 const RestartMonitor: FC = () => {
   const [failed, setFailed] = useState<boolean>(false);
-
+  const [timeoutId, setTimeoutId] = useState<NodeJS.Timeout>();
   const { LL } = useI18nContext();
+  const { send } = useRequest(SystemApi.readSystemStatus, { force: true });
+  const timeoutAt = useRef(new Date().getTime() + RESTART_TIMEOUT);
 
-  // eslint-disable-next-line @typescript-eslint/unbound-method
-  const { onFail, onSuccess } = useRetriableRequest(SystemApi.readSystemStatus(), {
-    retry: 10,
-    backoff: {
-      delay: 1500
+  const poll = useRef(async () => {
+    try {
+      await send();
+      document.location.href = '/';
+    } catch (error) {
+      if (new Date().getTime() < timeoutAt.current) {
+        setTimeoutId(setTimeout(poll.current, POLL_INTERVAL));
+      } else {
+        setFailed(true);
+      }
     }
   });
 
-  onFail(() => {
-    setFailed(true);
-  });
+  useEffect(() => {
+    void poll.current();
+  }, []);
 
-  onSuccess(() => {
-    document.location.href = '/fileUpdated';
-  });
+  useEffect(() => () => timeoutId && clearTimeout(timeoutId), [timeoutId]);
 
   return <FormLoader message={LL.APPLICATION_RESTARTING() + '...'} errorMessage={failed ? 'Timed out' : undefined} />;
 };