import { Injector, Signal } from '@angular/core'; import { QueryFilters } from '@tanstack/query-core'; export interface InjectIsFetchingOptions { /** * The `Injector` in which to create the isFetching signal. * * If this is not provided, the current injection context will be used instead (via `inject`). */ injector?: Injector; } /** * Injects a signal that tracks the number of queries that your application is loading or fetching in the * background (useful for app-wide loading indicators). * * @param filters - The {@link QueryFilters} to narrow down the matched queries. * @param options - Additional configuration * @returns A `Signal` with the number of queries that your application is currently loading or fetching in * the background. * * @example * ```angular-ts * @Component({ * selector: 'posts-fetching-indicator', * template: ` * @if (isFetchingPosts()) { * Refreshing posts... * } * `, * }) * export class PostsFetchingIndicator { * // How many queries matching the posts prefix are fetching? * readonly isFetchingPosts = injectIsFetching({ queryKey: ['posts'] }) * } * ``` * * @example * A global loading indicator for any query fetching in the background, not just the ones on screen: * ```angular-ts * @Component({ * selector: 'global-loading-indicator', * template: ` * @if (isFetching()) { *