This line of code around despatching in action is really long, way longer than I would ever want to
write to, just dispatch one single action.
So let's figure out a way to condense this just a little bit.
To do so, we're going to create a hook that is going to automatically give us access to all of our
different action creators inside of our components.
So to get started inside of my SIRC directory, I will make a new folder called Hooke's.
Inside there, I'm going to make a new file called Use Actions.
Thoughts.
Inside of here, we're going to add in an import for that same U.S dispatch function or that same U.S
dispatch hook that we just made use of.
And we will import that from REACT redux, I'm going to also get BINDE action creators from Redox.
And then finally, I will import that big action that creators object, which technically, just as
one action creator inside of it right now are search repositories, one from up, one directory state.
Then I will define and export a function called use actions.
OK, so here's the general idea, we have used dispatch, the U.S dispatch function is only used to
get access to the dispatch function itself, and that is the function that is a part of our reduc store.
It is what allows us to dispatch an action into all of our different reducers.
The first thing we're going to do is make use of that to get access to our dispatch function.
Next up, BINDE action, the creators, you might recall how this function works from the Redox Library,
this BINDE action creators function is going to be called.
With a first argument of an object containing a bunch of different action, the creators, so that is
our action creators import right here, remember, this is an object technically that has right now
are one action creator of search repositories inside of it.
Then as a second argument.
We provide the dispatch function.
Bind to action is going to give us back an object that contains all the different action creators that
we provided in as the first argument, but now whenever we call these bound action creators, the return
value from them will be automatically taken and provided to dispatch.
So we can kind of imagine that we are getting back an object that kind of looks like this.
We're getting back something that looks like search repositories.
Dispatch search repositories.
Repositories, if I could spell that correctly, depositories.
There we go.
And really just kind of like that part right there.
Not quite exactly that, but you can kind of imagine that is what we are getting back out of BINDE action
creators.
So we are going to return that object from this function.
So that's all we have to add inside of here, so let's save this and then see how we're going to actually
use this inside of a component.
So I will go back over to what repositories list.
I'm going to delete the EU's dispatch in action creator's import and replace it with use actions from
up one directory, Hooke's use actions.
I'll then clean up our dispatch line.
I'm going to instead call let's do the call first, use actions.
And then out of there, I'm going to D structure search repositories.
So this version of search repositories like we just saw is pretty much already bound to that dispatch
function, as soon as we call this, it is equivalent to doing this entire long line of code right there.
Now, inside of our announcement, we can instead only do search repositories and pass term lot easier
to use than what we had before.
OK, so let's save this to a quick test.
If I once again search for react, yep, looks like I am able to successfully reach out to that API
and get a list of all those matching packages.
Now, the last big thing we have to do is somehow reach into our store, get some piece of state, and
then iterate over all the fetched packages we found and print out a line for each of them inside of
our Geass block.
So that very last step in the next video.