diff --git a/src/containers/Footer.js b/src/containers/Footer.js index 6bf7ddb..2f76a3a 100644 --- a/src/containers/Footer.js +++ b/src/containers/Footer.js @@ -1,34 +1,29 @@ -import React from "react"; -import { connect } from "react-redux"; +import { useSelector } from "react-redux"; -import { SocketSliceState } from "../modules/websocket/slice"; +import { RootState } from "../app/store"; +import { selectSocket } from "../modules/websocket/slice"; import LoginStatusPane from "../components/LoginStatusPane"; import SocketStatusPane from "../components/SocketStatusPane"; -interface Props { - //login: any, - socket: SocketSliceState, -}; +const Footer = () => { + const socket = useSelector(selectSocket); -const Footer = ({ socket }) => { - return ( - - ); -}; + return ( + + ); +} -const mapStateToProps = ({ socket }) => ({ socket }); - -export default connect(mapStateToProps)(Footer); +export default Footer; diff --git a/src/modules/websocket/slice.ts b/src/modules/websocket/slice.ts index 9344022..fd0d415 100644 --- a/src/modules/websocket/slice.ts +++ b/src/modules/websocket/slice.ts @@ -42,6 +42,8 @@ export const socketSlice = createSlice({ export const { socketOpen, socketOpened, socketClose, socketClosed } = socketSlice.actions; +export const selectSocket = (state: RootState) => state.socket; + export const socketSendMessage = createAction("socketSendMessage"); export default socketSlice.reducer;