1 00:00:00,170 --> 00:00:04,130 So now we want to be able to delete users and this should be pretty easy. 2 00:00:04,130 --> 00:00:06,200 We already have the back end all set. 3 00:00:06,200 --> 00:00:14,720 So let's first go to our slice, our user user API slice and then under get users, we're going to add 4 00:00:14,750 --> 00:00:16,309 delete user. 5 00:00:17,700 --> 00:00:25,470 Which is going to be a mutation and we're going to have a query with the ID, although I want to call 6 00:00:25,470 --> 00:00:33,150 it user, we'll say user sorry, user ID, I've been writing Python lately. 7 00:00:33,240 --> 00:00:35,310 We use underscores quite a bit. 8 00:00:35,880 --> 00:00:36,240 All right. 9 00:00:36,240 --> 00:00:42,780 So inside here we're going to have our URL, which is just going to be the user's URL, slash the user 10 00:00:42,780 --> 00:00:45,960 ID, and then the method is going to be delete. 11 00:00:45,960 --> 00:00:47,400 And then we're just going to. 12 00:00:48,360 --> 00:00:49,500 Use. 13 00:00:50,880 --> 00:00:53,460 Use our delete mutation. 14 00:00:54,620 --> 00:01:01,880 And then let's go over to our user list and we're going to bring in up here, in addition to the get 15 00:01:01,910 --> 00:01:04,610 users query, we want the use. 16 00:01:05,360 --> 00:01:07,670 Delete user mutation. 17 00:01:07,670 --> 00:01:10,730 And then I'm also going to bring in toast from. 18 00:01:12,050 --> 00:01:14,200 From Reactos to Fi. 19 00:01:16,260 --> 00:01:20,130 And let's see, we're going to initialize this. 20 00:01:20,130 --> 00:01:21,780 Let's go right here. 21 00:01:22,960 --> 00:01:27,580 And we're going to get delete user and then is loading. 22 00:01:27,940 --> 00:01:29,890 Actually we don't even really need. 23 00:01:31,180 --> 00:01:32,190 Well, yeah, I guess we can. 24 00:01:32,200 --> 00:01:34,450 We'll just rename it to loading. 25 00:01:36,520 --> 00:01:38,080 Loading, delete. 26 00:01:38,650 --> 00:01:39,100 Okay. 27 00:01:39,100 --> 00:01:40,210 And then let's see. 28 00:01:40,210 --> 00:01:40,930 We're going to. 29 00:01:42,120 --> 00:01:43,230 Add that. 30 00:01:43,980 --> 00:01:45,990 Where should we put this loading? 31 00:01:48,110 --> 00:01:50,990 What do they put it in the product list? 32 00:01:53,790 --> 00:01:55,420 Above is loading. 33 00:01:55,440 --> 00:01:55,830 All right. 34 00:01:55,830 --> 00:01:57,090 So we'll just kind of. 35 00:01:57,930 --> 00:01:59,580 Do what we did here. 36 00:02:04,570 --> 00:02:05,530 Did I bring Loader in? 37 00:02:05,560 --> 00:02:06,020 Yeah, I did. 38 00:02:06,040 --> 00:02:09,130 All right, so now we need to delete. 39 00:02:09,370 --> 00:02:10,690 We have our delete handler. 40 00:02:10,690 --> 00:02:13,480 We just need to add the functionality in here. 41 00:02:13,480 --> 00:02:15,520 So let's do a quick confirm. 42 00:02:16,640 --> 00:02:19,700 So if window Dot confirm. 43 00:02:22,910 --> 00:02:24,140 Are you sure? 44 00:02:27,260 --> 00:02:32,000 And if they're sure, then we're going to try. 45 00:02:35,830 --> 00:02:41,620 We're going to try and then we want to await on the delete user. 46 00:02:44,190 --> 00:02:46,950 Which we need to make this asynchronous. 47 00:02:47,650 --> 00:02:49,330 Oops, let's delete handler here. 48 00:02:49,330 --> 00:02:51,070 Let's make this async. 49 00:02:51,930 --> 00:02:52,620 Okay. 50 00:02:52,620 --> 00:02:56,280 And then we're going to delete user and then pass in the ID. 51 00:02:57,380 --> 00:03:00,080 And then we're going to just refetch. 52 00:03:01,280 --> 00:03:04,670 And then let's do a toast down here. 53 00:03:04,780 --> 00:03:05,780 Dot error. 54 00:03:07,590 --> 00:03:09,660 And let's do. 55 00:03:10,730 --> 00:03:11,640 What do we want here? 56 00:03:11,660 --> 00:03:14,540 Error dot data. 57 00:03:15,760 --> 00:03:17,530 Dot message. 58 00:03:21,950 --> 00:03:22,490 Our. 59 00:03:23,850 --> 00:03:24,390 All right. 60 00:03:26,040 --> 00:03:28,980 And we can do a success toast if you want. 61 00:03:29,190 --> 00:03:30,030 Like that. 62 00:03:31,040 --> 00:03:32,210 So let's try it out. 63 00:03:32,210 --> 00:03:36,890 We're going to go back over here and we are, of course, logged in as an admin. 64 00:03:36,890 --> 00:03:42,710 So if I don't want Steve Rogers here anymore, let's click Delete and there we go. 65 00:03:42,740 --> 00:03:43,910 User deleted. 66 00:03:44,930 --> 00:03:46,280 So now. 67 00:03:46,970 --> 00:03:50,420 In the next video, I want to be able to update a user. 68 00:03:50,420 --> 00:03:56,960 So we're going to actually create a new screen called the User edit screen, because if we click on 69 00:03:56,960 --> 00:04:02,210 this edit, it's going to take us to a page where we can see the user data, but it'll be in a form 70 00:04:02,210 --> 00:04:04,070 so that if we want to update it, we can.