1
00:00:00,790 --> 00:00:04,110
In the last video we ran into some big issues around applying them boys.

2
00:00:04,180 --> 00:00:07,240
So in this video we're going to figure out a way to work around all this stuff.

3
00:00:07,450 --> 00:00:11,800
We're going to first begin by deleting this little kind of reactor we did right here and then I'm going

4
00:00:11,800 --> 00:00:14,080
to uncomment our original code.

5
00:00:14,470 --> 00:00:14,680
OK.

6
00:00:14,680 --> 00:00:16,180
So here's what we really need to do.

7
00:00:16,240 --> 00:00:19,960
We need to define a function outside of our action creator.

8
00:00:20,120 --> 00:00:25,240
That's going to actually make the request and then dispatch or action and we're going to memorize it

9
00:00:25,270 --> 00:00:31,030
outside of the action creator so that it only gets memorized exactly one time and it's not going to

10
00:00:31,030 --> 00:00:35,370
be remembered sized every time that we call our action creator effects user.

11
00:00:35,380 --> 00:00:41,380
So underneath my action Creator I'm going to to clear a new variable called underscore Thach user.

12
00:00:41,600 --> 00:00:46,990
I'm putting in the underscore right here to indicate that this is a private function so to speak and

13
00:00:46,990 --> 00:00:51,280
that other engineers should not attempt to call this function unless they really know what they are

14
00:00:51,280 --> 00:00:51,870
doing.

15
00:00:52,930 --> 00:00:55,720
It's going to say underscore fecche user.

16
00:00:55,930 --> 00:01:01,670
And then we're going to set up an aero function here and this arrow function right here is going to

17
00:01:01,670 --> 00:01:05,470
be what actually makes a request and then dispatches an action.

18
00:01:05,510 --> 00:01:12,560
So I'm going to cut the request and the dispatch and put them in the new function right here and then

19
00:01:12,620 --> 00:01:19,080
I'm going to make sure that I mean Elize this thing by wrapping it with a memorized call so opening

20
00:01:19,080 --> 00:01:24,100
parentheses then why is closing parentheses over here.

21
00:01:24,120 --> 00:01:27,800
Now we can make sure that we call the memorized version of Fettes user

22
00:01:30,560 --> 00:01:32,810
inside of our action creator.

23
00:01:32,810 --> 00:01:34,490
Like so.

24
00:01:34,620 --> 00:01:34,860
All right.

25
00:01:34,860 --> 00:01:35,970
Now this almost works.

26
00:01:35,970 --> 00:01:38,100
There's just one little issue.

27
00:01:38,330 --> 00:01:43,010
Are fecche user function underscore needs to get the idea that we want to fetch.

28
00:01:43,050 --> 00:01:45,780
And it also needs a reference to the dispatch function.

29
00:01:45,780 --> 00:01:52,450
So we need to somehow get these arguments right here into fecche user so we should have to do here is

30
00:01:52,450 --> 00:01:59,160
make sure that we call ID or fetch a user with the given ID and we'll pass and dispatch as well.

31
00:01:59,170 --> 00:02:06,240
So now our memorized function right here will receive the ID and dispatch as arguments.

32
00:02:06,290 --> 00:02:07,750
OK so that should be it.

33
00:02:07,760 --> 00:02:10,390
I think that we should be able to test this thing.

34
00:02:10,490 --> 00:02:13,730
Now one last quick thing that I just noticed I apologize.

35
00:02:13,730 --> 00:02:19,250
We no longer have the Awake word on this inner function right here so we can remove the async and we

36
00:02:19,250 --> 00:02:24,890
actually need to move that async to the arrow function down here like so because the botia down here

37
00:02:24,890 --> 00:02:26,860
is the one that actually contains a weight now.

38
00:02:27,090 --> 00:02:27,300
OK.

39
00:02:27,320 --> 00:02:28,370
So this should be good.

40
00:02:28,460 --> 00:02:32,510
So let's save this now a flip back over.

41
00:02:32,760 --> 00:02:38,670
We can refresh the page and now will see that we only attempt to fetch each user exactly on time because

42
00:02:38,670 --> 00:02:44,080
we have now correctly minimalized the Fettes user ID or underscore fecche users function.

43
00:02:44,080 --> 00:02:49,420
So this thing can only be called exactly one time and we only memorize it one time as well as opposed

44
00:02:49,420 --> 00:02:54,980
to memorizing or redeclare in the function and memorizing it every time that we call our action creator.

45
00:02:54,990 --> 00:02:58,450
Now there is one last little refactor that you could do inside of your totally optional.

46
00:02:58,450 --> 00:03:01,330
If you do this refactor things start to look really crazy.

47
00:03:01,330 --> 00:03:03,770
But nonetheless it is optional.

48
00:03:03,940 --> 00:03:09,960
So if we wanted to we could remove this curly brace right here we could remove the curly brace and semi-colon

49
00:03:10,060 --> 00:03:10,740
right there.

50
00:03:10,930 --> 00:03:13,690
And then we could add new line that entire expression.

51
00:03:13,780 --> 00:03:17,040
And so we would end up with something that looks like this right here.

52
00:03:17,040 --> 00:03:24,070
So now we've got a function that returns a function that calls underscore fecche user with the ID and

53
00:03:24,070 --> 00:03:24,930
dispatch.

54
00:03:25,120 --> 00:03:30,220
So like I said this is a solution that involves just changing a couple lines of code but it has some

55
00:03:30,310 --> 00:03:34,930
really crazy syntax like when you look at this thing right here in the future you're probably going

56
00:03:34,930 --> 00:03:39,200
to have to really really think about it for a little bit and try to understand what's going on.

57
00:03:39,220 --> 00:03:41,460
So I don't know if this is the best solution.

58
00:03:41,530 --> 00:03:45,000
I would just say that this is a solution.

59
00:03:45,140 --> 00:03:49,940
Now the one side effect to the solution that I want to mention is that if you ever want to re fetch

60
00:03:49,970 --> 00:03:56,300
a user for some reason like if you have made a change to a user or if you know that the user data has

61
00:03:56,300 --> 00:04:01,490
been updated on your API and you want to reattach it unfortunately you would not be able to do it again

62
00:04:01,490 --> 00:04:03,620
using this action creator with this solution.

63
00:04:03,620 --> 00:04:08,100
You can only fetch each user exactly one time inside of your application.

64
00:04:08,200 --> 00:04:12,950
So if you wanted to be able to reset your user you would have to essentially like declare a another

65
00:04:12,950 --> 00:04:18,000
action creator that has the same logic but just does not apply that memoization step.

66
00:04:18,290 --> 00:04:23,870
So like I said maybe not the best solution but it is a solution that fixes our problem.

67
00:04:23,870 --> 00:04:24,150
All right.

68
00:04:24,170 --> 00:04:26,040
Let's take a pause right here in the next video.

69
00:04:26,060 --> 00:04:28,470
I'm going to show you a second solution to this problem.

70
00:04:28,520 --> 00:04:31,490
That's a little bit more universal I suppose.

71
00:04:31,490 --> 00:04:36,500
Or it's going to work out in more cases a little bit better because we are not having to do this memoization

72
00:04:36,500 --> 00:04:37,120
step.

73
00:04:37,310 --> 00:04:43,040
However it's going to involve changing a lot more code than what we had to do for this right here.

74
00:04:43,040 --> 00:04:46,100
So let's take a quick pause and we'll take a look at that solution in the next video.