This course has been updated! We now recommend you take the Advanced GraphQL, v2 course.
Transcript from the "Unions" Lesson
[00:00:00]
>> Scott Moss: Next thing is unions, which literally is the same thing as interface. The only difference is that a union, the types that are grouped together are expected to not have any fields in common. So a good example of that would be something like Search, where if you had a global search in your app, that you can just start typing and it would return all different types of things?
[00:00:26] That's where that would come in. Whereas none of these things probably have, the only even common property is ID, that's it. Everything else is so different. That is the only difference between a union and an interface, so let's just walk through that syntax just to show you want I'm talking about.
[00:00:43] So let's make a,
>> Scott Moss: Yeah, we got a person here and we've got animals. So this would be a good example. So let's make a union,
>> Scott Moss: For our search result. And we want to be able to search for cats, dogs, and people. Cats and dogs are similar, we know that cuz they have an interface, but a person is not so similar to an animal.
[00:01:09] Just by looking at our type, a person as an ID, a name, an age, and a favorite food. A dog or cat has neither of those, so there's no similarities. But we still want to be able to have an array of either one of those. And that's where Union comes in.
[00:01:23] How do we describe to GraphQL that we want one or many of these different types when they have nothing in common? That's a union. So what we'll do is we'll use the keyword union here. We'll give it a name, I'll call it Search result.
>> Scott Moss: Equals, and then what you do here is you start describing the types you want them to equal.
[00:01:44] So, in this case I want a person type. And then you use this character here, or this pipe, to say that you have another type that you want to put here. You might think I can just do Animal to do a shortcut for dog and cat, but you can't because the interface doesn't know about anything that implements it.
[00:02:02] It's just an interface. And an interface is not a type. It's an interface. You can only put types here, non-scholar types. So I also could not put string here, or ID or float or boolean. I couldn't do that. I could only put custom types here. This is the only thing you can put here.
[00:02:19] So in that case I can only put dog, and I can only put cat.
>> Scott Moss: So now I have a union called Search result that allows me to return a person, a dog or a cat. Everybody following me so far? All right, so the next thing is let's make a query for that, we'll call it Search.
[00:02:43]
>> Scott Moss: And it's not gonna take arguments, it's gonna take back an array of search results.
>> Scott Moss: Let's just go mock this out right quick.
>> Scott Moss: So, the first thing is very similar to an interface, we need to tell GraphQL how to resolve these types from the union. So what we will do is make a top level look called Search Result cuz that's the name of the union.
[00:03:12]
>> Scott Moss: Open this up over here. There we go. So Search Result, and then just like for the interface we need a resolve type here, so that's what we'll do. We'll resolve type, we'll get back a search result. We don't know what this is yet, all we know is it's some entity.
[00:03:31] So based on,
>> Scott Moss: A dog, a cat and a person, how could we tell which one's which? We know the difference between a dog and a cat is a type, but what's the difference between a dog and a cat and a person?
>> Speaker 2: A person doesn't have a type.
[00:03:48]
>> Scott Moss: Yeah, a person doesn't have a type, there we go. So let's do that. So what we can do is we can say if .searchresult.type, we know this is a person. So this return person, with a string. That's the name of the type. Else we'll literally do this, I could just copy this,
[00:04:12]
>> Scott Moss: And change that to Search Result.
>> Scott Moss: Everybody following me there? So if it's not a type it's a person, if it does have a type and it's cat it's a cat, if it's a dog, it's a dog.
>> Scott Moss: So next thing is let's just write the resolver for the search query.
[00:04:36] So we'll slide up here underneath Query and we'll type in Search here. And let's just mock this out and return an array of at least one of each of those things. So we've got a person that's gonna cover this. Boom. We got a cat dog here.
>> Scott Moss: And then get rid of and I'll make another for cat.
[00:05:09]
>> Scott Moss: Cat's only have two lives left, dangerous cat. All right, so now we've got that. We could create this, so let's save it. Let's start this thing.
>> Scott Moss: And what we are gonna do is you guys go ahead and search. It doesn't take any arguments, and then if we get back a person, let's get the name, and the ID, and the faveFood.
[00:05:38] If we get back a cat, let's get the lives. And if we get back a dog, let's get back to personality. And we run that. And you can see when we get back an array of three things. All of which are different types. A person, a cat and a dog.
[00:06:01] Yes?
>> Speaker 2: Can you do a fragment on the interface to get the type?
>> Scott Moss: Can you do a fragment on an interface to get the type? So,
>> Scott Moss: I see what you're saying. In the query.
>> Speaker 2: Yeah.
>> Scott Moss: Got you. Yes, so if I wanted to get the type of both cat and dog, could I do an interface here?
[00:06:22] Sorry, can I do a fragment here?
>> Speaker 2: As a separate fragment for like, fragment on animal type?
>> Scott Moss: No, I don't think you can do fragments on interfaces. I've actually never tried this, let's try it. I'm down on trying new things. Fragment, Animal type on,
>> Scott Moss: Let me auto complete it on animal type.
[00:06:47] So let's try that.
>> Scott Moss: And we'll type, so far so good. Yeah, that works. It's pretty dope. I would imagine, yeah, they would have to do that cuz there'd be no other way around it. Cuz if that means you would have to make a fragment for each fragment, if they didn't let you do that.
[00:07:06] You have to say fragment dogType on Dog. Fragment dogType or catType on Cat, and they both would have the same fields. So yeah, that would be really ridiculous if that was the case.