update auto refresh logic in ContainerLogModal to handle refetching state

Author: yomybaby

react/src/components/AutoRefreshSwitch.tsx

@@ -1,27 +1,27 @@
-import { useRafInterval } from 'ahooks';
 import { Switch, SwitchProps, Typography } from 'antd';
 import { BAIFlex } from 'backend.ai-ui';
 import React from 'react';
+import { useInterval } from 'src/hooks/useIntervalValue';
 
 const { Text } = Typography;
 
 interface Props extends SwitchProps {
   children?: React.ReactNode;
   onRefresh: () => void;
-  interval?: number;
+  interval: number | null;
 }
 
 const AutoRefreshSwitch: React.FC<Props> = ({
   children,
-  interval = 5_000,
+  interval = null,
   onRefresh,
   ...switchProps
 }) => {
-  useRafInterval(
+  useInterval(
     () => {
       onRefresh();
     },
-    switchProps.checked ? interval : undefined,
+    switchProps.checked ? interval : null,
   );
 
   return (

react/src/components/ComputeSessionNodeItems/ContainerLogModal.tsx

@@ -219,15 +219,15 @@ const ContainerLogModal: React.FC<ContainerLogModalProps> = ({
             <AutoRefreshSwitch
               checked={autoRefreshEnabled}
               onChange={setAutoRefreshEnabled}
-              interval={autoRefreshIntervalValue}
+              interval={isRefetching ? null : autoRefreshIntervalValue}
               onRefresh={() => {
                 refetch();
               }}
             >
               {t('button.AutoRefresh')}:
             </AutoRefreshSwitch>
             <InputNumber
-              min={1}
+              min={3}
               value={(autoRefreshIntervalValue ?? 1000) / 1000}
               onChange={(value) => {
                 if (typeof value === 'number') {