1
00:00:02,500 --> 00:00:05,420
So let's continue with deleting products

2
00:00:05,420 --> 00:00:16,000
maybe. For this I got my product delete handler in here and I'll later remove all that code down there,

3
00:00:16,020 --> 00:00:20,620
for now what I'll do is I'll again get access to mongodb with the same code I used in fetch

4
00:00:20,620 --> 00:00:21,430
data

5
00:00:21,670 --> 00:00:26,110
and actually I can also copy that code here where I reach out to the products collection because that

6
00:00:26,110 --> 00:00:26,950
will be the same

7
00:00:26,950 --> 00:00:31,130
and yes you could outsource this into a separate function therefore. Here,

8
00:00:31,210 --> 00:00:34,750
I will then call delete one because I want to delete one product

9
00:00:34,810 --> 00:00:40,140
and of course I need to pass my filter just as you always did it, just as you learned in this course.

10
00:00:40,150 --> 00:00:40,990
So I want to delete

11
00:00:40,990 --> 00:00:45,320
one product which I identify by ID.

12
00:00:45,580 --> 00:00:51,080
So I will delete one product where the ID is equal to the Product ID

13
00:00:51,100 --> 00:00:59,810
I get as an argument here. Now then I can chain then and catch and I can basically copy the code I have

14
00:00:59,810 --> 00:01:00,490
down there,

15
00:01:00,500 --> 00:01:05,990
so I'll copy the function I had for catch and move that into my catch block up there and well basically

16
00:01:05,990 --> 00:01:09,860
I can also use the entire then block and reuse it up there.

17
00:01:09,860 --> 00:01:12,740
So with that, this should delete my items,

18
00:01:12,740 --> 00:01:17,990
I can now get rid of that old code where we used axios and only have that new code where I used

19
00:01:17,990 --> 00:01:18,840
mongodb stitch.

20
00:01:19,140 --> 00:01:25,410
If we now save that, the page gets reloaded and let's now try to delete the working MacBook.

21
00:01:25,710 --> 00:01:27,010
If I click on delete here,

22
00:01:27,330 --> 00:01:29,650
you see I get back a deleted count of zero and

23
00:01:29,690 --> 00:01:32,120
do you have an idea of what's wrong here?

24
00:01:32,820 --> 00:01:40,470
Well the problem is that I have an ID which is a string and I'm looking for ID in my database where

25
00:01:40,740 --> 00:01:42,930
this equals the string I get here

26
00:01:43,050 --> 00:01:45,720
but the ID in the database is an object ID.

27
00:01:45,870 --> 00:01:51,210
So we need to create an object id and we can do that in the browser with the help of a special package

28
00:01:51,360 --> 00:01:57,160
which we can install with npm install --save, whoops, --save bson,

29
00:01:57,210 --> 00:02:02,470
this is a package that allows us to create bson types so these special types mongodb works

30
00:02:02,470 --> 00:02:08,550
with in the browser and we can create an objectid object in the browser therefore.

31
00:02:08,550 --> 00:02:12,290
So with that installed, we can get rid of axios for one,

32
00:02:12,450 --> 00:02:21,450
we can now import bson from that bson package here, we can use bson down there in our delete

33
00:02:21,450 --> 00:02:24,440
handler where I am looking for the product ID,

34
00:02:24,690 --> 00:02:31,660
we can use bson. and then simply object ID

35
00:02:31,910 --> 00:02:36,790
and we have to instantiate this.

36
00:02:36,990 --> 00:02:42,000
Now with that, we're creating a new objectId here and we're passing our string there.

37
00:02:42,000 --> 00:02:48,420
Now if we save this, that won't suffice, we also need to restart react, the react server because we installed a new

38
00:02:48,420 --> 00:02:49,020
package.

39
00:02:49,170 --> 00:02:54,560
So now once this reloaded here, we can try deleting again

40
00:02:55,440 --> 00:02:57,290
and now you see it deleted one product.

41
00:02:57,300 --> 00:03:00,000
So now this works thanks to us using bson.