feat: Global nav menus open on hover

[rusackas]

SUMMARY

I was fiddling around on the menus in this PR: #12024
I was finding it strangely tedious to have to click the global nav menus to open them. Hover-opening seemed lie it'd be more natural. Not sure others will agree, but if they do, we can merge this PR after that one.

Curious what others think, e.g. @junlincc @ktmud @mihir174

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TEST PLAN

ADDITIONAL INFORMATION

• Has associated issue:
• Changes UI
• Requires DB Migration.
• Confirm DB Migration upgrade and downgrade tested.
• Introduces new feature or API
• Removes existing feature or API

[codecov-io]

Codecov Report

Merging #12025 (6d84568) into master (90ed326) will increase coverage by 1.13%.
The diff coverage is 52.94%.

@@            Coverage Diff             @@
##           master   #12025      +/-   ##
==========================================
+ Coverage   66.58%   67.72%   +1.13%     
==========================================
  Files         951      951              
  Lines       46663    46675      +12     
  Branches     4571     4571              
==========================================
+ Hits        31070    31609     +539     
+ Misses      15456    14953     -503     
+ Partials      137      113      -24     

Flag	Coverage Δ
cypress	53.13% <30.76%> (+8.14%)	⬆️
javascript	62.64% <52.94%> (-0.02%)	⬇️
python	64.59% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
...et-frontend/src/components/Menu/LanguagePicker.tsx	69.23% <50.00%> (-10.77%)	⬇️
...perset-frontend/src/components/Menu/MenuObject.tsx	78.94% <50.00%> (-8.56%)	⬇️
superset-frontend/src/components/Menu/NewMenu.tsx	84.61% <50.00%> (-15.39%)	⬇️
superset-frontend/src/components/Menu/Menu.tsx	93.67% <60.00%> (-1.07%)	⬇️
...ponents/AdhocFilterEditPopoverSimpleTabContent.jsx	81.81% <0.00%> (-1.82%)	⬇️
...rontend/src/visualizations/FilterBox/FilterBox.jsx	58.12% <0.00%> (+1.25%)	⬆️
...-frontend/src/dashboard/actions/dashboardLayout.js	98.03% <0.00%> (+1.96%)	⬆️
.../src/dashboard/components/gridComponents/Chart.jsx	84.53% <0.00%> (+2.06%)	⬆️
...et-frontend/src/dashboard/components/Dashboard.jsx	84.70% <0.00%> (+2.35%)	⬆️
superset-frontend/src/chart/chartAction.js	78.12% <0.00%> (+2.60%)	⬆️
... and 55 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 90ed326...6d84568. Read the comment docs.

[ktmud]

@rusackas I'm finding a case where hovering to show menu might have become an inconvenience:

showing-menu-on-hover.mp4

When saving chart, I wanted to click on the "Save" button, but if I move the mouse too fast, it will trigger open the hover menu and when I moved back to the position of the "Save" button and click, I would accidentally click on the menu and lost all my changes to the chart---which is quite annoying.

I'm wondering if we can:

1. Increase the size of the run button area---it could use a little bit more margin around the buttons.
2. Move SQL lab to the second menu item so the hover menu doesn't overlap with the buttons.
3. Add a delay to open the menu on hover?

to avoid users accidentally clicking on the hovered menu item. We can do one or all of these if they make sense to you.

cc @junlincc @mihir174

[junlincc]

We can do one or all of these if they make sense to you.

@ktmud
All make sense, but I wanna move run button to the bottom, move save to top right, once we simplify and reorganize the controls? filling out the fields from top to bottom and have to go all the way back to top to run query is quite annoying//////