diff --git a/package.json b/package.json index 2290184..b1a3910 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "@types/socket.io-client": "^3.0.0", "@types/through2": "^2.0.36", "airdcpp-apisocket": "^2.4.4", + "amqplib": "^0.8.0", "array-sort-by": "^1.2.1", "babel-polyfill": "^6.26.0", "better-docs": "^2.3.2", @@ -55,6 +56,7 @@ "react-dom": "^17.0.1", "react-fast-compare": "^3.2.0", "react-final-form": "^6.5.3", + "react-hot-toast": "^2.1.1", "react-loader-spinner": "^4.0.0", "react-select": "^4.3.1", "react-sliding-pane": "^7.0.0", diff --git a/src/client/actions/fileops.actions.tsx b/src/client/actions/fileops.actions.tsx index f9581ea..3d54c67 100644 --- a/src/client/actions/fileops.actions.tsx +++ b/src/client/actions/fileops.actions.tsx @@ -1,7 +1,6 @@ import axios from "axios"; import { IFolderData, IExtractedComicBookCoverFile } from "threetwo-ui-typings"; import { API_BASE_URI, SOCKET_BASE_URI } from "../constants/endpoints"; -import { io } from "socket.io-client"; import { IMS_COMICBOOK_METADATA_FETCHED, IMS_SOCKET_CONNECTION_CONNECTED, @@ -12,9 +11,11 @@ import { IMS_CV_METADATA_IMPORT_CALL_IN_PROGRESS, IMS_CV_METADATA_IMPORT_SUCCESSFUL, IMS_CV_METADATA_IMPORT_FAILED, + RMQ_SOCKET_CONNECTED, } from "../constants/action-types"; import { refineQuery } from "../shared/utils/filenameparser.utils"; import sortBy from "array-sort-by"; +import { io } from "socket.io-client"; export async function walkFolder(path: string): Promise> { return axios @@ -43,6 +44,22 @@ export async function walkFolder(path: string): Promise> { * @return {Promise} HTML of the page */ export const fetchComicBookMetadata = (options) => async (dispatch) => { + const socket = io(SOCKET_BASE_URI, { + reconnectionDelayMax: 10000, + secure: false, + rejectUnauthorized: false, + }); + socket.on("connect", () => { + console.log(`connect ${socket.id}`); + dispatch({ + type: RMQ_SOCKET_CONNECTED, + isSocketConnected: true, + socketId: socket.id, + }); + }); + socket.on("disconnect", () => { + console.log(`disconnect`); + }); const extractionOptions = { sourceFolder: options, extractTarget: "cover", @@ -55,37 +72,20 @@ export const fetchComicBookMetadata = (options) => async (dispatch) => { }; const walkedFolders = await walkFolder("./comics"); - const socket = io(SOCKET_BASE_URI, { - reconnectionDelayMax: 10000, - }); - - socket.on("connect", () => { - console.log(`connect ${socket.id}`); - dispatch({ - type: IMS_SOCKET_CONNECTION_CONNECTED, - socketConnected: true, + await axios + .request({ + url: "http://localhost:8050/api/getComicCovers", + method: "POST", + data: { + extractionOptions, + walkedFolders, + }, + }) + .then((response) => { + console.log("Response from import call", response); }); - }); - socket.on("disconnect", () => { - console.log(`disconnect`); - }); - socket.emit("importComicsToDB", { - action: "getComicCovers", - params: { - extractionOptions, - walkedFolders, - }, - }); - - socket.on("comicBookCoverMetadata", (data: IExtractedComicBookCoverFile) => { - dispatch({ - type: IMS_COMICBOOK_METADATA_FETCHED, - data, - dataTransferred: true, - }); - }); - socket.on("comicBookExists", (data) => { + socket.on("coverExtracted", (data) => { console.log(data); }); }; diff --git a/src/client/components/Import.tsx b/src/client/components/Import.tsx index a569704..ec92773 100644 --- a/src/client/components/Import.tsx +++ b/src/client/components/Import.tsx @@ -3,9 +3,8 @@ import { isUndefined } from "lodash"; import { connect } from "react-redux"; import { fetchComicBookMetadata } from "../actions/fileops.actions"; import { IFolderData } from "threetwo-ui-typings"; -import { io, Socket } from "socket.io-client"; -import { SOCKET_BASE_URI } from "../constants/endpoints"; import DynamicList, { createCache } from "react-window-dynamic-list"; +import toast, { Toaster } from "react-hot-toast"; interface IProps { matches: unknown; @@ -18,7 +17,6 @@ interface IState { searchPaneIndex: number; fileOps: any; } -let socket: Socket; class Import extends React.Component { /** * Returns the average of two numbers. @@ -47,16 +45,17 @@ class Import extends React.Component { }); } - public initiateSocketConnection = () => { + public initiateImport = () => { if (typeof this.props.path !== "undefined") { - socket = io(SOCKET_BASE_URI, { - reconnectionDelayMax: 10000, - }); - - socket.on("connect", () => { - console.log(`connect ${socket.id}`); - }); this.props.fetchComicMetadata(); + toast.custom( +
+
Saokaaate
+
, + { + position: "top-right", + }, + ); } }; @@ -113,11 +112,9 @@ class Import extends React.Component {

+

-

- {!isUndefined(this.state.folderWalkResults) ? ( -
- - {this.renderRow} - -
- ) : null} + {!isUndefined(this.state.folderWalkResults) ?
: null} ); @@ -154,7 +140,7 @@ function mapStateToProps(state: IState) { console.log("state", state); return { // matches: state.comicInfo.searchResults, - covers: state.fileOps.comicBookMetadata, + // covers: state.fileOps.comicBookMetadata, }; } @@ -165,4 +151,3 @@ const mapDispatchToProps = (dispatch, ownProps) => ({ }); export default connect(mapStateToProps, mapDispatchToProps)(Import); -export { socket }; diff --git a/src/client/components/Navbar.tsx b/src/client/components/Navbar.tsx index 9049bd5..a5dd7ce 100644 --- a/src/client/components/Navbar.tsx +++ b/src/client/components/Navbar.tsx @@ -1,10 +1,7 @@ import React from "react"; -import { useSelector } from "react-redux"; import { Link } from "react-router-dom"; -import { RootState } from "threetwo-ui-typings"; const Navbar: React.FunctionComponent = (props) => { - const socketConnection = useSelector((state: RootState) => state.fileOps); return (