Context state management: use of value objects.

## Description of when bug occurs:
1. we store data in the context as a reference, not a primitive.
```
const DEFAULT_CONTEXT = {
prim: '',
reference: {},
}
export const ContextProvider = () => {
const [object, setObject] = useState(DEFAULT_CONTEXT)
}
```
2. we then pass around the context value including this `object`.
3. when we call `setObject()` we have to make sure to have the latest `object` to not overwrite state changes from elsewhere.
* this also means making sure our nested memoization rules know to have the latest `object`, for each react component.
4. we need to remember to handle the nested `object.reference` when we setObject()

## Possible Solutions?
* keep the nested state, but treat as immutable value objects. By either:
- [ ] have a `handleSetObject()` handler in the context, which essentially re-does the same thing a reducer does during state updates:
* handles nested references
* overwrites partial properties, included partial nested properties
* uses the local `Context.object` state as the non-memoized latest state
* [example in our code](https://github.com/influxdata/ui/blob/4ffd332c3a82b7db683e574763ee1c2ea76a7552/src/dataExplorer/context/persistance.tsx#L191-L205)
- [ ] start using the `useReducer` hook, instead of the `useState` hook, in the Contexts?
* this removes our need to manually introduce the reducer-style state updates...by just making us write reducers
* remove the nested state:
- [ ] move as much as possible to setting prims, not references. Break up any nested `object.reference` etc

IMO, enforcement of code patterns is tricky. Therefore switching to the `useReducer()` could be the easiest to coordinate across devs working in the Contexts.