Shift3 / boilerplate-client-react

The Bitwise standard starting point for new React web projects.
7 stars 10 forks source link

Add Dropdowns to Navbar #642

Closed joshwingreene closed 2 years ago

joshwingreene commented 2 years ago

Changes

  1. Replaces the NavLinks to /users and /agents with two NavDropdowns with corresponding NavDropdown.Items for the Users and Directory links. The dropdowns will only appear if the user has the correct permissions.
  2. Removes the CustomNavLink component and the useNavLink hook since they are unnecessary based on on the use of JSX for the dropdowns.
  3. Removed css from the styled nav bar components that were no longer necessary or had been replaced.
  4. Refactored the options of the profile/settings dropdown so that they are consistent with the dropdowns that lead to /users and /agents. Additionally, their icons were brought back.

Purpose

Adds Dropdowns to the Navbar

Approach

In contrast to #626, this implementation makes use of React-Bootstrap's dropdowns.

Testing Steps

  1. Pull in the changes to your local copy of this branch and run it alongside the dj_starter_demo repo.

Screenshots

Note: Ignore the blue rectangular outlines. They appear when I'm about to take a screenshot.

dropdowns navbar - 1

dropdowns navbar - 2

dropdowns navbar - 3

dropdowns navbar - 4

dropdowns navbar - 5

joshwingreene commented 2 years ago

Add Dropdowns to the Navbar