render() {
    const { routes, logo } = this.props;
    let navbarBrandProps;
    if (logo && logo.innerLink) {
      navbarBrandProps = {
        to: logo.innerLink,
        tag: Link,
      };
    } else if (logo && logo.outterLink) {
      navbarBrandProps = {
        href: logo.outterLink,
        target: "_blank",
      };
    }
    return (
      <Navbar
        className="navbar-vertical fixed-left navbar-light bg-white"
        expand="md"
        id="sidenav-main"
      >
        <Container fluid>
          {/* Toggler */}
          <button
            className="navbar-toggler"
            type="button"
            onClick={this.toggleCollapse}
          >
            <span className="navbar-toggler-icon" />
          </button>
          {/* Brand */}
          {logo ? (
            <NavbarBrand className="pt-0" {...navbarBrandProps}>
              <i className="fab fa-medapps"></i>
            </NavbarBrand>
          ) : null}
          {/* User */}
          <Nav className="align-items-center d-md-none">
            <UncontrolledDropdown nav>
              <DropdownToggle nav>
                <Media className="align-items-center">
                  <span className="avatar avatar-sm rounded-circle">
                    <i className="fas fa-user"></i>
                  </span>
                </Media>
              </DropdownToggle>
              <DropdownMenu className="dropdown-menu-arrow" right>
                <DropdownItem className="noti-title" header tag="div">
                  <h6 className="text-overflow m-0">Welcome!</h6>
                </DropdownItem>
                <DropdownItem
                  href="#pablo"
                  onClick={() => {
                    localStorage.removeItem("user_id");
                    localStorage.removeItem("user_type");
                    localStorage.removeItem("role");
                    localStorage.removeItem("token");
                    localStorage.removeItem("permissions");
                  }}
                >
                  <i className="ni ni-user-run" />
                  <span>Logout</span>
                </DropdownItem>
              </DropdownMenu>
            </UncontrolledDropdown>
          </Nav>

          {/* Collapse */}
          <Collapse navbar isOpen={this.state.collapseOpen}>
            {/* Collapse header */}
            <div className="navbar-collapse-header d-md-none">
              <Row>
                {logo ? (
                  <Col className="collapse-brand" xs="6">
                    {logo.innerLink ? (
                      <Link to={logo.innerLink}>
                        <i className="fab fa-medapps"></i>
                      </Link>
                    ) : (
                      <a href={logo.outterLink}>
                        <i className="fab fa-medapps"></i>
                      </a>
                    )}
                  </Col>
                ) : null}
                <Col className="collapse-close" xs="6">
                  <button
                    className="navbar-toggler"
                    type="button"
                    onClick={this.toggleCollapse}
                  >
                    <span />
                    <span />
                  </button>
                </Col>
              </Row>
            </div>
            {/* Navigation */}
            <Nav navbar>{createLinks(routes)}</Nav>
          </Collapse>
        </Container>
      </Navbar>
    );
  }
// creates the links that appear in the left menu / Sidebar
creates the links that appear in the left menu / Sidebar
creates the links that appear in the left menu / Sidebar
render() {
    const { routes, logo } = this.props;
    let navbarBrandProps;
    if (logo && logo.innerLink) {
      navbarBrandProps = {
        to: logo.innerLink,
        tag: Link,
      };
    } else if (logo && logo.outterLink) {
      navbarBrandProps = {
        href: logo.outterLink,
        target: "_blank",
      };
    }
    return (
      <Navbar
        className="navbar-vertical fixed-left navbar-light bg-white"
        expand="md"
        id="sidenav-main"
      >
        <Container fluid>
          {}
          <button
            className="navbar-toggler"
            type="button"
            onClick={this.toggleCollapse}
          >
            <span className="navbar-toggler-icon" />
          </button>
          {}
          {logo ? (
            <NavbarBrand className="pt-0" {...navbarBrandProps}>
              <i className="fab fa-medapps"></i>
            </NavbarBrand>
          ) : null}
          {}
          <Nav className="align-items-center d-md-none">
            <UncontrolledDropdown nav>
              <DropdownToggle nav>
                <Media className="align-items-center">
                  <span className="avatar avatar-sm rounded-circle">
                    <i className="fas fa-user"></i>
                  </span>
                </Media>
              </DropdownToggle>
              <DropdownMenu className="dropdown-menu-arrow" right>
                <DropdownItem className="noti-title" header tag="div">
                  <h6 className="text-overflow m-0">Welcome!</h6>
                </DropdownItem>
                <DropdownItem
                  href="#pablo"
                  onClick={() => {
                    localStorage.removeItem("user_id");
                    localStorage.removeItem("user_type");
                    localStorage.removeItem("role");
                    localStorage.removeItem("token");
                    localStorage.removeItem("permissions");
                  }}
                >
                  <i className="ni ni-user-run" />
                  <span>Logout</span>
                </DropdownItem>
              </DropdownMenu>
            </UncontrolledDropdown>
          </Nav>
          {}
          <Collapse navbar isOpen={this.state.collapseOpen}>
            {}
            <div className="navbar-collapse-header d-md-none">
              <Row>
                {logo ? (
                  <Col className="collapse-brand" xs="6">
                    {logo.innerLink ? (
                      <Link to={logo.innerLink}>
                        <i className="fab fa-medapps"></i>
                      </Link>
                    ) : (
                      <a href={logo.outterLink}>
                        <i className="fab fa-medapps"></i>
                      </a>
                    )}
                  </Col>
                ) : null}
                <Col className="collapse-close" xs="6">
                  <button
                    className="navbar-toggler"
                    type="button"
                    onClick={this.toggleCollapse}
                  >
                    <span />
                    <span />
                  </button>
                </Col>
              </Row>
            </div>
            {}
            <Nav navbar>{createLinks(routes)}</Nav>
          </Collapse>
        </Container>
      </Navbar>
    );
  }
render ( ) { const { routes , logo } = this . props ; let navbarBrandProps ; if ( logo && logo . innerLink ) { navbarBrandProps = { to : logo . innerLink , tag : Link , } ; } else if ( logo && logo . outterLink ) { navbarBrandProps = { href : logo . outterLink , target : "_blank" , } ; } return ( < Navbar className = "navbar-vertical fixed-left navbar-light bg-white" expand = "md" id = "sidenav-main" > < Container fluid > { } < button className = "navbar-toggler" type = "button" onClick = { this . toggleCollapse } > < span className = "navbar-toggler-icon" / > < / button > { } { logo ? ( < NavbarBrand className = "pt-0" { ... navbarBrandProps } > < i className = "fab fa-medapps" > < / i > < / NavbarBrand > ) : null } { } < Nav className = "align-items-center d-md-none" > < UncontrolledDropdown nav > < DropdownToggle nav > < Media className = "align-items-center" > < span className = "avatar avatar-sm rounded-circle" > < i className = "fas fa-user" > < / i > < / span > < / Media > < / DropdownToggle > < DropdownMenu className = "dropdown-menu-arrow" right > < DropdownItem className = "noti-title" header tag = "div" > < h6 className = "text-overflow m-0" > Welcome! < / h6 > < / DropdownItem > < DropdownItem href = "#pablo" onClick = { ( ) => { localStorage . removeItem ( "user_id" ) ; localStorage . removeItem ( "user_type" ) ; localStorage . removeItem ( "role" ) ; localStorage . removeItem ( "token" ) ; localStorage . removeItem ( "permissions" ) ; } } > < i className = "ni ni-user-run" / > < span > Logout < / span > < / DropdownItem > < / DropdownMenu > < / UncontrolledDropdown > < / Nav > { } < Collapse navbar isOpen = { this . state . collapseOpen } > { } < div className = "navbar-collapse-header d-md-none" > < Row > { logo ? ( < Col className = "collapse-brand" xs = "6" > { logo . innerLink ? ( < Link to = { logo . innerLink } > < i className = "fab fa-medapps" > < / i > < / Link > ) : ( < a href = { logo . outterLink } > < i className = "fab fa-medapps" > < / i > < / a > ) } < / Col > ) : null } < Col className = "collapse-close" xs = "6" > < button className = "navbar-toggler" type = "button" onClick = { this . toggleCollapse } > < span / > < span / > < / button > < / Col > < / Row > < / div > { } < Nav navbar > { createLinks ( routes ) } < / Nav > < / Collapse > < / Container > < / Navbar > ) ; }
creates the links that appear in the left menu / Sidebar
creates the links that appear in the left menu / Sidebar
/* Toggler */ /* Brand */ /* User */ /* Collapse */ /* Collapse header */ /* Navigation */