Splitting query into multiple observables

[daramasala]

Hi,
We are converting our application to graphql and Apollo.

I noticed a pattern starting to emerge in our code and I wanted to hear what other people think.

Seems like a lot of times we make a query and then split the payload into multiple observables to pass as input parameters into presentational components.

The way we do it now feels awkward to me.

Let's say we have a query that returns a payload of the form {name: string; color: string; } and we would like to split it into 2 observables to pass into child components. Then we usually do this:

query$ = this.apollo.watchQuery(query).valueChanges;

this.name$ = new Subject();
this.color$ = new Subject();
query$.subscribe(p => {
  this.name$.next(p.name);
  this.color$.next(p.color);
});

I was thinking of changing it into:

this.name$ = query$.pipe(map(p => p.name));
this.name$ = query$.pipe(map(p => p.color));

But will it work as I expect it?

1. Do I need to use share() or something similar on the query in order to prevent multiple queries or does Apollo takes care of this?
2. Are queries hot or cold observables?
3. Is there a better approach to handle passing query payload into multiple small components?