NavDropdown: Revert to previous implementation
Created by: umpox
Description
This PR reverts back to the previous NavDropdown implementation.
We migrated from Reactstrap->Reach in this PR: https://github.com/sourcegraph/sourcegraph/pull/29582
It caused some accessibility issues because this UX functions both as a link to code search, and as a button to open the menu.
Hover issues
I fixed the hover issues from https://github.com/sourcegraph/sourcegraph/issues/31281 in this commit: https://github.com/sourcegraph/sourcegraph/pull/31313/commits/0b1f9f3e4d64772de7392467cb1c33cffe859791
Accessibility issues
The component changed from rendering as a <a> to a <button>. This works for the menu, and is required by Reach - but is not acceptable for our UX. The primary function of this component is to let users click to navigate to "Code search". Rendering a button breaks a lot of functionality around that (e.g. middle mouse clicks to open in a new tab).
As far as I can tell, the Reach Menu components do not support rendering a MenuButton as a Link. I will look further if we can somehow achieve this. I will also speak to design to understand if we can move away from this UX - as I'm not sure that it will ever be fully accessible whilst we need to support both link and menu functionality simultaneously.
Test plan
- Try to replicate the bug from https://github.com/sourcegraph/sourcegraph/issues/31281
- Try to middle mouse click "Code search" to open in a new tab
