00:00 So let's get started with our use function. Use, this is a generic, so we're going to take the value, but that value is going to be derived from the promise itself, and then we're going to return the value itself. So that'll be pretty interesting. So the couple of things that we want to check first,

00:19 if it's already been fulfilled, then let's just return the value. So if use promise, oh, right, we actually need to get the use promise first. So here we have our promise, but it's not going to have a status on it yet. So we're going to say our use promise is a promise as a use promise.

00:37 So now we can say if the use promise dot status is equal to fulfilled, then we can return the value. Oh my goodness, thank you, assistant. This is great. So we have our fulfilled, we'll return the use promise. If the status is rejected, then we'll throw the reason it was rejected.

00:57 So this would be an error. And then if the status is pending, then we'll throw the use promise itself, and then React will catch that promise, it will add its own then handler, so it knows when to re-render, and then it will re-render. And actually when that happens,

01:14 then our then handler will handle that also. So let's continue to review because you never trust AI generated code, you have to review it. I mean, maybe you're watching this in 10 years, and like, maybe you are AI. Am I AI? I don't know, that's crazy. Okay, so before we continue though, we're gonna say use promise dot status is pending.

01:32 So if it's not fulfilled, rejected, or pending already, then we're gonna initialize it to be pending. And then we're gonna add our own then handlers here, so that we can handle when there's a result or a reason that it was thrown. Now this is actually a really common pattern, and I understand why the AI wrote it this way,

01:50 but this catch is going to catch any errors thrown in here, which there shouldn't be any, and also it seems kind of wrong to me. And so I'm going to write it like this. So we have then with the success handler and the error handler, there shouldn't be any errors in here. It probably doesn't make too much of a difference,

02:09 so you feel free to keep the catch if you like it that way. And then finally, we'll throw the use promise. Now it's interesting that the AI added this directly to the promise instead of the use promise. Either way, it's literally the same variable. So I'm gonna just use the use promise so that we're only referencing the use promise everywhere down here.

02:28 But it is the same variable, so it actually doesn't make all that much of a difference. You could have written this a number of different ways. It really doesn't make a huge difference on how you actually implemented this, but the basic idea is if it's filled, you return the value. If it's rejected, you throw the reason.

02:46 If it's pending, then you throw the promise itself, and then you add the handlers if it hasn't been initialized yet and all of that. Okay, great, so that is our use hook, fancy pants. So let's come down here. We'll get rid of all of this extra stuff, everything, all of these variables.

03:06 We're gonna keep the ship promise, but we don't need these handlers on it. We can get rid of this stuff, and now our ship comes from use ship promise. Holy smokes, isn't that beautiful? I love it. And the whole thing totally works. Also, if you misspell the ship name, where's our ship name?

03:24 Here we go, Dread Yacht. Is that how you spell yacht? There we go. Sweet, so everything is working as it was before. I think that is a pretty interesting little hook that we just put together. Good job.