Hoist React Component State

Hoisting state is a common Refactoring in React.
State in one component may need to be lifted up to a parent component for coordination with other component state.

This can be an error-prone refactoring.
With a good editor, it's best to start with the returned JSX and move out.