🔌 AirDCPP socket refactoring

src/client/components/AcquisitionPanel.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, ReactElement } from "react";
+import React, { useCallback, useEffect, useState, ReactElement } from "react";
 import {
   search,
   downloadAirDCPPItem,
@@ -7,8 +7,9 @@ import {
 import { useDispatch, useSelector } from "react-redux";
 import { RootState, SearchInstance } from "threetwo-ui-typings";
 import ellipsize from "ellipsize";
-import { isEmpty, isNil, map } from "lodash";
-
+import { isEmpty, isNil, isUndefined, map } from "lodash";
+import { getSettings } from "../actions/settings.actions";
+import AirDCPPSocket from "../services/DcppSearchService";
 interface IAcquisitionPanelProps {
   comicBookMetadata: any;
 }
@@ -20,6 +21,10 @@ export const AcquisitionPanel = (
     props.comicBookMetadata.sourcedMetadata.comicvine.volumeInformation.name;
   const sanitizedVolumeName = volumeName.replace(/[^a-zA-Z0-9 ]/g, "");
   const issueName = props.comicBookMetadata.sourcedMetadata.comicvine.name;
+
+  // local state
+  const [ADCPPSocket, setADCPPSocket] = useState({});
+  // Selectors for picking state
   const airDCPPSearchResults = useSelector((state: RootState) => {
     return state.airdcpp.searchResults;
   });
@@ -32,8 +37,22 @@ export const AcquisitionPanel = (
   const searchInstance: SearchInstance = useSelector(
     (state: RootState) => state.airdcpp.searchInstance,
   );
+  const airDCPPClientSettings = useSelector(
+    (state: RootState) => state.settings.data,
+  );
 
   const dispatch = useDispatch();
+  useEffect(() => {
+    dispatch(getSettings());
+    if (!isUndefined(airDCPPClientSettings[0])) {
+      const dcppSocket = new AirDCPPSocket({
+        hostname: `${airDCPPClientSettings[0].directConnect.client.hostname}`,
+      });
+      setADCPPSocket(dcppSocket);
+    }
+  }, [dispatch, airDCPPClientSettings.length]);
+
+  console.log(ADCPPSocket);
   const getDCPPSearchResults = useCallback(
     (searchQuery) => {
       dispatch(search(searchQuery));

src/client/components/AirDCPPSettingsForm.tsx

@@ -51,7 +51,9 @@ export const AirDCPPSettingsForm = (): ReactElement => {
               <p className="control">
                 <span className="select">
                   <Field name="protocol" component="select">
-                    <option value="http://">http://</option>
+                    <option value="http://" defaultValue={"http://"}>
+                      http://
+                    </option>
                     <option value="https://">https://</option>
                   </Field>
                 </span>

src/client/constants/settings/settingsMenu.json

@@ -54,5 +54,20 @@
         "displayName": "Options"
       }
     ]
+  },
+  {
+    "id": 4,
+    "category": "acknowledgments",
+    "displayName": "Acknowledgments",
+    "children": [
+      {
+        "id": "testers",
+        "displayName": "Testers"
+      },
+      {
+        "id": "software",
+        "displayName": "Software"
+      }
+    ]
   }
 ]

src/client/services/DcppSearchService.ts

@@ -1,19 +1,20 @@
 import { Socket } from "airdcpp-apisocket";
 
-const options = {
-  url: "wss://sab.rishighan.com/api/v1/",
-  autoReconnect: false,
-  reconnectInterval: 5,
-  logLevel: "verbose",
-  ignoredListenerEvents: [
-    "transfer_statistics",
-    "hash_statistics",
-    "hub_counts_updated",
-  ],
-};
-
-const APISocket = Socket(options, window.WebSocket as any);
-type SocketType = typeof APISocket;
-export { SocketType as APISocket };
-
-export default APISocket;
+class AirDCPPSocket {
+  constructor(configuration) {
+    const options = {
+      url: `wss://${configuration.hostname}/api/v1/`,
+      autoReconnect: false,
+      reconnectInterval: 5,
+      logLevel: "verbose",
+      ignoredListenerEvents: [
+        "transfer_statistics",
+        "hash_statistics",
+        "hub_counts_updated",
+      ],
+    };
+    const AirDCPPSocketInstance = Socket(options, window.WebSocket as any);
+    return AirDCPPSocketInstance;
+  }
+}
+export default AirDCPPSocket;