1.3.x updates

src/components/layout/Sidebar/Settings/modules/MQTT.tsx

@@ -11,57 +11,65 @@ import { useAppSelector } from '@hooks/useAppSelector';
 import type { Protobuf } from '@meshtastic/meshtasticjs';
 
 export const MQTT = (): JSX.Element => {
-  const preferences = useAppSelector(
-    (state) => state.meshtastic.radio.preferences,
+  const mqttConfig = useAppSelector(
+    (state) => state.meshtastic.radio.moduleConfig.mqtt,
   );
   const [loading, setLoading] = useState(false);
   const { register, handleSubmit, formState, reset, control } =
-    useForm<Protobuf.RadioConfig_UserPreferences>({
-      defaultValues: preferences,
+    useForm<Protobuf.ModuleConfig_MQTTConfig>({
+      defaultValues: mqttConfig,
     });
 
   const moduleEnabled = useWatch({
     control,
-    name: 'mqttDisabled',
+    name: 'disabled',
     defaultValue: false,
   });
 
   useEffect(() => {
-    reset(preferences);
-  }, [reset, preferences]);
+    reset(mqttConfig);
+  }, [reset, mqttConfig]);
 
   const onSubmit = handleSubmit((data) => {
     setLoading(true);
-    void connection.setPreferences(data, async () => {
-      reset({ ...data });
-      setLoading(false);
-      await Promise.resolve();
-    });
+    void connection.setModuleConfig(
+      {
+        payloadVariant: {
+          oneofKind: 'mqtt',
+          mqtt: data,
+        },
+      },
+      async () => {
+        reset({ ...data });
+        setLoading(false);
+        await Promise.resolve();
+      },
+    );
   });
   return (
     <Form loading={loading} dirty={!formState.isDirty} submit={onSubmit}>
-      <Checkbox label="Module Disabled" {...register('mqttDisabled')} />
+      <Checkbox label="Module Disabled" {...register('disabled')} />
       <Input
         label="MQTT Server Address"
         disabled={moduleEnabled}
-        {...register('mqttServer')}
+        {...register('address')}
       />
       <Input
         label="MQTT Username"
         disabled={moduleEnabled}
-        {...register('mqttUsername')}
+        {...register('username')}
       />
       <Input
         label="MQTT Password"
         type="password"
         autoComplete="off"
         disabled={moduleEnabled}
-        {...register('mqttPassword')}
+        {...register('password')}
       />
       <Checkbox
         label="Encryption Enabled"
         disabled={moduleEnabled}
-        {...register('mqttEncryptionEnabled')}
+        {...register('encryptionEnabled')}
       />
     </Form>
   );