🔧 Various AirDCPPSocketContext-related fixes

src/client/components/App.tsx

@@ -17,65 +17,18 @@ import Downloads from "./Downloads/Downloads";
 import { Routes, Route } from "react-router-dom";
 import Navbar from "./Navbar";
 import "../assets/scss/App.scss";
-import Notifications from "react-notification-system-redux";
 import {
   AirDCPPSocketContextProvider,
   AirDCPPSocketContext,
 } from "../context/AirDCPPSocket";
-import { isNil } from "lodash";
-
-//Optional styling
-const style = {
-  Containers: {
-    DefaultStyle: {
-      fontFamily: "inherit",
-      position: "fixed",
-      padding: "0 10px 10px 10px",
-      zIndex: 9998,
-      WebkitBoxSizing: "border-box",
-      MozBoxSizing: "border-box",
-      boxSizing: "border-box",
-      height: "auto",
-    },
-    tr: {
-      top: "40px",
-      right: "10px",
-    },
-  },
-  Title: {
-    DefaultStyle: {
-      fontSize: "14px",
-      margin: "0 0 5px 0",
-      padding: 0,
-      fontWeight: "bold",
-    },
-
-    success: {
-      color: "hsl(141, 71%, 48%)",
-    },
-  },
-  NotificationItem: {
-    // Override the notification item
-    success: {
-      // Applied to every notification, regardless of the notification level
-      borderTop: "none",
-      backgroundColor: "#FFF",
-      borderRadius: "0.4rem",
-      WebkitBoxShadow: "-7px 11px 25px -9px rgba(0, 0, 0, 0.3)",
-      MozBoxShadow: "-7px 11px 25px -9px rgba(0, 0, 0, 0.3)",
-      boxShadow: "-7px 11px 25px -9px rgba(0, 0, 0, 0.3)",
-    },
-  },
-};
-
-export const App = (): ReactElement => {
-  const notifications = useSelector((state: RootState) => state.notifications);
+import { isEmpty, isNil, isUndefined } from "lodash";
 
+const AirDCPPSocketComponent = (): ReactElement => {
   const airDCPPConfiguration = useContext(AirDCPPSocketContext);
-  const { AirDCPPSocket } = airDCPPConfiguration;
+  const { AirDCPPSocket, settings } = airDCPPConfiguration;
   useEffect(() => {
-    const addQueueListener = async () => {
-      if (!isNil(AirDCPPSocket)) {
+    const foo = async () => {
+      if (!isUndefined(AirDCPPSocket)) {
         await AirDCPPSocket.addListener(
           "queue",
           "queue_bundle_added",
@@ -86,18 +39,16 @@ export const App = (): ReactElement => {
         );
       }
     };
-    addQueueListener();
-  }, [AirDCPPSocket]);
+    foo();
+  }, [settings]);
+  return <></>;
+};
+export const App = (): ReactElement => {
   return (
     <AirDCPPSocketContextProvider>
       <div>
+        <AirDCPPSocketComponent />
         <Navbar />
-        <Notifications
-          notifications={notifications}
-          style={style}
-          newOnTop={true}
-          allowHTML={true}
-        />
         <Routes>
           <Route path="/" element={<Dashboard />} />
           <Route path="/import" element={<Import path={"./comics"} />} />