All files / components/Nav AppNavbar.js

100% Statements 6/6
100% Branches 25/25
100% Functions 3/3
100% Lines 6/6

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110              274x               48x 32x   16x         137x           137x                                                                                                                                                                
import { Button, Container, Nav, Navbar, NavDropdown } from "react-bootstrap";
import { Link } from "react-router-dom";
import { hasRole } from "main/utils/currentUser";
import headerImg from "../../../assets/header-logo-240.png"
import AppNavbarLocalhost from "main/components/Nav/AppNavbarLocalhost"
 
function isParticipant(currentUser) {
  return (
    hasRole(currentUser, "ROLE_ADMIN")
    || hasRole(currentUser, "ROLE_DRIVER")
    || hasRole(currentUser, "ROLE_RIDER")
  );
}
 
function createRideRequest(currentUser) {
  if (hasRole(currentUser, "ROLE_RIDER") || hasRole(currentUser, "ROLE_ADMIN")) {
    return (<NavDropdown.Item data-testid="appnavbar-ride-create-dropdown" as={Link} to="/ride/create">Request Ride</NavDropdown.Item>)
  } else {
    return (<div data-testid="NO-appnavbar-ride-create-dropdown"></div>)
  }
}
 
export default function AppNavbar({ currentUser, systemInfo, doLogout, currentUrl = window.location.href }) {
  const styles = {
    navbar: {
      backgroundColor: "#003660",
    }
  }
  
  return (
    <>
      {
        (currentUrl.startsWith("http://localhost:3000") || currentUrl.startsWith("http://127.0.0.1:3000")) && (
          <AppNavbarLocalhost url={currentUrl} />
        )
      }
      <Navbar expand="xl" variant="dark" sticky="top" data-testid="AppNavbar" style={styles.navbar}>
        <Container>
        <img data-testid="AppNavbarImage" src={headerImg} alt="" style={{width: 80, height: 80, marginRight: 10}} />
          <Navbar.Brand as={Link} to="/">
            GauchoRide
          </Navbar.Brand>
 
          <Navbar.Toggle />
 
          <>
            {/* be sure that each NavDropdown has a unique id and data-testid */}
          </>
 
          <Navbar.Collapse>
            {/* This `nav` component contains all navigation items that show up on the left side */}
            <Nav className="me-auto" >
              {
                systemInfo?.springH2ConsoleEnabled && (
                  <>
                    <Nav.Link href="/h2-console">H2Console</Nav.Link>
                  </>
                )
              }
              {
                systemInfo?.showSwaggerUILink && (
                  <>
                    <Nav.Link href="/swagger-ui/index.html">Swagger</Nav.Link>
                  </>
                )
              }
              {
                hasRole(currentUser, "ROLE_ADMIN") && (
                  <NavDropdown title="Admin" id="appnavbar-admin-dropdown" data-testid="appnavbar-admin-dropdown" >
                    <NavDropdown.Item as={Link} to="/admin/users">Users</NavDropdown.Item>
                  </NavDropdown>
                )
              }
              {
                isParticipant(currentUser) && (
                  <NavDropdown title="Shift" id="appnavbar-shift-dropdown" data-testid="appnavbar-shift-dropdown" >
                    <NavDropdown.Item as={Link} to="/shift/list">Driver shift table</NavDropdown.Item>
                  </NavDropdown>
                )
              }
              {
                isParticipant(currentUser) && (
                  <NavDropdown title="Ride Request" id="appnavbar-ride-dropdown" data-testid="appnavbar-ride-dropdown" >
                    <NavDropdown.Item data-testid="appnavbar-ride-dropdown-rides" as={Link} to="/ride/">Rides</NavDropdown.Item>
                    { createRideRequest(currentUser) }
                  </NavDropdown>
                )
              }
            </Nav>
 
            <Nav className="ml-auto">
              {/* This `nav` component contains all navigation items that show up on the right side */}
              {
                currentUser && currentUser.loggedIn ? (
                  <>
                    <Navbar.Text className="me-3" as={Link} to="/profile">Welcome, {currentUser.root.user.fullName}</Navbar.Text>
                    <Button onClick={doLogout}>Log Out</Button>
                  </>
                ) : (
                  <Button href="/oauth2/authorization/google">Log In</Button>
                )
              }
            </Nav>
          </Navbar.Collapse>
        </Container >
      </Navbar >
    </>
  );
}