From 79f547b2748114590545824d21c877fdb6c4d88e Mon Sep 17 00:00:00 2001
From: Titouan Rigoudy <titouan.rigoudy@gmail.com>
Date: Sun, 7 Nov 2021 18:01:09 +0100
Subject: [PATCH] Use typed selector hooks.

---
 src/components/ConnectPage.tsx | 4 ++--
 src/components/Footer.tsx      | 6 +++---
 src/components/SolsticeApp.tsx | 4 ++--
 src/modules/room/RoomsPane.tsx | 6 +++---
 src/modules/user/UsersPane.tsx | 4 ++--
 5 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/ConnectPage.tsx b/src/components/ConnectPage.tsx
index 40fa2b4..13a2dca 100644
--- a/src/components/ConnectPage.tsx
+++ b/src/components/ConnectPage.tsx
@@ -1,12 +1,12 @@
-import { useSelector } from "react-redux";
 import { useLocation } from "react-router";
 import { Redirect } from "react-router-dom";
 
+import { useAppSelector } from "app/hooks";
 import ConnectForm from "components/ConnectForm";
 import { selectSocket, SocketState } from "modules/socket/slice";
 
 const ConnectPage: React.FC = () => {
-  const socket = useSelector(selectSocket);
+  const socket = useAppSelector(selectSocket);
   const location = useLocation();
 
   // If the socket is open and we are logged in, we can proceed to the app.
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 9ce7617..15c0abd 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,14 +1,14 @@
 import { FC } from "react";
-import { useSelector } from "react-redux";
 
+import { useAppSelector } from "app/hooks";
 import LoginStatusPane from "modules/login/LoginStatusPane";
 import { selectLogin } from "modules/login/slice";
 import { selectSocket } from "modules/socket/slice";
 import SocketStatusPane from "modules/socket/SocketStatusPane";
 
 const Footer: FC = () => {
-  const login = useSelector(selectLogin);
-  const socket = useSelector(selectSocket);
+  const login = useAppSelector(selectLogin);
+  const socket = useAppSelector(selectSocket);
 
   return (
     <footer className="hidden md:flex items-center justify-center">
diff --git a/src/components/SolsticeApp.tsx b/src/components/SolsticeApp.tsx
index 1eb6bd8..6c267d6 100644
--- a/src/components/SolsticeApp.tsx
+++ b/src/components/SolsticeApp.tsx
@@ -1,7 +1,7 @@
 import { FC } from "react";
-import { useSelector } from "react-redux";
 import { Switch, Redirect, Route, useLocation } from "react-router-dom";
 
+import { useAppSelector } from "app/hooks";
 import ConnectPage from "components/ConnectPage";
 import Header from "components/Header";
 import Footer from "components/Footer";
@@ -27,7 +27,7 @@ const MainPane: FC = () => {
 };
 
 const ConnectedApp: FC = ({ children }) => {
-  const socket = useSelector(selectSocket);
+  const socket = useAppSelector(selectSocket);
   const location = useLocation();
 
   if (socket.state !== SocketState.Open) {
diff --git a/src/modules/room/RoomsPane.tsx b/src/modules/room/RoomsPane.tsx
index e29593e..000637a 100644
--- a/src/modules/room/RoomsPane.tsx
+++ b/src/modules/room/RoomsPane.tsx
@@ -1,8 +1,8 @@
 import { FC } from "react";
-import { useSelector } from "react-redux";
 import { useParams, useRouteMatch } from "react-router";
 import { Switch, Route } from "react-router-dom";
 
+import { useAppSelector } from "app/hooks";
 import { decode } from "modules/base64";
 import { selectLogin } from "modules/login/slice";
 import { RoomState, selectAllRooms } from "modules/room/slice";
@@ -33,8 +33,8 @@ interface UrlParams {
 }
 
 const RoomsPaneInner: FC<{}> = () => {
-  const login = useSelector(selectLogin);
-  const rooms = useSelector(selectAllRooms);
+  const login = useAppSelector(selectLogin);
+  const rooms = useAppSelector(selectAllRooms);
   const { roomId } = useParams<UrlParams>();
 
   // When we have not chosen a room, we always show the list. For small screens
diff --git a/src/modules/user/UsersPane.tsx b/src/modules/user/UsersPane.tsx
index ebbf94a..58a45fd 100644
--- a/src/modules/user/UsersPane.tsx
+++ b/src/modules/user/UsersPane.tsx
@@ -1,8 +1,8 @@
 import { FC } from "react";
-import { useSelector } from "react-redux";
 import { useParams, useRouteMatch } from "react-router";
 import { Switch, Route } from "react-router-dom";
 
+import { useAppSelector } from "app/hooks";
 import { decode } from "modules/base64";
 import { UserMap, selectAllUsers } from "modules/user/slice";
 import UserDetails from "modules/user/UserDetails";
@@ -46,7 +46,7 @@ const UserInfoPane: FC<Props> = ({ users }) => {
 
 const UsersPane: FC<{}> = () => {
   const { path } = useRouteMatch();
-  const users = useSelector(selectAllUsers);
+  const users = useAppSelector(selectAllUsers);
 
   return (
     <div className="h-full w-full flex">