🔧 Fix for save/delete functionality on AirDCPP settings form

src/client/components/AirDCPPSettings/AirDCPPSettingsForm.tsx

@@ -1,10 +1,10 @@
-import React, { ReactElement, useCallback, useContext, useEffect } from "react";
+import React, { ReactElement, useCallback, useContext } from "react";
 import { Form, Field } from "react-final-form";
 import { useDispatch } from "react-redux";
 import { saveSettings, deleteSettings } from "../../actions/settings.actions";
 import { AirDCPPSettingsConfirmation } from "./AirDCPPSettingsConfirmation";
 import { AirDCPPSocketContext } from "../../context/AirDCPPSocket";
-import { isUndefined, isEmpty, isNil } from "lodash";
+import { isUndefined, isEmpty } from "lodash";
 
 export const AirDCPPSettingsForm = (): ReactElement => {
   const dispatch = useDispatch();
@@ -22,14 +22,14 @@ export const AirDCPPSettingsForm = (): ReactElement => {
     }
   }, []);
   const removeSettings = useCallback(async () => {
+    airDCPPSettings.setSettings({});
     dispatch(deleteSettings());
   }, []);
   const validate = async () => {};
-
-  // const initFormData = !isUndefined(airDCPPSettings)
-  //   ? airDCPPSettings.airDCPPState.settings.directConnect.client.host
-  //   : {};
-  const initFormData = {};
+  console.log(airDCPPSettings.airDCPPState);
+  const initFormData = !isUndefined(airDCPPSettings.airDCPPState.settings.directConnect)
+    ? airDCPPSettings.airDCPPState.settings.directConnect.client.host
+    : {};
 
   return (
     <>
@@ -107,20 +107,19 @@ export const AirDCPPSettingsForm = (): ReactElement => {
           </form>
         )}
       />
-      {!isUndefined(airDCPPSettings.airDCPPState.socketConnectionInformation) ? (
+      {!isEmpty(airDCPPSettings.airDCPPState.socketConnectionInformation) ? (
         <AirDCPPSettingsConfirmation
           settings={airDCPPSettings.airDCPPState.socketConnectionInformation}
         />
       ) : null}
 
-      {/* {!isUndefined(settings) &&
-      !isEmpty(settings.directConnect.client.airDCPPUserSettings) ? (
+      {!isEmpty(airDCPPSettings.airDCPPState.socketConnectionInformation) ? (
         <p className="control mt-4">
           <button className="button is-danger" onClick={removeSettings}>
             Delete
           </button>
         </p>
-      ) : null} */}
+      ) : null}
     </>
   );
 };

src/client/components/App.tsx

@@ -1,5 +1,4 @@
-import React, { ReactElement, useContext, useEffect, useState } from "react";
-import { useDispatch, useSelector } from "react-redux";
+import React, { ReactElement, useContext, useEffect } from "react";
 import Dashboard from "./Dashboard/Dashboard";
 
 import Import from "./Import";
@@ -21,7 +20,7 @@ import {
   AirDCPPSocketContextProvider,
   AirDCPPSocketContext,
 } from "../context/AirDCPPSocket";
-import { isEmpty, isNil, isUndefined } from "lodash";
+import { isEmpty, isUndefined } from "lodash";
 
 const AirDCPPSocketComponent = (): ReactElement => {
   const airDCPPConfiguration = useContext(AirDCPPSocketContext);
@@ -33,7 +32,7 @@ const AirDCPPSocketComponent = (): ReactElement => {
         !isUndefined(airDCPPConfiguration.airDCPPState) &&
         !isEmpty(airDCPPConfiguration.airDCPPState.settings)
       ) {
-        await AirDCPPSocket.addListener(
+        await airDCPPConfiguration.airDCPPState.socket.addListener(
           "queue",
           "queue_bundle_added",
           async (data) => console.log("JEMEN:", data),
@@ -44,7 +43,7 @@ const AirDCPPSocketComponent = (): ReactElement => {
       }
     };
     foo();
-  }, []);
+  }, [airDCPPConfiguration]);
   return <></>;
 };
 export const App = (): ReactElement => {

src/client/context/AirDCPPSocket.tsx

@@ -1,5 +1,5 @@
-import { isEmpty, isUndefined } from "lodash";
-import React, { createContext, useEffect, useMemo, useState } from "react";
+import { isEmpty } from "lodash";
+import React, { createContext, useEffect, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { getSettings } from "../actions/settings.actions";
 import AirDCPPSocket from "../services/DcppSearchService";