🔧 Trying out some refactoring on socket connection to Import service

src/client/components/Navbar.tsx

@@ -2,13 +2,12 @@ import React from "react";
 import { Link } from "react-router-dom";
 
 const Navbar: React.FunctionComponent = (props) => {
-
   return (
     <nav className="navbar is-fixed-top">
       <div className="navbar-brand">
         <a className="navbar-item" href="http://bulma.io">
           <img
-            src="threetwo.png"
+            src="public/threetwo.png"
             alt="ThreeTwo! A comic book curator"
             width="112"
             height="28"

src/client/constants/endpoints.ts

@@ -39,6 +39,6 @@ export const IMPORT_SERVICE_BASE_URI = hostURIBuilder({
 export const SOCKET_BASE_URI = hostURIBuilder({
   protocol: "ws",
   host: process.env.DOCKER_HOST || "localhost",
-  port: "8051",
+  port: "3001",
   apiPath: ``,
 });

src/client/context/socket/socket.context.tsx

@@ -9,8 +9,8 @@ const WebSocketContext = createContext(null);
 export const WebSocketProvider = ({ children }): ReactElement => {
   const dispatch = useDispatch();
   const socket: Socket = io(SOCKET_BASE_URI);
-
   socket.on("connect", () => {
+    console.log("connected");
     dispatch({
       type: RMQ_SOCKET_CONNECTED,
       isSocketConnected: true,
@@ -35,6 +35,7 @@ export const WebSocketProvider = ({ children }): ReactElement => {
     console.log(`disconnect`);
   });
 
+  socket.emit("bastard", { name: "puk" });
   const ws: any = {
     socket,
   };

src/server/index.ts

@@ -1,7 +1,7 @@
 import express, { Request, Response, Router, Express } from "express";
 import bodyParser from "body-parser";
 import { createServer } from "http";
-import { Server } from "socket.io";
+
 import router from "./route";
 import cors from "cors";
 const amqp = require("amqplib/callback_api");
@@ -10,14 +10,6 @@ const amqp = require("amqplib/callback_api");
 const app: Express = express(); // define our app using express
 app.use(cors({ origin: "*" }));
 
-const httpServer = createServer();
-export const io = new Server(httpServer, {
-  cors: {
-    origin: "*",
-    methods: ["GET", "POST"],
-  },
-});
-
 // configure app to use bodyParser for
 // Getting data from body of requests
 app.use(bodyParser.json());
@@ -29,10 +21,6 @@ const port: number = Number(process.env.PORT) || 8050; // set our port
 const rabbitMQConnectionString =
   process.env.RABBITMQ_URI || "amqp://localhost:5672";
 
-// Send index.html on root request
-app.use(express.static("dist"));
-app.use(express.static("public"));
-
 app.get("/", (req: Request, res: Response) => {
   console.log("sending index.html");
   res.sendFile("/dist/index.html");
@@ -43,17 +31,12 @@ app.get("/", (req: Request, res: Response) => {
 const routes: Router[] = Object.values(router);
 app.use("/api", routes);
 
+// Send index.html on root request
+app.use(express.static("dist"));
+app.use(express.static("public"));
+
 app.listen(port);
 
-io.on("connection", (socket) => {
-  console.log("Socket connected");
-
-  //Whenever someone disconnects this piece of code executed
-  socket.on("disconnect", () => {
-    console.log("Socket disconnected");
-  });
-});
-
 amqp.connect(`${rabbitMQConnectionString}`, (error0, connection) => {
   if (error0) {
     throw error0;
@@ -74,7 +57,7 @@ amqp.connect(`${rabbitMQConnectionString}`, (error0, connection) => {
       queue,
       (data) => {
         //Socket Trigger All Clients
-        io.sockets.emit("coverExtracted", JSON.parse(data.content.toString()));
+        // io.sockets.emit("coverExtracted", JSON.parse(data.content.toString()));
       },
       {
         noAck: true,
@@ -83,7 +66,4 @@ amqp.connect(`${rabbitMQConnectionString}`, (error0, connection) => {
   });
 });
 
-// socket server
-httpServer.listen(8051);
-console.log(`Socket server is listening on 8051`);
 console.log(`Server is listening on ${port}`);

src/server/route/routes/importComics.routes.ts

@@ -1,20 +1,44 @@
 import router from "../router";
 import { Request, Response } from "express";
-import axios from "axios";
+import axios, { AxiosPromise } from "axios";
 
 router.route("/getComicCovers").post(async (req: Request, res: Response) => {
   typeof req.body === "object" ? req.body : {};
   const importServiceURI = process.env.DOCKER_HOST
     ? `http://${process.env.DOCKER_HOST}:3000/api/import`
     : "http://localhost:3000/api/import";
-  await axios.request({
-    url: `${importServiceURI}/processAndImportToDB`,
-    method: "POST",
-    data: {
-      extractionOptions: req.body.extractionOptions,
-      walkedFolders: req.body.walkedFolders,
-    },
-  });
+
+  const axiosArray: AxiosPromise[] = [];
+  for (let x = 0; x < req.body.walkedFolders.length; x++) {
+    const newPromise = axios({
+      method: "POST",
+      url: `${importServiceURI}/processAndImportToDB`,
+      data: {
+        extractionOptions: req.body.extractionOptions,
+        walkedFolders: req.body.walkedFolders[x],
+      },
+    });
+    axiosArray.push(newPromise);
+  }
+
+  axios
+    .all(axiosArray)
+    .then(
+      axios.spread((...responses) => {
+        responses.forEach((res) => console.log("Success"));
+        console.log("submitted all axios calls");
+      }),
+    )
+    .catch((error) => {});
+
+  // await axios.request({
+  //   url: `${importServiceURI}/processAndImportToDB`,
+  //   method: "POST",
+  //   data: {
+  //     extractionOptions: req.body.extractionOptions,
+  //     walkedFolders: req.body.walkedFolders,
+  //   },
+  // });
   res.send({ message: "Scan and import initiated." });
 });