.eslintrc.js

@@ -34,8 +34,7 @@ module.exports = {
 		"semi": [
 			"error",
 			"always"
-		],
+		]
-		"no-unused-vars": [1]
 	},
 	"settings": {
 		"react": {

src/Core.js

@@ -3,19 +3,19 @@ import { useSelector, useDispatch } from "react-redux";
 import { Box, Button, Clock } from "grommet";
 
 import { setPlugin, selectCore } from "./coreSlice";
-import plugins from "./plugins";
+import * as plugins from "./plugins";
 
 function Core() {
 	const coreState = useSelector(selectCore);
 	const dispatch = useDispatch();
-	const plugin = plugins[coreState.plugin];
+	const plugin = plugins.default[coreState.plugin];
 	const props = {
 		data: coreState.data,
 		close: () => dispatch(setPlugin(false))
 	};
 	const dummyButtons = ["Maps", "Home Devices", "Phone"];
 	return <>
-		{plugin ? React.createElement(plugin, props, null) : (
+		{plugin ? plugin(props) : (
 			<Box
 				align="center"
 				background="light-1"

src/WebSocket.js

@@ -17,8 +17,8 @@ function WebSocketProvider({ children }) {
 		socket = io.connect(WS_BASE);
 
 		socket.on("switchPlugin", (payload) => {
-			dispatch(setData(payload.data || {}));
 			dispatch(setPlugin(payload.plugin));
+			dispatch(setData(payload.data));
 			if (payload.time) {
 				setTimeout(() => {
 					dispatch(setData({}));