[Umbrella] Migrate to Hooks

[TejasQ]

React Hooks has been merged and so it's time to rewrite our entire library in hooks to:

1. Be cool, but also
2. To more effectively reuse stateful logic between our components, and most importantly, to
3. Be extra 1337.

There are 18 components that use class components and need to be migrated. Let this issue serve as an umbrella to port them over. Open separate issues if needed and update the checklist to include a link to the issue, instead of just plain text.

Components to Migrate

• [x] Autocomplete (#922)
• [ ] ContextMenu
• [ ] DatePicker
• [ ] Debug
• [x] Foldable (#916) Thanks, @adeelibr! 🎉
• [ ] OperationalUI
• [x] OperationalContext (#921)
• [ ] Page
• [ ] Select
• [x] Splash
• [x] Textarea (#922)
• [ ] Tooltip
• [x] TopbarSelect
• [x] Tree

Internal Components

• [ ] Confirm
• [x] Modal - thanks @JoshRosenstein! 🎉
• [ ] Tabs

Internal Utilities

• [ ] deprecate
• [ ] StyleGuideRenderer

[adeelibr]

Can I take Foldable up next? @TejasQ @fabien0102

[fabien0102]

@adeelibr You can! 💯

[JoshRosenstein]

Hey guys- great library. Im just surfing around trying to sharpen my TS & react skills. I glanced at tooltip to see if i could tackle it and looks like @fabien0102 put some work on it. But I wanted to ask if useLayoutEffect would be better for measurement hooks?

[TejasQ]

@JoshRosenstein, thanks for your amazing contributions! 🎉 How would Tooltip look with useLayoutEffect? I'm not really seeing the need for synchronicity there?

[fabien0102]

@JoshRosenstein I would like to refactor this component since a long time (but time… you know 😅 ). useLayoutEffect fit perfectly in this use case, so if you want to play with, be my guest! 🎉 Since we need to wait for the dom to calculate the size of the tooltip, it's perfect!