From 41ca114c886797c557c705ef90cc1b7491d16d4e Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Sun, 29 Mar 2020 15:09:29 -0700 Subject: Move more components to hooks --- modern/src/SocketController.js | 27 ++++++++++++++------------- 1 file changed, 14 insertions(+), 13 deletions(-) (limited to 'modern/src/SocketController.js') diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js index bacac51..f915c99 100644 --- a/modern/src/SocketController.js +++ b/modern/src/SocketController.js @@ -1,4 +1,5 @@ -import { Component } from 'react'; +import { useEffect } from 'react'; +import { useDispatch } from 'react-redux'; import { connect } from 'react-redux'; import { positionsActions, devicesActions } from './store'; @@ -19,8 +20,10 @@ const displayNotifications = events => { } }; -class SocketController extends Component { - connectSocket() { +const SocketController = (props) => { + const dispatch = useDispatch(); + + const connectSocket = () => { const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'; const socket = new WebSocket(protocol + '//' + window.location.host + '/api/socket'); @@ -31,31 +34,29 @@ class SocketController extends Component { socket.onmessage = (event) => { const data = JSON.parse(event.data); if (data.devices) { - this.props.dispatch(devicesActions.update(data.devices)); + props.dispatch(devicesActions.update(data.devices)); } if (data.positions) { - this.props.dispatch(positionsActions.update(data.positions)); + props.dispatch(positionsActions.update(data.positions)); } if (data.events) { displayNotifications(data.events); } - } + }; } - componentDidMount() { + useEffect(() => { fetch('/api/devices').then(response => { if (response.ok) { response.json().then(devices => { - this.props.dispatch(devicesActions.update(devices)); + dispatch(devicesActions.update(devices)); }); } - this.connectSocket(); + connectSocket(); }); - } + }, []); - render() { - return null; - } + return null; } export default connect()(SocketController); -- cgit v1.2.3