In my GraphQL API I have defined a course
fragment with an array property lessons
.
Initially it only had lessons of type TextLesson
. Later we added lessons of type VideoLesson
as well.
fragment TextLessonFields on TextLesson {
title
body
}
#fragment VideoLessonFields on VideoLesson {
# title
# videoUrl
#}
fragment CourseFields on Course {
lessons {
... on TextLesson {
...TextLessonFields
}
#... on VideoLesson { # not present on older app versions, but data in backend db has videos now
# ...VideoLessonFields
#}
}
}
query GetCourse {
Course(id: "fake-course-id") {
...CourseFields
}
}
Unfortunately now when older clients fetch the course the lessons property ends up with empty objects in the response like this:
{
data: {
Course: {
lessons: [
{
__typename: "TextLesson"
title: "text lesson",
body: "Lorem ipsum",
},
{} # Video lesson ends up being downloaded as empty object. Could it just somehow not add this empty object in the response?
]
}
}
}
Is there anyway to completely ignore the objects of different type in the lessons array and only fetch the ones known to the client at the time?
We are using React Native with Apollo client currently:
"@apollo/client": "3.8.6",
"graphql": "16.8.1",
Our client initialisation code:
import { ApolloClient, InMemoryCache } from "@apollo/client";
import Config from "services/config";
export const sanityApolloClient = new ApolloClient({
uri: Config.GRAPHQL_URL,
cache: new InMemoryCache(),
headers: {
Authorization: `Bearer ${Config.GRAPHQL_API_TOKEN}`,
},
defaultOptions: {
watchQuery: {
// First use cache, but also fetch new content from network.
fetchPolicy: "cache-and-network",
},
},
});