Change MqttClient without restart, use secureClient for port >8800

interface/src/framework/mqtt/MqttSettingsForm.tsx

@@ -1,17 +1,12 @@
 import CancelIcon from '@mui/icons-material/Cancel';
-import PowerSettingsNewIcon from '@mui/icons-material/PowerSettingsNew';
 import WarningIcon from '@mui/icons-material/Warning';
 import { Button, Checkbox, MenuItem, Grid, Typography, InputAdornment, TextField } from '@mui/material';
-import { useRequest } from 'alova';
 import { useState } from 'react';
-import { toast } from 'react-toastify';
-import RestartMonitor from '../system/RestartMonitor';
 import type { ValidateFieldsError } from 'async-validator';
 import type { FC } from 'react';
 
 import type { MqttSettings } from 'types';
 import * as MqttApi from 'api/mqtt';
-import * as SystemApi from 'api/system';
 import {
   BlockFormControlLabel,
   ButtonRow,
@@ -19,7 +14,6 @@ import {
   SectionContent,
   ValidatedPasswordField,
   ValidatedTextField,
-  MessageBox,
   BlockNavigation
 } from 'components';
 import { useI18nContext } from 'i18n/i18n-react';
@@ -38,21 +32,15 @@ const MqttSettingsForm: FC = () => {
     setDirtyFlags,
     blocker,
     saveData,
-    errorMessage,
-    restartNeeded
+    errorMessage
   } = useRest<MqttSettings>({
     read: MqttApi.readMqttSettings,
     update: MqttApi.updateMqttSettings
   });
 
-  const { send: restartCommand } = useRequest(SystemApi.restart(), {
-    immediate: false
-  });
-
   const { LL } = useI18nContext();
 
   const [fieldErrors, setFieldErrors] = useState<ValidateFieldsError>();
-  const [restarting, setRestarting] = useState(false);
 
   const updateFormValue = updateValueDirty(origData, dirtyFlags, setDirtyFlags, updateDataValue);
 
@@ -71,13 +59,6 @@ const MqttSettingsForm: FC = () => {
       }
     };
 
-    const restart = async () => {
-      await restartCommand().catch((error) => {
-        toast.error(error.message);
-      });
-      setRestarting(true);
-    };
-
     return (
       <>
         <BlockFormControlLabel
@@ -432,15 +413,7 @@ const MqttSettingsForm: FC = () => {
           </Grid>
         </Grid>
 
-        {restartNeeded && (
-          <MessageBox my={2} level="warning" message={LL.RESTART_TEXT()}>
-            <Button startIcon={<PowerSettingsNewIcon />} variant="contained" color="error" onClick={restart}>
-              {LL.RESTART()}
-            </Button>
-          </MessageBox>
-        )}
-
-        {!restartNeeded && dirtyFlags && dirtyFlags.length !== 0 && (
+        {dirtyFlags && dirtyFlags.length !== 0 && (
           <ButtonRow>
             <Button
               startIcon={<CancelIcon />}
@@ -471,7 +444,7 @@ const MqttSettingsForm: FC = () => {
   return (
     <SectionContent title={LL.SETTINGS_OF('MQTT')} titleGutter>
       {blocker ? <BlockNavigation blocker={blocker} /> : null}
-      {restarting ? <RestartMonitor /> : content()}
+      {content()}
     </SectionContent>
   );
 };