import React from "react" import { Nav, Navbar, NavItem, NavDropdown, MenuItem } from "react-bootstrap" import { LinkContainer } from "react-router-bootstrap" export default class AppNavBar extends React.PureComponent { constructor(props) { super(props); this.state = { userLoggedIn: (props.username !== ""), displayMoviesSearch: this.shouldDisplayMoviesSearch(props.router), displayShowsSearch: this.shouldDisplayShowsSearch(props.router), expanded: false, }; this.setExpanded = this.setExpanded.bind(this); } componentWillReceiveProps(nextProps) { // Update the state based on the next props const shouldDisplayMoviesSearch = this.shouldDisplayMoviesSearch(nextProps.router); const shouldDisplayShowsSearch = this.shouldDisplayShowsSearch(nextProps.router); if ((this.state.displayMoviesSearch !== shouldDisplayMoviesSearch) || (this.state.displayShowsSearch !== shouldDisplayShowsSearch)) { this.setState({ userLoggedIn: (nextProps.username !== ""), displayMoviesSearch: shouldDisplayMoviesSearch, displayShowsSearch: shouldDisplayShowsSearch, }); } } shouldDisplayMoviesSearch(router) { return this.matchPath(router, "movies"); } shouldDisplayShowsSearch(router) { return this.matchPath(router, "shows"); } matchPath(router, keyword) { const location = router.getCurrentLocation().pathname; return (location.indexOf(keyword) !== -1) } setExpanded(value) { if (this.state.expanded === value) { return } this.setState({ expanded: value }); } render() { const loggedAndActivated = (this.state.userLoggedIn && this.props.isActivated); const displayShowsSearch = (this.state.displayShowsSearch && loggedAndActivated); const displayMoviesSearch = (this.state.displayMoviesSearch && loggedAndActivated); return (
Canapé {loggedAndActivated && } {loggedAndActivated && } {loggedAndActivated && } {loggedAndActivated && } {displayMoviesSearch && } {displayShowsSearch && }
); } } class Search extends React.Component { constructor(props) { super(props); this.handleSearch = this.handleSearch.bind(this); } handleSearch(ev) { ev.preventDefault(); this.props.setExpanded(false); this.props.router.push(`${this.props.path}/${encodeURI(this.input.value)}`); } render() { return(
this.handleSearch(ev)}> this.input = input} />
); } } function MoviesDropdown() { return( ); } function ShowsDropdown() { return( ); } function UserDropdown(props) { if (props.username !== "") { return ( ); } else { return( ); } } function WishlistDropdown() { return( ); } function TorrentsDropdown(props) { const title = () return( ); } function TorrentsDropdownTitle(props) { return ( Torrents {props.torrentsCount > 0 &&   {props.torrentsCount} } ); }