Return type for functions returning query observables

[roel-de-jong-iqvia]

Hi there!

First, thank you @NetanelBasal for creating this and making available the powers of Tanstack Query available to Angular developers!

Question

Our coding standards require explicit return types.

Let's say I want to type this function

getLastKnownDataUpdate$(projectId: string) { 
        return this.useQuery(DataValidationService.LastUpdateQueryKey, () => {
            return this.http
                .get<LastKnownDataUpdateDTO>(
                    `${this.configService.serverApiUrl}/project/${projectId}/cdc/validation/last-update`
                )
                .pipe(
                    map(
                        (dto): LastKnownDataUpdate => ({
                            lastDataUpdate: this.parseDate(dto.lastDataUpdate),
                            lastManualUpdate: this.parseDate(dto.lastManualUpdate)
                        })
                    )
                );
        });
    }

Given that this.useQuery returns a NgQueryObserverReturnType, I typed the return type as NgQueryObserverReturnType<LastKnownDataUpdate>.

Unfortunately, this gives the following typing error

Type 'QueryObserverOptions<LastKnownDataUpdate, unknown, LastKnownDataUpdate, string[], QueryKey>' is not assignable to type 'QueryObserverOptions<LastKnownDataUpdate, unknown, LastKnownDataUpdate, LastKnownDataUpdate, QueryKey>'.
        Type 'string[]' is missing the following properties from type 'LastKnownDataUpdate': lastDataUpdate, lastManualUpdate

Am I doing something wrong?

string[] is the type of my query key.
From query.d.ts I gather that the TQueryKey_2 generic argument is forwarded as the second-last argument to NgQueryObserverReturnType, which corresponds to the parameter TQueryData 🤔.

[NetanelBasal]

export type ObservableQueryResult<T> = Observable<QueryObserverResult<T>>;

[peterhe2000]

@roel-de-jong-iqvia, i am also looking for return type since our coding standard is similar.
May i know what is the return type you end up return? Am i doing something wrong below since it is not compiling?

TS2322: Type 'Observable<QueryObserverResult<{ users: User[]; }, unknown>>' is not assignable to type 'Observable<QueryObserverResult<User[], unknown>>'.   Type 'QueryObserverResult<{ users: User[]; }, unknown>' is not assignable to type 'QueryObserverResult<User[], unknown>'.     Type 'QueryObserverRefetchErrorResult<{ users: User[]; }, unknown>' is not assignable to type 'QueryObserverResult<User[], unknown>'.       Type 'QueryObserverRefetchErrorResult<{ users: User[]; }, unknown>' is not assignable to type 'QueryObserverRefetchErrorResult<User[], unknown>'.

public getUsers(): Observable<QueryObserverResult<User[], unknown>> {
    return this.useQuery(['users'], () => {
      return this.http.get<{ users: User[] }>(url);
    }).result$;
  }

[peterhe2000]

Ah got it. This works.

 public getUsers(): Observable<QueryObserverResult<User[]>> {
    let url = `${this.baseUrl}users`
    return this.useQuery(['users'], () => {
      return this.http.get<User[]>(url);
    }).result$;
  }