Type State Implementation

[00:00:00]
>> David Khourshid: Okay, yeah, so let's quickly do the type state implementation. So with the type state implementation, what we want to notice is that we have things like when we're setting status to submitting, we're also setting the selected flights to null, or we're setting flight options when it is a success.

[00:00:17]
And so these are all clues that we could use a type states to really reduce the number of states that we have to set and the states that we have to manage. So we're going to, let's, you know, we have flight data over here, let's actually add the status inside here as well.

[00:00:39]
So this is going to be idle. And so now we could actually define our type states. So we could have type flight data which includes all of this. So we have our destination, departure, arrival and passengers. But we're also going to be adding, with an intersection type, we're going to be adding our different type states that we could be in.

[00:01:03]
So just for speed, I'm using Claude. But we have for example, idle submitting, error and success. So we know in success we have our flight options defined and we know that in error we might have an error message over here and that when we're idle, our flight options are actually null.

[00:01:26]
And same thing for submitting, our flight options are null. So we don't have those in there. And so this is a pattern that if you have common data, then you might want to use an intersection type for that. So you would have all of your common properties in one object intersecting with your discriminated union at the bottom.

[00:01:50]
And so that way like, you know, we have flight options null and you could even. In fact, it is good practice to put everything up front here. So we have flight options and we have an error. So we're representing all the possible values that it could be here, but we're limiting that when we actually deal with each of the type states down here.

[00:02:15]
And so now when we have something, for example set status submitting, we can instead set the flight data to have the status be submitting the selected flight be null. And of course the error is going to disappear too. And then we no longer need those variables. So same thing for when we actually have a success.

[00:02:37]
We could reduce these two into a single set flight data with the status of success and the flight options that we have.
>> James Halliday: Maybe you need to actually type the use state up there for the set flight data. It's just according to the object you pass in right here.

[00:02:57]
>> David Khourshid: You're right. Okay, so [LAUGH] we have that typeState, but we didn't actually have our different options over there. Okay so now it works. Thank you, we were just missing the type, that's all, so okay. Wow, that was an embarrassing mistake, but hey, type save the day over there.

[00:03:18]
So yeah that's an example of how you could use discriminated unions and type states and also combine related data to reduce the number of use dates and also just keep your data more consistent. Any questions?
>> Male Speaker 3: Just James saying typescript can be tricky sometimes is the understatement of the century [LAUGH].

[00:03:45]
>> David Khourshid: It helps you out but it also can cost a lot of time but it's more helpful than it is a burden, so I do appreciate it.
>> Male Speaker 3: Then we could have error that even caught the fact that we didn't include error there.
>> David Khourshid: Exactly. So that's what I mean about just keeping your data consistent and so if we happen to have flight options here it's going to yell at us and say wait a minute this should not be possible so.