diff --git a/src/App.js b/src/App.js
index 4f9c3ef..1d5f2a2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,15 @@
import React from "react";
import { Grommet } from "grommet";
import Core from "./Core";
+import WebSocketProvider from "./WebSocket";
function App() {
return (
-
-
-
+
+
+
+
+
);
}
diff --git a/src/Core.js b/src/Core.js
index b0a5ba5..e957457 100644
--- a/src/Core.js
+++ b/src/Core.js
@@ -7,7 +7,6 @@ import * as plugins from "./plugins";
function Core() {
const coreState = useSelector(selectCore);
const dispatch = useDispatch();
- console.log(plugins.default);
const plugin = plugins.default[coreState.plugin];
const props = {
data: coreState.data,
@@ -27,10 +26,7 @@ function Core() {
}
>
}
- {plugin ?
- React.cloneElement(plugin(), props)
- :null
- }
+ {plugin ? plugin(props) :null}
>;
}
diff --git a/src/WebSocket.js b/src/WebSocket.js
new file mode 100644
index 0000000..cc4550a
--- /dev/null
+++ b/src/WebSocket.js
@@ -0,0 +1,42 @@
+import React, { createContext } from "react";
+import PropTypes from "prop-types";
+import io from "socket.io-client";
+import { WS_BASE } from "./config";
+import { useDispatch } from "react-redux";
+import { setData, setPlugin } from "./coreSlice";
+
+const WebSocketContext = createContext(null);
+
+export { WebSocketContext };
+
+function WebSocketProvider({ children }) {
+ let socket;
+
+ const dispatch = useDispatch();
+ if (!socket) {
+ socket = io.connect(WS_BASE);
+
+ socket.on("switchPlugin", (payload) => {
+ dispatch(setPlugin(payload.plugin));
+ dispatch(setData(payload.data));
+ if (payload.time) {
+ setTimeout(() => {
+ dispatch(setData({}));
+ dispatch(setPlugin(false));
+ }, payload.time);
+ }
+ });
+ }
+
+ return (
+
+ {children}
+
+ );
+}
+
+WebSocketProvider.propTypes = {
+ children: PropTypes.node
+};
+
+export default WebSocketProvider;