diff --git a/lib/socket/update-handler.react.js b/lib/socket/update-handler.react.js
index 14cc398a1..8cb4cf2cb 100644
--- a/lib/socket/update-handler.react.js
+++ b/lib/socket/update-handler.react.js
@@ -1,73 +1,56 @@
 // @flow
 
-import PropTypes from 'prop-types';
 import * as React from 'react';
+import { useEffect } from 'react';
+import { useDispatch } from 'react-redux';
 
-import type { AppState } from '../types/redux-types';
 import {
   type ClientSocketMessageWithoutID,
   type SocketListener,
-  type ConnectionInfo,
-  connectionInfoPropType,
   type ServerSocketMessage,
   serverSocketMessageTypes,
   clientSocketMessageTypes,
 } from '../types/socket-types';
 import { processUpdatesActionType } from '../types/update-types';
-import type { DispatchActionPayload } from '../utils/action-utils';
-import { connect } from '../utils/redux-utils';
+import { useSelector } from '../utils/redux-utils';
 
 type Props = {|
-  sendMessage: (message: ClientSocketMessageWithoutID) => number,
-  addListener: (listener: SocketListener) => void,
-  removeListener: (listener: SocketListener) => void,
-  // Redux state
-  connection: ConnectionInfo,
-  // Redux dispatch functions
-  dispatchActionPayload: DispatchActionPayload,
+  +sendMessage: (message: ClientSocketMessageWithoutID) => number,
+  +addListener: (listener: SocketListener) => void,
+  +removeListener: (listener: SocketListener) => void,
 |};
-class UpdateHandler extends React.PureComponent<Props> {
-  static propTypes = {
-    sendMessage: PropTypes.func.isRequired,
-    addListener: PropTypes.func.isRequired,
-    removeListener: PropTypes.func.isRequired,
-    connection: connectionInfoPropType.isRequired,
-    dispatchActionPayload: PropTypes.func.isRequired,
-  };
-
-  componentDidMount() {
-    this.props.addListener(this.onMessage);
-  }
-
-  componentWillUnmount() {
-    this.props.removeListener(this.onMessage);
-  }
-
-  render() {
-    return null;
-  }
-
-  onMessage = (message: ServerSocketMessage) => {
-    if (message.type !== serverSocketMessageTypes.UPDATES) {
-      return;
-    }
-    this.props.dispatchActionPayload(processUpdatesActionType, message.payload);
-    if (this.props.connection.status !== 'connected') {
-      return;
-    }
-    this.props.sendMessage({
-      type: clientSocketMessageTypes.ACK_UPDATES,
-      payload: {
-        currentAsOf: message.payload.updatesResult.currentAsOf,
-      },
-    });
-  };
+export default function UpdateHandler(props: Props) {
+  const { addListener, removeListener, sendMessage } = props;
+
+  const dispatch = useDispatch();
+  const connectionStatus = useSelector((state) => state.connection.status);
+  const onMessage = React.useCallback(
+    (message: ServerSocketMessage) => {
+      if (message.type !== serverSocketMessageTypes.UPDATES) {
+        return;
+      }
+      dispatch({
+        type: processUpdatesActionType,
+        payload: message.payload,
+      });
+      if (connectionStatus !== 'connected') {
+        return;
+      }
+      sendMessage({
+        type: clientSocketMessageTypes.ACK_UPDATES,
+        payload: {
+          currentAsOf: message.payload.updatesResult.currentAsOf,
+        },
+      });
+    },
+    [connectionStatus, dispatch, sendMessage],
+  );
+  useEffect(() => {
+    addListener(onMessage);
+    return () => {
+      removeListener(onMessage);
+    };
+  }, [addListener, removeListener, onMessage]);
+
+  return null;
 }
-
-export default connect(
-  (state: AppState) => ({
-    connection: state.connection,
-  }),
-  null,
-  true,
-)(UpdateHandler);