feat(app): make story for MenuItem, Slideout, and OverflowBtn

[jerader]

closes #9449

Overview

This PR makes a story for the shared components: MenuItem, Slideout, and OverflowBtn and MenuList, so you can see the different states they have and what the component looks like. - also renames OverflowMenuBtn to MenuItem and OverflowMenu to MenuList

They are all under App -> Atoms

Changelog

• created 4 stories

Slideout:

MenuItem: (need to interact with it to see states)

OverflowBtn: (need to interact with it to see states)

MenuList: (need to interact with it to see states)

Review requests

• go to StoryBook or if that's not built yet, in terminal, type in make -C components dev
• navigate on the left menu to App -> Atoms. There should be 3 folders each with 1 item in them, that is where each of the stories live
• review OverflowBtn - you should see the different states when you interact with it (hover, focus, etc)
• review MenuItem - you should also see different states when you interact with it
• review Slideout - you have to toggle the isExpanded to true, then you will see the Slideout with example title, and example body (example body even includes a button)
• review MenuList

Risk assessment

low, behind ff

[codecov]

Codecov Report

Merging #9455 (9e5b5cb) into edge (68eda33) will decrease coverage by 0.02%.
The diff coverage is 17.39%.

@@            Coverage Diff             @@
##             edge    #9455      +/-   ##
==========================================
- Coverage   75.11%   75.09%   -0.03%     
==========================================
  Files        1878     1882       +4     
  Lines       49746    49766      +20     
  Branches     4836     4836              
==========================================
+ Hits        37369    37371       +2     
- Misses      11476    11494      +18     
  Partials      901      901              

Flag	Coverage Δ
app	73.25% <17.39%> (-0.14%)	⬇️

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

Impacted Files	Coverage Δ
app/src/atoms/MenuList/MenuItem.stories.tsx	0.00% <0.00%> (ø)
app/src/atoms/MenuList/MenuList.stories.tsx	0.00% <0.00%> (ø)
app/src/atoms/MenuList/OverflowBtn.stories.tsx	0.00% <0.00%> (ø)
app/src/atoms/MenuList/OverflowBtn.tsx	100.00% <ø> (ø)
app/src/atoms/Slideout/Slideout.stories.tsx	0.00% <0.00%> (ø)
app/src/organisms/Devices/ModuleCard/index.tsx	95.23% <ø> (ø)
app/src/atoms/MenuList/MenuItem.tsx	100.00% <100.00%> (ø)
app/src/atoms/MenuList/index.tsx	100.00% <100.00%> (ø)
...rganisms/Devices/ModuleCard/ModuleOverflowMenu.tsx	80.00% <100.00%> (+0.83%)	⬆️
...are/hardware_control/motion_planning/move_utils.py	91.52% <0.00%> (-0.57%)	⬇️
... and 1 more

[Kadee80]

💅 📖 Looks great! Thank you for this!

[sakibh]

LGTM! ✅