Can access to typed data in interceptors

[87xie]

Describe the feature

This feature request aims to enhance the usability of interceptors by allowing seamless access to typed data within the interceptor functions.

Expected usage:

ofetch<{ id: string; }>("/api", {
  onResponse({ response }) {
    // Auto complete working with "response._data.id"
    // or the different property name such as "response.$data.id"
  },
})

Additional information

• Would you be willing to help implement this feature?

[enkot]

It would be great to type the response data!
But it becomes not so clear how to type it if ofetch will support:

• interceptors arrays feat: support interceptors arrays #353

AFAIK the only way to type chainable functions array is to specify finite number of function overloads, how RxJS does it with pipe - https://github.com/ReactiveX/rxjs/blob/master/packages/rxjs/src/internal/util/pipe.ts
It looks ugly, but it works.

[87xie]

Maybe we can consider separating the different context types based on situation, for example:

interface FetchOptions<
  R extends ResponseType = ResponseType,
  T = any,
> extends Omit<RequestInit, "body"> {
  // ...
  onRequestError?(
    context: Pick<FetchContext, 'options' | 'request'> & {
      response: undefined;
      error: Error;
    }
  ): Promise<void> | void;
  onResponse?(
    context: Pick<FetchContext, 'options' | 'request'> & {
      response: MappedResponseType<R, T>;
      error: undefined;
    }
  ): Promise<void> | void;
  // ...
}

ofetch<{ id: string; }>("api", {
  onRequestError({ response, error }) {
    // the error type will be Error
    // the response type will be undefined
  },
  onResponse({ response, error }) {
    // the error type will be undefined
    // the response type will be "{ id: string; }"
  },
})