Skip to content

Commit

Permalink
feat(query-client): support for passing custom QueryClient instance v…
Browse files Browse the repository at this point in the history
…ia function (#208)
  • Loading branch information
radekdob authored Feb 13, 2025
1 parent 4560f4c commit 59eca0d
Show file tree
Hide file tree
Showing 3 changed files with 61 additions and 5 deletions.
19 changes: 18 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,8 +59,25 @@ export class TodosService {
#queryClient = injectQueryClient();
}
```
or provide `QueryClient` [instance](https://tanstack.com/query/v5/docs/reference/QueryClient) manually

> The function should run inside an injection context
```ts
import { provideQueryClient } from '@ngneat/query';
import { QueryClient } from '@tanstack/query-core';

provideQueryClient(() => new QueryClient())
```

and then use with

```ts
import { injectQueryClient } from '@ngneat/query';

...
#queryClient = injectQueryClient();
```

> Functions should run inside an injection context
### Query

Expand Down
7 changes: 5 additions & 2 deletions query/src/lib/query-client.ts
Original file line number Diff line number Diff line change
Expand Up @@ -60,10 +60,13 @@ const QueryClientService = new InjectionToken<QueryClient>(
);

/** @public */
export function provideQueryClient(queryClient: QueryClient): Provider {
export function provideQueryClient(queryClientOrFactory: _QueryClient | (() => _QueryClient)): Provider {
return {
provide: QueryClientToken,
useValue: queryClient,
useFactory:
typeof queryClientOrFactory === 'function'
? queryClientOrFactory
: () => queryClientOrFactory,
};
}

Expand Down
40 changes: 38 additions & 2 deletions query/src/tests/query-client.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { TestBed, fakeAsync, flush, tick } from '@angular/core/testing';
import { InfiniteData } from '@tanstack/query-core';
import { InfiniteData, QueryClient as _QueryClient } from '@tanstack/query-core';
import { expectTypeOf } from 'expect-type';
import { QueryClient, injectQueryClient } from '../lib/query-client';
import { QueryClient, injectQueryClient, provideQueryClient } from '../lib/query-client';
import {
Posts,
PostsService,
Expand Down Expand Up @@ -135,3 +135,39 @@ describe('QueryClient', () => {
>();
});
});


describe('Custom QueryClient', () => {
let queryClient: QueryClient;
let customQueryClientInstance: _QueryClient;

it('should use custom query client', fakeAsync(() => {
customQueryClientInstance = new _QueryClient();
TestBed.configureTestingModule({
providers: [provideQueryClient(customQueryClientInstance)],
});
TestBed.runInInjectionContext(() => {
queryClient = injectQueryClient();
});

expect(queryClient).toBe(customQueryClientInstance);
}));

it('should use custom query client provided from function', fakeAsync(() => {
TestBed.configureTestingModule({
providers: [
provideQueryClient(() => {
customQueryClientInstance = new _QueryClient();
return customQueryClientInstance;
}),
],
});
TestBed.runInInjectionContext(() => {
queryClient = injectQueryClient();
});

expect(queryClient).toBe(customQueryClientInstance);
}));

});

0 comments on commit 59eca0d

Please sign in to comment.