1
00:00:00,180 --> 00:00:06,510
Once we understand the basics of Redhawks and have separated reducer and actions into separate files,

2
00:00:06,900 --> 00:00:11,410
I guess it's an awesome time to connect our app to a Redbox store.

3
00:00:11,830 --> 00:00:18,240
However, this time we'll take a more serious approach and use React Relix Library for that sense.

4
00:00:18,240 --> 00:00:23,450
Passing and get state function as a prop was killed while we were getting our feet wet with redux,

5
00:00:23,700 --> 00:00:27,140
which is not a particularly serious approach in the long run.

6
00:00:27,540 --> 00:00:32,220
And when we work with React Readers Library, we're looking for two things.

7
00:00:32,550 --> 00:00:39,150
We're looking for a provider that will wrap our whole application and then essentially we are going

8
00:00:39,150 --> 00:00:45,470
to use the Cannock function in each of the components that we want to access that info.

9
00:00:45,750 --> 00:00:48,460
Now, the info that I'm talking about is the store.

10
00:00:48,630 --> 00:00:55,440
So, for example, in our case that is called total demand and also, of course, our dispatch method.

11
00:00:55,620 --> 00:00:58,770
And then we can pass in whatever actions we would want.

12
00:00:59,010 --> 00:01:05,510
And as a side note, if you have worked with context, API setup is very, very similar.

13
00:01:05,760 --> 00:01:09,780
So I'm going to start by importing the provider import.

14
00:01:09,780 --> 00:01:11,550
It is a named export.

15
00:01:11,730 --> 00:01:15,170
So we go with provider from REACT Redux.

16
00:01:15,480 --> 00:01:19,530
So once we have our provider, then I would want to wrap my application.

17
00:01:19,890 --> 00:01:26,220
And of course I have multiple choices so I could even technically go to ingest and wrap my AMP component

18
00:01:26,220 --> 00:01:26,700
as well.

19
00:01:27,120 --> 00:01:33,390
But since I'm already an app, it is a root component, I might as well just pass it to provider and

20
00:01:33,390 --> 00:01:38,790
then each and every component will have access to my whole redox store.

21
00:01:39,000 --> 00:01:44,880
Again, if you have worked with Context API, normally, probably you would use it next year.

22
00:01:45,180 --> 00:01:46,920
You just wrap your app component.

23
00:01:47,220 --> 00:01:53,550
But then since all the components are currently rendered in the objets anyway, might as well do it

24
00:01:53,700 --> 00:01:54,720
right here.

25
00:01:55,080 --> 00:02:03,870
So instead of Main, I'm going to delete this moment and I'm going to go with my provider component.

26
00:02:04,110 --> 00:02:06,980
Once I save it, there will be a big factor.

27
00:02:07,350 --> 00:02:13,980
The reason for this error is that the provider component is looking for the problem and the problem

28
00:02:14,220 --> 00:02:15,300
is store.

29
00:02:15,600 --> 00:02:20,670
And you can probably already guess what kind of value we need to pass in the store.

30
00:02:21,420 --> 00:02:25,310
And if you're guessing store, you are exactly correct.

31
00:02:25,530 --> 00:02:28,650
So store is equal to our store.

32
00:02:28,830 --> 00:02:34,830
So if you call these Bugs Bunny just passing the Bugs Bunny, I once I said there's no error, everything

33
00:02:34,830 --> 00:02:35,460
works well.

34
00:02:35,700 --> 00:02:43,470
And now each and every component that is wrapped in the provider can access my store, can access the

35
00:02:43,470 --> 00:02:50,910
dispatch method and set up the actions or essentially dispatch the actions to every store once we set

36
00:02:50,910 --> 00:02:53,430
everything up using the correct function.