Docs: Add hooks usage guide page

[markerikson]

The usage guide pages for mapState and mapDispatch are amazingly good, and I frequently link them as references to answer people's questions.

However, we currently only have an API reference page for our hooks API. It's time we added some kind of a usage guide page for the hooks as well.

I'm not exactly sure what topics it should cover, but I'd like to hear suggestions.

[AnitaErnszt]

Hi,
I've been trying to use useDispatch hook within actions.js. Basically I'm having the same actions called (LoadItem, LoadItemSuccess || LoadItemFailure) in multiple components. If I call the api in every single component it works fine, but ideally I would package it into a function like FetchItem that dispatch all the functions and calls the api, and I could reuse FetchItem from the actions in every single component I need it.
This is possible using redux without the hooks, but because hooks can only be called within a react function component I'm not sure this can be done with hooks.
It would be great to see some complex example of the usage of these hooks.

[clifflo]

For the documentation of React Redux I have found that it does not state quite clearly how to useDispatch in useEffect(). When we call useDispatch in useEffect there would be error saying that you cannot use hooks within useEffect(). To cope with this problem you will need to add the dispatch object to the array after useEffect(), like this:

let dispatch = useDispatch();
useEffect(() => {
}, [dispatch])

I think this should be stated in the React Redux documentation more clearly.

[markerikson]

@clifflo I don't think anything special has to be said there. The React rules of hooks clearly state all hooks must be called at the top level of a function component. That applies to useDispatch as well.

So, yes, the hooks lint rule then says you have to add dispatch as a dependency, because it assumes that all variables that aren't React hooks setter functions could change.