0

When getting results from the server, usually I'm adding extra fields to the object in my Apollo Angular client, for convenience usage later on, like this:

this.apollo.watchQuery<any>({query: gql`...`})
.valueChanges.pipe(
  map(result => {
    result.data.sites.forEach(s => {
      s.fullName = `${s.parent.displayName} - {s.displayName}`;
    }
    return result;
});

This used to work fine with Apollo client 1. Now I'm upgrading my code to Apollo client 2 and the latest apollo-cache-inmemory and I'm getting an error when trying to do the above: TypeError: Cannot add property fullName, object is not extensible

I realize I can make deep copies of the objects and that would resolve, but why is this change? Is there a way to make Apollo return an extensible object like before? I have many usages of queries in my code and in almost all of them I'm adding fields to the result like the above, so it'll be a fairly big code change. Also, deep copy will have a slight performance issue.

Thanks!

1 Answers1

0

Do not mutate the result, just update the fullName in immutable way.

Partha
  • 96
  • 6