From af2641c31760fd62724229129396c591f44bc5b8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gr=C3=A9goire=20Delattre?= <gregoire.delattre@gmail.com>
Date: Fri, 3 Apr 2020 16:46:33 +0200
Subject: [PATCH] Use redux hooks on the websocket component

---
 frontend/js/components/websocket.js | 37 ++++++++---------------------
 1 file changed, 10 insertions(+), 27 deletions(-)

diff --git a/frontend/js/components/websocket.js b/frontend/js/components/websocket.js
index 5f7c07b..9082461 100644
--- a/frontend/js/components/websocket.js
+++ b/frontend/js/components/websocket.js
@@ -1,25 +1,14 @@
 import { useEffect, useState, useCallback } from "react";
-import PropTypes from "prop-types";
-import { connect } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 import { setFetchedTorrents } from "../actions/torrents";
 import { newMovieEvent } from "../actions/movies";
 import { newEpisodeEvent } from "../actions/shows";
 
-const mapStateToProps = (state) => ({
-  isLogged: state.userStore.get("isLogged"),
-});
-const mapDispatchToProps = {
-  setFetchedTorrents,
-  newMovieEvent,
-  newEpisodeEvent,
-};
+const WsHandler = () => {
+  const dispatch = useDispatch();
+
+  const isLogged = useSelector((state) => state.userStore.get("isLogged"));
 
-const WsHandler = ({
-  isLogged,
-  setFetchedTorrents,
-  newMovieEvent,
-  newEpisodeEvent,
-}) => {
   const [ws, setWs] = useState(null);
 
   const stop = useCallback(() => {
@@ -73,13 +62,13 @@ const WsHandler = ({
 
       switch (data.type) {
         case "torrents":
-          setFetchedTorrents(data.message);
+          dispatch(setFetchedTorrents(data.message));
           break;
         case "newVideo":
           if (data.message.type === "movie") {
-            newMovieEvent(data.message.data);
+            dispatch(newMovieEvent(data.message.data));
           } else if (data.message.type === "episode") {
-            newEpisodeEvent(data.message.data);
+            dispatch(newEpisodeEvent(data.message.data));
           }
           break;
       }
@@ -90,7 +79,7 @@ const WsHandler = ({
     };
 
     setWs(socket);
-  }, [ws, isLogged, newMovieEvent, setFetchedTorrents, newEpisodeEvent, stop]);
+  }, [ws, isLogged, dispatch, stop]);
 
   useEffect(() => {
     const intervalID = setInterval(() => {
@@ -118,11 +107,5 @@ const WsHandler = ({
 
   return null;
 };
-WsHandler.propTypes = {
-  isLogged: PropTypes.bool.isRequired,
-  setFetchedTorrents: PropTypes.func,
-  newMovieEvent: PropTypes.func,
-  newEpisodeEvent: PropTypes.func,
-};
 
-export default connect(mapStateToProps, mapDispatchToProps)(WsHandler);
+export default WsHandler;