1
00:00:01,260 --> 00:00:02,420
All right to wrap everything up.

2
00:00:02,430 --> 00:00:06,980
We just have to add in our case to handle this new action type of edit blog post.

3
00:00:07,730 --> 00:00:12,840
So inside my reducer right above the delete blog post hype all adding a new case statement in watch

4
00:00:12,840 --> 00:00:19,150
for edit underscore why post so then inside of here like we just said we need to take a look at this

5
00:00:19,210 --> 00:00:24,640
action object's payload property inside that payload property is the idea of the blog post so we want

6
00:00:24,640 --> 00:00:30,610
to update so then we'll go through our state array we're going to make a change to the given blog post

7
00:00:30,970 --> 00:00:36,460
and then return a brand new array with all of our existing blog posts and the brand new edited one as

8
00:00:36,460 --> 00:00:37,050
well.

9
00:00:37,820 --> 00:00:41,520
So to do so I'm going to add in a return.

10
00:00:41,660 --> 00:00:44,090
We're then going to do a state dot map.

11
00:00:44,720 --> 00:00:47,370
So we're going to map through all of our different blog posts.

12
00:00:47,600 --> 00:00:52,880
Once we find the one with the correct I.D. we will return the blog post inside of our action dot payload

13
00:00:52,880 --> 00:00:56,390
property as opposed to the blog post we are iterating over.

14
00:00:56,480 --> 00:00:59,850
Let's write out some code and you'll see what we're doing really quickly.

15
00:00:59,930 --> 00:01:06,460
So inside my state dot map function I'm going to receive each of the old blog posts one by one so then

16
00:01:06,460 --> 00:01:12,400
inside of here it will say if the blog posts we are currently iterating over if it's I.D. is equal to

17
00:01:12,820 --> 00:01:15,730
action dot payload I.D..

18
00:01:15,730 --> 00:01:20,560
So if we just found the right blog post then we do not want to return the old blog post.

19
00:01:20,560 --> 00:01:25,420
Instead we want to return the edited one which is available as action not payload.

20
00:01:25,570 --> 00:01:27,460
So I will return.

21
00:01:27,460 --> 00:01:28,380
Action Dot.

22
00:01:28,420 --> 00:01:33,930
Payload otherwise we will return the existing blog post.

23
00:01:33,930 --> 00:01:42,260
So in this case I will return blog post like so.

24
00:01:42,470 --> 00:01:46,280
Now if we wanted to we could definitely use a Turner expression to abbreviate this code just a little

25
00:01:46,280 --> 00:01:46,670
bit.

26
00:01:46,670 --> 00:01:48,230
This is a classic classic.

27
00:01:48,230 --> 00:01:53,810
If else statement right here so we could abbreviate this I can write out a Turner expression right above

28
00:01:53,840 --> 00:01:56,830
and then eventually delete the return statement or the if statement.

29
00:01:57,020 --> 00:02:07,950
So I will say return blog post dot I.D. equal to action payload I.D. and we'll put in our question mark

30
00:02:08,790 --> 00:02:14,280
on the next line down Just make sure this is a little bit legible and we'll say action dot payload and

31
00:02:14,280 --> 00:02:19,640
then otherwise indicated by the colon blog post.

32
00:02:19,680 --> 00:02:26,690
So now we can delete that entire if statement and that's a little bit more concise okay.

33
00:02:26,740 --> 00:02:28,160
Let's save this.

34
00:02:28,200 --> 00:02:32,210
You'll notice my code jumps as usual again that's from my code for matter what you see on the screen

35
00:02:32,210 --> 00:02:35,460
is 100 percent equivalent to what I had just a moment ago.

36
00:02:35,550 --> 00:02:38,510
So now I can save this file I'll flip back over.

37
00:02:38,520 --> 00:02:41,010
I'm going to take a look at test post one right here.

38
00:02:41,010 --> 00:02:44,090
I'll tap on edit and I'll make some changes.

39
00:02:44,220 --> 00:02:52,760
So how about edited post 1 and edited content for post 1.

40
00:02:52,870 --> 00:02:54,290
I'll then save that change.

41
00:02:55,230 --> 00:02:58,990
Now when I type save right here we're not currently doing any navigation which is totally fine.

42
00:02:59,080 --> 00:03:05,650
So we need to manually navigate back to our list of blog posts so I'll hit back back and I see the edited

43
00:03:05,650 --> 00:03:06,430
title right there.

44
00:03:06,430 --> 00:03:10,070
So clearly we have successfully updated our blog post.

45
00:03:10,210 --> 00:03:12,800
Let's make sure we can still create a blog post as well.

46
00:03:13,000 --> 00:03:20,620
So I will hit that add button and then blog 2 and 2 I'll save and yep that's created as well.

47
00:03:20,830 --> 00:03:22,150
So this looks pretty good.

48
00:03:22,190 --> 00:03:26,530
So now I think the very last thing we have to do here is make sure that after we successfully edit a

49
00:03:26,530 --> 00:03:31,720
post we either navigate the user back to the previous screen right here or we should just send them

50
00:03:31,720 --> 00:03:34,840
directly back to the index screen one or the other.

51
00:03:34,840 --> 00:03:37,200
So let's figure out how to tackle that in the next video.