1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
import React from "react";
import io from "socket.io-client";
import { connect as reduxConnect } from "react-redux";
import { setNodes, updateCheckboxes } from "./redux/nodes";
import { setCounts } from "./redux/counts";
import { setNodeInfos } from "./redux/nodeInfo";
import { setGraphFiles, selectGraphFile } from "./redux/graphFiles";
import { setLoading } from "./redux/loading";
import { addLinks } from "./redux/links";
import { setGraphData } from "./redux/graphData";
import { selectedGraphPaths } from "./redux/graphPaths";
const { REACT_APP_API_URL } = process.env;
export const socket = io.connect(REACT_APP_API_URL, {
reconnection: true,
transports: ["websocket"],
});
const SocketConnection = ({
setNodes,
updateCheckboxes,
setCounts,
setGraphFiles,
setLoading,
selectGraphFile,
addLinks,
setGraphData,
setNodeInfos,
selectedGraphPaths,
}) => {
React.useEffect(() => {
fetch(REACT_APP_API_URL + "/graph_files")
.then((res) => res.json())
.then((data) => {
setGraphFiles(data.graph_files);
})
.catch((err) => {
/* eslint-disable no-console */
console.log("Error Reading data " + err);
});
socket.on("other_hash_selected", (incomingData) => {
selectGraphFile({
hash: incomingData.hash,
selected: incomingData.selected,
});
});
socket.on("graph_nodes", (incomingData) => {
setLoading(false);
setNodes(
incomingData.graphData.nodes.map((node, index) => {
return {
id: index,
node: node.id,
name: node.name,
check: "checkbox",
selected: false,
};
})
);
addLinks(incomingData.graphData.links);
});
socket.on("graph_data", (incomingData) => {
if (incomingData.graphData) {
setGraphData(incomingData.graphData);
}
if (incomingData.selectedNodes) {
updateCheckboxes(
incomingData.selectedNodes.map((node, index) => {
return { node: node, value: true };
})
);
}
});
socket.on("graph_results", (incomingData) => {
setCounts(incomingData);
});
socket.on("node_infos", (incomingData) => {
setNodeInfos(incomingData.nodeInfos);
});
socket.on("graph_path_results", (incomingData) => {
selectedGraphPaths(incomingData);
});
}, []);
return null;
};
export default reduxConnect(null, {
setNodes,
updateCheckboxes,
setCounts,
setNodeInfos,
setGraphFiles,
setLoading,
selectGraphFile,
addLinks,
setGraphData,
selectedGraphPaths,
})(SocketConnection);
|
