All language subtitles for 017 Deleting Ingredients_en

Sort of filters working, let's go back to the ingredients component, which is where we, for example,

add new ingredients.

We also have a logic for removing ingredients.

But right now, we're not doing this in Firebrace.

We're only doing it locally, which, of course, means that, yeah, it's gone here.

But if we reload.

It's back now to the elite ingredients on the surface.

Well, we, of course, need to send in a request here, so let's copy that fetch request and move it

in here and to remove ingredient handler there, we send a delete request, which is understood by Firebase

to delete data.

You don't add a body here, don't need to add headers.

But what you need to do is you need to specify in the you are well which item you want to delete.

Therefore, I'll use tactics here so that I can use storing interpolation that string, because now

after ingredients before Dodgson, I'll add another segment.

So another slash and then string interpolation with thylacine and curly braces.

And here I'll simply add the ingredient ID and that's the good thing.

The ingredient is in the end, what we get when we click on the item here anyways in ingredients on

Firebase, if we have a look there in the ingredients, ingredient IDs are the next notes we have there.

So we target one of these nodes with this delete request and then this entry will simply be deleted.

So that should be all we need here in the then block, we get the response.

I don't really care about the response here, Bill, but I only want to update my ingredients here in

Dubai once this response is there, which is why I moved that updating logic into this then block.

Let's give it a try.

All the ingredients are there in firebases, let's click on apples.

You see, it took a bit longer for them to be removed, but they're now also removed here.

We only have bananas here.

Therefore, if I reload, we, of course, only load the bananas.

Obviously, I can add my apples.

And they're back here as well, but now the leading works the way it should, but that's, of course,

nothing too fancy or new.

It's also not using react hooks.

But what we can handle with hooks now is whenever we wait for something on to complete, whenever we

wait for data to be added or due to be deleted, we could show a little loading spinner.

And on the same hand, if we have an error, we might show that error model, which I prepared, that

these are the next things will tackle.