diff --git a/frontend/js/components/navbar.js b/frontend/js/components/navbar.js index 5e13d45..6575f6b 100644 --- a/frontend/js/components/navbar.js +++ b/frontend/js/components/navbar.js @@ -1,6 +1,6 @@ import React, { useState } from "react"; import { Route } from "react-router-dom"; -import { connect } from "react-redux"; +import { useSelector } from "react-redux"; import { LinkContainer } from "react-router-bootstrap"; import PropTypes from "prop-types"; @@ -8,24 +8,15 @@ import Nav from "react-bootstrap/Nav"; import Navbar from "react-bootstrap/Navbar"; import NavDropdown from "react-bootstrap/NavDropdown"; -const mapStateToProps = (state) => { - let torrentCount = 0; - if ( - state.torrentStore.has("torrents") && - state.torrentStore.get("torrents") !== undefined - ) { - torrentCount = state.torrentStore.get("torrents").size; - } - return { - username: state.userStore.get("username"), - isAdmin: state.userStore.get("isAdmin"), - torrentCount: torrentCount, - }; -}; - -const AppNavBar = (props) => { +const AppNavBar = () => { const [expanded, setExpanded] = useState(false); + const username = useSelector((state) => state.userStore.get("username")); + const isAdmin = useSelector((state) => state.userStore.get("isAdmin")); + const torrentCount = useSelector( + (state) => state.torrentStore.get("torrents").size + ); + return ( { - + ); }; AppNavBar.propTypes = { - torrentCount: PropTypes.number.isRequired, - username: PropTypes.string.isRequired, - isAdmin: PropTypes.bool.isRequired, history: PropTypes.object, }; - -export default connect(mapStateToProps)(AppNavBar); +export default AppNavBar; const Search = ({ path, placeholder, setExpanded, history }) => { const [search, setSearch] = useState("");