NaviBar.js 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. import logo from '../logoOlx.png';
  2. import React from "react";
  3. import { Navbar, Nav, NavDropdown, Container } from 'react-bootstrap';
  4. import {Link} from "react-router-dom";
  5. import { connect } from 'react-redux';
  6. import CButtonLogout from './Logout';
  7. import Search from './Search';
  8. export function Navibar({isLogin}){
  9. return(
  10. <>
  11. <Navbar className='Navbar'>
  12. <Container className='header'>
  13. <Navbar.Brand><Link to="/"><img src={logo} alt={"logo"}/></Link></Navbar.Brand>
  14. {isLogin && <Search /> }
  15. <Navbar.Toggle aria-controls="basic-navbar-nav" />
  16. <Navbar.Collapse id="basic-navbar-nav">
  17. <Nav>
  18. {isLogin ? (
  19. <>
  20. <Nav.Link><Link to='/post-ad'>Добавить товар</Link></Nav.Link>
  21. <Nav.Link><Link to='/profile'>Профиль</Link></Nav.Link>
  22. <Nav.Link><CButtonLogout /></Nav.Link>
  23. </>
  24. ):(
  25. <>
  26. <Nav.Link><Link to="/login">Войти</Link></Nav.Link>
  27. <Nav.Link><Link to="/sign">Зарегистрироваться</Link></Nav.Link>
  28. </>
  29. )}
  30. </Nav>
  31. </Navbar.Collapse>
  32. </Container>
  33. </Navbar>
  34. </>
  35. )
  36. }
  37. const ConnectNav = connect(state => ({isLogin: state.authReducer.payload}),null)(Navibar)
  38. export default ConnectNav