refactor: [M3-6478] - Make <Select /> type safe

[bnussman-akamai]

Description 📝

Why ❓

• You may have not noticed, but the Select component had basically zero type-safety resulting in very bad developer experience and opens the possibility for bugs. It has been like this for years 😥
• Refer to the before and after

Description

• Does a refactor / improvement of the "Enhanced" Select component
• The goal isn't to make the component perfect (because it is super messed up), but the goal is to make it better
• Putting it up as a draft to get e2e test feedback and feedback from team

Impact 📷

Before 👎🏼	After 🎉

Before 👎🏼	After 🎉

Before 👎🏼

Screen.Recording.2023-04-11.at.9.12.13.PM.mov

After 🎉

Screen.Recording.2023-04-11.at.9.11.18.PM.mov

How to test 🧪

• Test places in the app that use a "Enhanced" Select Component
  • I recommend looking at the diff and going to each of the <Select /> components that were modified and testing the functionality.
• The e2e tests (once they are working) should also help check for bugs

[bnussman-akamai]

e2e tests results 9e2b98d

[bnussman-akamai]

Little bonus feature worth mentioning. If the select is clearable, the onChange type updates dynamically ✨

If a select is clearable, the onChange value could be null (the user hits the clear button)
If a select is NOT clearable, the onChange value will always be a defined item.

The types now properly reflect this 🎉 Notice how in the video the type of item is different depending on the clearable prop

Screen.Recording.2023-04-11.at.11.44.16.PM.mov

[cypress]

Passing run #2979 ↗︎

0

149

3

0

0

Details:

Merge branch 'develop' into refactor/make-select-typesafe
Project: Cloud Manager E2E	Commit: 73f2ad4138
Status: Passed	Duration: 13:47 💡
Started: Apr 14, 2023 4:40 PM	Ended: Apr 14, 2023 4:54 PM

_{This comment has been generated by cypress-bot as a result of this project's GitHub integration settings.}

[cpathipa]

Nice work!