{"size": 3602, "ext": "js", "max_stars_repo_path": "alx-accessor/src/componets/layout/MyNavbar.js", "max_stars_repo_name": "Paulwamaria/alxlaunchpadaccessfront", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "alx-accessor/src/componets/layout/MyNavbar.js", "max_issues_repo_name": "Paulwamaria/alxlaunchpadaccessfront", "max_issues_repo_issues_event_min_datetime": "2020-10-12T07:55:38.000Z", "max_issues_repo_issues_event_max_datetime": "2020-11-06T12:19:54.000Z", "max_forks_repo_path": "alx-accessor/src/componets/layout/MyNavbar.js", "max_forks_repo_name": "Paulwamaria/alxlaunchpadaccessfront", "max_forks_repo_forks_event_min_datetime": "2020-10-12T07:51:24.000Z", "max_forks_repo_forks_event_max_datetime": "2020-10-12T07:51:24.000Z"}
{"max_stars_count": null, "max_issues_count": 12, "max_forks_count": 1, "avg_line_length": 31.3217391304, "max_line_length": 79, "alphanum_fraction": 0.5036091061}
import React, { Component, Fragment } from "react";
import { Navbar, Nav, Dropdown } from "react-bootstrap";
import { Route, Switch } from "react-router-dom";
import Home from "./Home";
import Login from "../auth/Login";
import Register from "../auth/Register";
import Activate from "../auth/Activate";
import ResetPassword from "../auth/ResetPassword";
import ResetPasswordConfirm from "../auth/ResetPasswordConfirm";
import About from "./About";
import Licence from "./Licence";
import { logout } from "../../actions/auth";
import { connect } from "react-redux";
import PrivateRoute from "../common/PrivateRoute";
import DeleteUser from "../auth/DeleteUser";

export class MyNavbar extends Component {
  constructor(props) {
    super(props);

    this.state = {};
  }

  render() {
    return (
      <div>
        <Navbar
          variant="dark"
          expand="lg"
          className="#1c2a48 mdb-color darken-3"
          sticky="top"
        >
          <Navbar.Brand href="/">Alx-accessor</Navbar.Brand>
          <Navbar.Toggle aria-controls="basic-navbar-nav" />
          <Navbar.Collapse id="basic-navbar-nav">
            <Nav.Link href="/">Home</Nav.Link>
            <Nav.Link href="/about">About</Nav.Link>
            <ul className="navbar-nav ml-auto nav-flex-icons">
              <li className="nav-item dropdown">
                <Dropdown>
                  <Dropdown.Toggle
                    variant="primary"
                    id="dropdown-basic"
                    className=""
                  >
                    <i className="fas fa-user"></i>
                  </Dropdown.Toggle>

                  <Dropdown.Menu>
                    {this.props.isAuthenticated ? (
                      <Fragment>
                        <Dropdown.Item onClick={this.props.logout}>
                          logout
                        </Dropdown.Item>
                        <Dropdown.Item href="/auth/users/me/">
                          Remove Account
                        </Dropdown.Item>
                      </Fragment>
                    ) : (
                      <Fragment>
                        <Dropdown.Item href="/login">Login</Dropdown.Item>
                        <Dropdown.Item href="/register">Sign Up</Dropdown.Item>
                      </Fragment>
                    )}
                  </Dropdown.Menu>
                </Dropdown>
              </li>
            </ul>
          </Navbar.Collapse>
        </Navbar>
        <Switch>
          <PrivateRoute exact path="/" component={Home} />
          <Route exact path="/auth/users/me/" component={DeleteUser} />
          <Route exact path="/about">
            <About />
          </Route>

          <Route exact path="/licence">
            <Licence />
          </Route>
          <Route exact path="/login">
            <Login />
          </Route>
          <Route exact path="/register">
            <Register />
          </Route>
          <Route path="/activate/:uid/:token" component={Activate} />
          <Route exact path="/reset_password">
            <ResetPassword />
          </Route>
          <Route
            exact
            path="/password/reset/confirm/:uid/:token"
            component={ResetPasswordConfirm}
          />
        </Switch>
      </div>
    );
  }
}

const mapStateToProps = (state) => {
  return {
    isAuthenticated: state.authReducer.isAuthenticated,
  };
};

const mapDispatchToProps = (dispactch) => {
  return {
    logout: () => dispactch(logout()),
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(MyNavbar);
