@drizzle-graphql-suite/query 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +276 -0
- package/index.d.ts +7 -0
- package/index.js +172 -0
- package/package.json +39 -0
- package/provider.d.ts +7 -0
- package/test-setup.d.ts +1 -0
- package/test-utils.d.ts +40 -0
- package/types.d.ts +4 -0
- package/useEntity.d.ts +2 -0
- package/useEntityInfiniteQuery.d.ts +26 -0
- package/useEntityList.d.ts +22 -0
- package/useEntityMutation.d.ts +41 -0
- package/useEntityQuery.d.ts +21 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Annexare Studio
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,276 @@
|
|
|
1
|
+
# @drizzle-graphql-suite/query
|
|
2
|
+
|
|
3
|
+
TanStack React Query hooks for `drizzle-graphql-suite/client` — type-safe data fetching with caching, pagination, and mutations.
|
|
4
|
+
|
|
5
|
+
## Setup
|
|
6
|
+
|
|
7
|
+
### Provider
|
|
8
|
+
|
|
9
|
+
Wrap your app with `<GraphQLProvider>` inside a `<QueryClientProvider>`:
|
|
10
|
+
|
|
11
|
+
```tsx
|
|
12
|
+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
|
13
|
+
import { GraphQLProvider } from 'drizzle-graphql-suite/query'
|
|
14
|
+
import { client } from './graphql-client'
|
|
15
|
+
|
|
16
|
+
const queryClient = new QueryClient()
|
|
17
|
+
|
|
18
|
+
function App() {
|
|
19
|
+
return (
|
|
20
|
+
<QueryClientProvider client={queryClient}>
|
|
21
|
+
<GraphQLProvider client={client}>
|
|
22
|
+
{/* your app */}
|
|
23
|
+
</GraphQLProvider>
|
|
24
|
+
</QueryClientProvider>
|
|
25
|
+
)
|
|
26
|
+
}
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### `useGraphQLClient()`
|
|
30
|
+
|
|
31
|
+
Access the raw `GraphQLClient` instance from context:
|
|
32
|
+
|
|
33
|
+
```ts
|
|
34
|
+
import { useGraphQLClient } from 'drizzle-graphql-suite/query'
|
|
35
|
+
|
|
36
|
+
function MyComponent() {
|
|
37
|
+
const client = useGraphQLClient()
|
|
38
|
+
// client.entity('user'), client.execute(query, variables), etc.
|
|
39
|
+
}
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### `useEntity(entityName)`
|
|
43
|
+
|
|
44
|
+
Get a typed `EntityClient` for use with query and mutation hooks:
|
|
45
|
+
|
|
46
|
+
```ts
|
|
47
|
+
import { useEntity } from 'drizzle-graphql-suite/query'
|
|
48
|
+
|
|
49
|
+
function UserList() {
|
|
50
|
+
const user = useEntity('user')
|
|
51
|
+
// Pass `user` to useEntityList, useEntityQuery, etc.
|
|
52
|
+
}
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
## Query Hooks
|
|
56
|
+
|
|
57
|
+
### `useEntityList(entity, params, options?)`
|
|
58
|
+
|
|
59
|
+
Fetch a list of records. Returns `UseQueryResult<T[]>`.
|
|
60
|
+
|
|
61
|
+
**Params**: `select`, `where`, `limit`, `offset`, `orderBy`
|
|
62
|
+
|
|
63
|
+
```tsx
|
|
64
|
+
import { useEntity, useEntityList } from 'drizzle-graphql-suite/query'
|
|
65
|
+
|
|
66
|
+
function UserList() {
|
|
67
|
+
const user = useEntity('user')
|
|
68
|
+
const { data, isLoading, error } = useEntityList(user, {
|
|
69
|
+
select: { id: true, name: true, email: true },
|
|
70
|
+
where: { role: { eq: 'admin' } },
|
|
71
|
+
orderBy: { name: { direction: 'asc', priority: 1 } },
|
|
72
|
+
limit: 20,
|
|
73
|
+
})
|
|
74
|
+
|
|
75
|
+
if (isLoading) return <div>Loading...</div>
|
|
76
|
+
if (error) return <div>Error: {error.message}</div>
|
|
77
|
+
|
|
78
|
+
return (
|
|
79
|
+
<ul>
|
|
80
|
+
{data?.map((u) => <li key={u.id}>{u.name} ({u.email})</li>)}
|
|
81
|
+
</ul>
|
|
82
|
+
)
|
|
83
|
+
}
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
### `useEntityQuery(entity, params, options?)`
|
|
87
|
+
|
|
88
|
+
Fetch a single record. Returns `UseQueryResult<T | null>`.
|
|
89
|
+
|
|
90
|
+
**Params**: `select`, `where`, `offset`, `orderBy`
|
|
91
|
+
|
|
92
|
+
```tsx
|
|
93
|
+
function UserDetail({ userId }: { userId: string }) {
|
|
94
|
+
const user = useEntity('user')
|
|
95
|
+
const { data } = useEntityQuery(user, {
|
|
96
|
+
select: { id: true, name: true, email: true, role: true },
|
|
97
|
+
where: { id: { eq: userId } },
|
|
98
|
+
})
|
|
99
|
+
|
|
100
|
+
if (!data) return null
|
|
101
|
+
return <div>{data.name} — {data.role}</div>
|
|
102
|
+
}
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
### `useEntityInfiniteQuery(entity, params, options?)`
|
|
106
|
+
|
|
107
|
+
Infinite scrolling with cursor-based pagination. Returns `UseInfiniteQueryResult` with pages containing `{ items: T[], count: number }`.
|
|
108
|
+
|
|
109
|
+
**Params**: `select`, `where`, `pageSize`, `orderBy`
|
|
110
|
+
|
|
111
|
+
```tsx
|
|
112
|
+
function InfiniteUserList() {
|
|
113
|
+
const user = useEntity('user')
|
|
114
|
+
const { data, fetchNextPage, hasNextPage, isFetchingNextPage } =
|
|
115
|
+
useEntityInfiniteQuery(user, {
|
|
116
|
+
select: { id: true, name: true },
|
|
117
|
+
pageSize: 20,
|
|
118
|
+
orderBy: { name: { direction: 'asc', priority: 1 } },
|
|
119
|
+
})
|
|
120
|
+
|
|
121
|
+
const allUsers = data?.pages.flatMap((page) => page.items) ?? []
|
|
122
|
+
|
|
123
|
+
return (
|
|
124
|
+
<div>
|
|
125
|
+
<ul>
|
|
126
|
+
{allUsers.map((u) => <li key={u.id}>{u.name}</li>)}
|
|
127
|
+
</ul>
|
|
128
|
+
{hasNextPage && (
|
|
129
|
+
<button onClick={() => fetchNextPage()} disabled={isFetchingNextPage}>
|
|
130
|
+
{isFetchingNextPage ? 'Loading...' : 'Load more'}
|
|
131
|
+
</button>
|
|
132
|
+
)}
|
|
133
|
+
</div>
|
|
134
|
+
)
|
|
135
|
+
}
|
|
136
|
+
```
|
|
137
|
+
|
|
138
|
+
### Query Options
|
|
139
|
+
|
|
140
|
+
All query hooks accept an optional `options` parameter:
|
|
141
|
+
|
|
142
|
+
| Option | Type | Description |
|
|
143
|
+
|--------|------|-------------|
|
|
144
|
+
| `enabled` | `boolean` | Disable automatic fetching |
|
|
145
|
+
| `gcTime` | `number` | Garbage collection time (ms) |
|
|
146
|
+
| `staleTime` | `number` | Time until data is considered stale (ms) |
|
|
147
|
+
| `refetchOnWindowFocus` | `boolean` | Refetch when window regains focus |
|
|
148
|
+
| `queryKey` | `unknown[]` | Override the auto-generated query key |
|
|
149
|
+
|
|
150
|
+
## Mutation Hooks
|
|
151
|
+
|
|
152
|
+
### `useEntityInsert(entity, returning?, options?)`
|
|
153
|
+
|
|
154
|
+
Insert records. Call `.mutate({ values })` to execute.
|
|
155
|
+
|
|
156
|
+
```tsx
|
|
157
|
+
function CreateUser() {
|
|
158
|
+
const user = useEntity('user')
|
|
159
|
+
const { mutate, isPending } = useEntityInsert(
|
|
160
|
+
user,
|
|
161
|
+
{ id: true, name: true },
|
|
162
|
+
{ onSuccess: (data) => console.log('Created:', data) },
|
|
163
|
+
)
|
|
164
|
+
|
|
165
|
+
return (
|
|
166
|
+
<button
|
|
167
|
+
disabled={isPending}
|
|
168
|
+
onClick={() => mutate({
|
|
169
|
+
values: [{ name: 'Alice', email: 'alice@example.com' }],
|
|
170
|
+
})}
|
|
171
|
+
>
|
|
172
|
+
Create User
|
|
173
|
+
</button>
|
|
174
|
+
)
|
|
175
|
+
}
|
|
176
|
+
```
|
|
177
|
+
|
|
178
|
+
### `useEntityUpdate(entity, returning?, options?)`
|
|
179
|
+
|
|
180
|
+
Update records. Call `.mutate({ set, where })` to execute.
|
|
181
|
+
|
|
182
|
+
```tsx
|
|
183
|
+
function UpdateRole({ userId }: { userId: string }) {
|
|
184
|
+
const user = useEntity('user')
|
|
185
|
+
const { mutate } = useEntityUpdate(user, { id: true, role: true })
|
|
186
|
+
|
|
187
|
+
return (
|
|
188
|
+
<button onClick={() => mutate({
|
|
189
|
+
set: { role: 'admin' },
|
|
190
|
+
where: { id: { eq: userId } },
|
|
191
|
+
})}>
|
|
192
|
+
Make Admin
|
|
193
|
+
</button>
|
|
194
|
+
)
|
|
195
|
+
}
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
### `useEntityDelete(entity, returning?, options?)`
|
|
199
|
+
|
|
200
|
+
Delete records. Call `.mutate({ where })` to execute.
|
|
201
|
+
|
|
202
|
+
```tsx
|
|
203
|
+
function DeleteUser({ userId }: { userId: string }) {
|
|
204
|
+
const user = useEntity('user')
|
|
205
|
+
const { mutate } = useEntityDelete(user, { id: true })
|
|
206
|
+
|
|
207
|
+
return (
|
|
208
|
+
<button onClick={() => mutate({
|
|
209
|
+
where: { id: { eq: userId } },
|
|
210
|
+
})}>
|
|
211
|
+
Delete
|
|
212
|
+
</button>
|
|
213
|
+
)
|
|
214
|
+
}
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
### Mutation Options
|
|
218
|
+
|
|
219
|
+
All mutation hooks accept an optional `options` parameter:
|
|
220
|
+
|
|
221
|
+
| Option | Type | Description |
|
|
222
|
+
|--------|------|-------------|
|
|
223
|
+
| `invalidate` | `boolean` | Invalidate queries after mutation (default: `true`) |
|
|
224
|
+
| `invalidateKey` | `unknown[]` | Custom query key prefix to invalidate |
|
|
225
|
+
| `onSuccess` | `(data) => void` | Callback after successful mutation |
|
|
226
|
+
| `onError` | `(error) => void` | Callback after failed mutation |
|
|
227
|
+
|
|
228
|
+
## Cache Invalidation
|
|
229
|
+
|
|
230
|
+
By default, all mutations invalidate queries with the `['gql']` key prefix. Since all query hooks use keys starting with `['gql', ...]`, this means every mutation refreshes all GraphQL queries.
|
|
231
|
+
|
|
232
|
+
### Custom Invalidation Key
|
|
233
|
+
|
|
234
|
+
Narrow invalidation to specific queries:
|
|
235
|
+
|
|
236
|
+
```ts
|
|
237
|
+
const { mutate } = useEntityUpdate(user, { id: true }, {
|
|
238
|
+
invalidateKey: ['gql', 'list'], // only invalidate list queries
|
|
239
|
+
})
|
|
240
|
+
```
|
|
241
|
+
|
|
242
|
+
### Disable Invalidation
|
|
243
|
+
|
|
244
|
+
```ts
|
|
245
|
+
const { mutate } = useEntityInsert(user, undefined, {
|
|
246
|
+
invalidate: false,
|
|
247
|
+
})
|
|
248
|
+
```
|
|
249
|
+
|
|
250
|
+
### Query Key Override
|
|
251
|
+
|
|
252
|
+
Override the auto-generated key on query hooks for fine-grained cache control:
|
|
253
|
+
|
|
254
|
+
```ts
|
|
255
|
+
const { data } = useEntityList(user, params, {
|
|
256
|
+
queryKey: ['users', 'admin-list'],
|
|
257
|
+
})
|
|
258
|
+
```
|
|
259
|
+
|
|
260
|
+
## Type Inference Flow
|
|
261
|
+
|
|
262
|
+
Types flow end-to-end from your Drizzle schema to hook return types:
|
|
263
|
+
|
|
264
|
+
```
|
|
265
|
+
Drizzle Schema (tables + relations)
|
|
266
|
+
↓ InferEntityDefs
|
|
267
|
+
EntityDefs (fields, filters, inputs, orderBy per table)
|
|
268
|
+
↓ createDrizzleClient
|
|
269
|
+
GraphQLClient<SchemaDescriptor, EntityDefs>
|
|
270
|
+
↓ useEntity / client.entity()
|
|
271
|
+
EntityClient<EntityDefs, EntityDef>
|
|
272
|
+
↓ useEntityList / useEntityQuery (select param)
|
|
273
|
+
InferResult<EntityDefs, EntityDef, Select>
|
|
274
|
+
↓
|
|
275
|
+
Fully typed data: only selected fields, relations resolve to T[] or T | null
|
|
276
|
+
```
|
package/index.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { GraphQLProvider, useGraphQLClient } from './provider';
|
|
2
|
+
export type { GraphQLClientContext } from './types';
|
|
3
|
+
export { useEntity } from './useEntity';
|
|
4
|
+
export { useEntityInfiniteQuery } from './useEntityInfiniteQuery';
|
|
5
|
+
export { useEntityList } from './useEntityList';
|
|
6
|
+
export { useEntityDelete, useEntityInsert, useEntityUpdate } from './useEntityMutation';
|
|
7
|
+
export { useEntityQuery } from './useEntityQuery';
|
package/index.js
ADDED
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
// src/provider.tsx
|
|
2
|
+
import { createContext, useContext } from "react";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var GraphQLClientContext = createContext(null);
|
|
6
|
+
function GraphQLProvider({
|
|
7
|
+
client,
|
|
8
|
+
children
|
|
9
|
+
}) {
|
|
10
|
+
return /* @__PURE__ */ jsxDEV(GraphQLClientContext.Provider, {
|
|
11
|
+
value: client,
|
|
12
|
+
children
|
|
13
|
+
}, undefined, false, undefined, this);
|
|
14
|
+
}
|
|
15
|
+
function useGraphQLClient() {
|
|
16
|
+
const client = useContext(GraphQLClientContext);
|
|
17
|
+
if (!client) {
|
|
18
|
+
throw new Error("useGraphQLClient must be used within a <GraphQLProvider>");
|
|
19
|
+
}
|
|
20
|
+
return client;
|
|
21
|
+
}
|
|
22
|
+
// src/useEntity.ts
|
|
23
|
+
import { useMemo } from "react";
|
|
24
|
+
function useEntity(entityName) {
|
|
25
|
+
const client = useGraphQLClient();
|
|
26
|
+
return useMemo(() => client.entity(entityName), [client, entityName]);
|
|
27
|
+
}
|
|
28
|
+
// src/useEntityInfiniteQuery.ts
|
|
29
|
+
import { useInfiniteQuery } from "@tanstack/react-query";
|
|
30
|
+
function useEntityInfiniteQuery(entity, params, options) {
|
|
31
|
+
const queryKey = options?.queryKey ?? [
|
|
32
|
+
"gql",
|
|
33
|
+
"infinite",
|
|
34
|
+
params.select,
|
|
35
|
+
params.where,
|
|
36
|
+
params.orderBy,
|
|
37
|
+
params.pageSize
|
|
38
|
+
];
|
|
39
|
+
return useInfiniteQuery({
|
|
40
|
+
queryKey,
|
|
41
|
+
initialPageParam: 0,
|
|
42
|
+
queryFn: async ({ pageParam = 0 }) => {
|
|
43
|
+
const queryParams = {
|
|
44
|
+
...params,
|
|
45
|
+
limit: params.pageSize,
|
|
46
|
+
offset: pageParam * params.pageSize
|
|
47
|
+
};
|
|
48
|
+
const items = await entity.query(queryParams);
|
|
49
|
+
const count = await entity.count({ where: params.where });
|
|
50
|
+
return {
|
|
51
|
+
items,
|
|
52
|
+
count
|
|
53
|
+
};
|
|
54
|
+
},
|
|
55
|
+
getNextPageParam: (lastPage, allPages) => {
|
|
56
|
+
const totalFetched = allPages.length * params.pageSize;
|
|
57
|
+
return totalFetched < lastPage.count ? allPages.length : undefined;
|
|
58
|
+
},
|
|
59
|
+
enabled: options?.enabled,
|
|
60
|
+
gcTime: options?.gcTime,
|
|
61
|
+
staleTime: options?.staleTime
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
// src/useEntityList.ts
|
|
65
|
+
import { useQuery } from "@tanstack/react-query";
|
|
66
|
+
function useEntityList(entity, params, options) {
|
|
67
|
+
const queryKey = options?.queryKey ?? [
|
|
68
|
+
"gql",
|
|
69
|
+
"list",
|
|
70
|
+
params.select,
|
|
71
|
+
params.where,
|
|
72
|
+
params.orderBy,
|
|
73
|
+
params.limit,
|
|
74
|
+
params.offset
|
|
75
|
+
];
|
|
76
|
+
return useQuery({
|
|
77
|
+
queryKey,
|
|
78
|
+
queryFn: async () => {
|
|
79
|
+
return await entity.query(params);
|
|
80
|
+
},
|
|
81
|
+
enabled: options?.enabled,
|
|
82
|
+
gcTime: options?.gcTime,
|
|
83
|
+
staleTime: options?.staleTime,
|
|
84
|
+
refetchOnWindowFocus: options?.refetchOnWindowFocus
|
|
85
|
+
});
|
|
86
|
+
}
|
|
87
|
+
// src/useEntityMutation.ts
|
|
88
|
+
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
|
89
|
+
function useEntityInsert(entity, returning, options) {
|
|
90
|
+
const queryClient = useQueryClient();
|
|
91
|
+
const shouldInvalidate = options?.invalidate !== false;
|
|
92
|
+
return useMutation({
|
|
93
|
+
mutationFn: async (params) => {
|
|
94
|
+
return await entity.insert({ ...params, returning });
|
|
95
|
+
},
|
|
96
|
+
onSuccess: (data) => {
|
|
97
|
+
if (shouldInvalidate) {
|
|
98
|
+
const key = options?.invalidateKey ?? ["gql"];
|
|
99
|
+
queryClient.invalidateQueries({ queryKey: key });
|
|
100
|
+
}
|
|
101
|
+
options?.onSuccess?.(data);
|
|
102
|
+
},
|
|
103
|
+
onError: options?.onError
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
function useEntityUpdate(entity, returning, options) {
|
|
107
|
+
const queryClient = useQueryClient();
|
|
108
|
+
const shouldInvalidate = options?.invalidate !== false;
|
|
109
|
+
return useMutation({
|
|
110
|
+
mutationFn: async (params) => {
|
|
111
|
+
return await entity.update({ ...params, returning });
|
|
112
|
+
},
|
|
113
|
+
onSuccess: (data) => {
|
|
114
|
+
if (shouldInvalidate) {
|
|
115
|
+
const key = options?.invalidateKey ?? ["gql"];
|
|
116
|
+
queryClient.invalidateQueries({ queryKey: key });
|
|
117
|
+
}
|
|
118
|
+
options?.onSuccess?.(data);
|
|
119
|
+
},
|
|
120
|
+
onError: options?.onError
|
|
121
|
+
});
|
|
122
|
+
}
|
|
123
|
+
function useEntityDelete(entity, returning, options) {
|
|
124
|
+
const queryClient = useQueryClient();
|
|
125
|
+
const shouldInvalidate = options?.invalidate !== false;
|
|
126
|
+
return useMutation({
|
|
127
|
+
mutationFn: async (params) => {
|
|
128
|
+
return await entity.delete({ ...params, returning });
|
|
129
|
+
},
|
|
130
|
+
onSuccess: (data) => {
|
|
131
|
+
if (shouldInvalidate) {
|
|
132
|
+
const key = options?.invalidateKey ?? ["gql"];
|
|
133
|
+
queryClient.invalidateQueries({ queryKey: key });
|
|
134
|
+
}
|
|
135
|
+
options?.onSuccess?.(data);
|
|
136
|
+
},
|
|
137
|
+
onError: options?.onError
|
|
138
|
+
});
|
|
139
|
+
}
|
|
140
|
+
// src/useEntityQuery.ts
|
|
141
|
+
import { useQuery as useQuery2 } from "@tanstack/react-query";
|
|
142
|
+
function useEntityQuery(entity, params, options) {
|
|
143
|
+
const queryKey = options?.queryKey ?? [
|
|
144
|
+
"gql",
|
|
145
|
+
"single",
|
|
146
|
+
params.select,
|
|
147
|
+
params.where,
|
|
148
|
+
params.orderBy,
|
|
149
|
+
params.offset
|
|
150
|
+
];
|
|
151
|
+
return useQuery2({
|
|
152
|
+
queryKey,
|
|
153
|
+
queryFn: async () => {
|
|
154
|
+
return await entity.querySingle(params);
|
|
155
|
+
},
|
|
156
|
+
enabled: options?.enabled,
|
|
157
|
+
gcTime: options?.gcTime,
|
|
158
|
+
staleTime: options?.staleTime,
|
|
159
|
+
refetchOnWindowFocus: options?.refetchOnWindowFocus
|
|
160
|
+
});
|
|
161
|
+
}
|
|
162
|
+
export {
|
|
163
|
+
useGraphQLClient,
|
|
164
|
+
useEntityUpdate,
|
|
165
|
+
useEntityQuery,
|
|
166
|
+
useEntityList,
|
|
167
|
+
useEntityInsert,
|
|
168
|
+
useEntityInfiniteQuery,
|
|
169
|
+
useEntityDelete,
|
|
170
|
+
useEntity,
|
|
171
|
+
GraphQLProvider
|
|
172
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@drizzle-graphql-suite/query",
|
|
3
|
+
"version": "0.5.0",
|
|
4
|
+
"description": "React Query hooks for the Drizzle GraphQL client with caching and automatic invalidation",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"author": "https://github.com/dmythro",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/annexare/drizzle-graphql-suite.git",
|
|
10
|
+
"directory": "packages/query"
|
|
11
|
+
},
|
|
12
|
+
"homepage": "https://github.com/annexare/drizzle-graphql-suite/tree/main/packages/query#readme",
|
|
13
|
+
"keywords": [
|
|
14
|
+
"drizzle",
|
|
15
|
+
"graphql",
|
|
16
|
+
"react",
|
|
17
|
+
"react-query",
|
|
18
|
+
"tanstack",
|
|
19
|
+
"hooks",
|
|
20
|
+
"typescript"
|
|
21
|
+
],
|
|
22
|
+
"type": "module",
|
|
23
|
+
"publishConfig": {
|
|
24
|
+
"access": "public"
|
|
25
|
+
},
|
|
26
|
+
"main": "./index.js",
|
|
27
|
+
"types": "./index.d.ts",
|
|
28
|
+
"exports": {
|
|
29
|
+
".": {
|
|
30
|
+
"types": "./index.d.ts",
|
|
31
|
+
"import": "./index.js"
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
"peerDependencies": {
|
|
35
|
+
"@drizzle-graphql-suite/client": ">=0.5.0",
|
|
36
|
+
"@tanstack/react-query": ">=5.0.0",
|
|
37
|
+
"react": ">=18.0.0"
|
|
38
|
+
}
|
|
39
|
+
}
|
package/provider.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { AnyEntityDefs, GraphQLClient, SchemaDescriptor } from '@drizzle-graphql-suite/client';
|
|
2
|
+
import { type ReactNode } from 'react';
|
|
3
|
+
export declare function GraphQLProvider<TSchema extends SchemaDescriptor, TDefs extends AnyEntityDefs>({ client, children, }: {
|
|
4
|
+
client: GraphQLClient<TSchema, TDefs>;
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function useGraphQLClient<TSchema extends SchemaDescriptor = SchemaDescriptor, TDefs extends AnyEntityDefs = AnyEntityDefs>(): GraphQLClient<TSchema, TDefs>;
|
package/test-setup.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/test-utils.d.ts
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import './test-setup';
|
|
2
|
+
import { QueryClient } from '@tanstack/react-query';
|
|
3
|
+
import { type ReactNode } from 'react';
|
|
4
|
+
type RenderHookOptions = {
|
|
5
|
+
wrapper?: (props: {
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
}) => ReactNode;
|
|
8
|
+
};
|
|
9
|
+
type RenderHookResult<T> = {
|
|
10
|
+
result: {
|
|
11
|
+
current: T;
|
|
12
|
+
};
|
|
13
|
+
rerender: () => void;
|
|
14
|
+
unmount: () => void;
|
|
15
|
+
};
|
|
16
|
+
export declare function renderHook<T>(callback: () => T, options?: RenderHookOptions): RenderHookResult<T>;
|
|
17
|
+
export declare function renderHookAsync<T>(callback: () => T, options?: RenderHookOptions): Promise<RenderHookResult<T>>;
|
|
18
|
+
type MockParams = any;
|
|
19
|
+
export declare function createMockEntityClient(): {
|
|
20
|
+
query: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown>[]>>;
|
|
21
|
+
querySingle: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown> | null>>;
|
|
22
|
+
count: import("bun:test").Mock<(p: MockParams) => Promise<number>>;
|
|
23
|
+
insert: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown>[]>>;
|
|
24
|
+
insertSingle: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown> | null>>;
|
|
25
|
+
update: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown>[]>>;
|
|
26
|
+
delete: import("bun:test").Mock<(p: MockParams) => Promise<Record<string, unknown>[]>>;
|
|
27
|
+
};
|
|
28
|
+
export declare function createMockGraphQLClient(entityClient?: any): {
|
|
29
|
+
entity: import("bun:test").Mock<(name: string) => any>;
|
|
30
|
+
url: string;
|
|
31
|
+
schema: {};
|
|
32
|
+
execute: import("bun:test").Mock<() => Promise<{
|
|
33
|
+
data: {};
|
|
34
|
+
}>>;
|
|
35
|
+
};
|
|
36
|
+
export declare function createTestQueryClient(): QueryClient;
|
|
37
|
+
export declare function createWrapper(mockClient: any, queryClient?: QueryClient): ({ children }: {
|
|
38
|
+
children: ReactNode;
|
|
39
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
40
|
+
export {};
|
package/types.d.ts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { AnyEntityDefs, GraphQLClient, SchemaDescriptor } from '@drizzle-graphql-suite/client';
|
|
2
|
+
export type GraphQLClientContext<TSchema extends SchemaDescriptor = SchemaDescriptor, TDefs extends AnyEntityDefs = AnyEntityDefs> = {
|
|
3
|
+
client: GraphQLClient<TSchema, TDefs>;
|
|
4
|
+
};
|
package/useEntity.d.ts
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import type { AnyEntityDefs, EntityClient, EntityDef, SchemaDescriptor } from '@drizzle-graphql-suite/client';
|
|
2
|
+
export declare function useEntity<TSchema extends SchemaDescriptor, TDefs extends AnyEntityDefs, TEntityName extends string & keyof TSchema>(entityName: TEntityName): TEntityName extends keyof TDefs ? EntityClient<TDefs, TDefs[TEntityName] & EntityDef> : EntityClient<TDefs, EntityDef>;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import type { AnyEntityDefs, EntityClient, EntityDef, InferResult } from '@drizzle-graphql-suite/client';
|
|
2
|
+
import { type UseInfiniteQueryResult } from '@tanstack/react-query';
|
|
3
|
+
type EntityInfiniteParams<TEntity extends EntityDef, TSelect extends Record<string, unknown>> = {
|
|
4
|
+
select: TSelect;
|
|
5
|
+
where?: TEntity extends {
|
|
6
|
+
filters: infer F;
|
|
7
|
+
} ? F : never;
|
|
8
|
+
pageSize: number;
|
|
9
|
+
orderBy?: TEntity extends {
|
|
10
|
+
orderBy: infer O;
|
|
11
|
+
} ? O : never;
|
|
12
|
+
};
|
|
13
|
+
type EntityInfiniteOptions = {
|
|
14
|
+
enabled?: boolean;
|
|
15
|
+
gcTime?: number;
|
|
16
|
+
staleTime?: number;
|
|
17
|
+
queryKey?: unknown[];
|
|
18
|
+
};
|
|
19
|
+
type PageData<T> = {
|
|
20
|
+
items: T[];
|
|
21
|
+
count: number;
|
|
22
|
+
};
|
|
23
|
+
export declare function useEntityInfiniteQuery<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, params: EntityInfiniteParams<TEntity, TSelect>, options?: EntityInfiniteOptions): UseInfiniteQueryResult<{
|
|
24
|
+
pages: PageData<InferResult<TDefs, TEntity, TSelect>>[];
|
|
25
|
+
}>;
|
|
26
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { AnyEntityDefs, EntityClient, EntityDef, InferResult } from '@drizzle-graphql-suite/client';
|
|
2
|
+
import { type UseQueryResult } from '@tanstack/react-query';
|
|
3
|
+
type EntityListParams<TEntity extends EntityDef, TSelect extends Record<string, unknown>> = {
|
|
4
|
+
select: TSelect;
|
|
5
|
+
where?: TEntity extends {
|
|
6
|
+
filters: infer F;
|
|
7
|
+
} ? F : never;
|
|
8
|
+
limit?: number;
|
|
9
|
+
offset?: number;
|
|
10
|
+
orderBy?: TEntity extends {
|
|
11
|
+
orderBy: infer O;
|
|
12
|
+
} ? O : never;
|
|
13
|
+
};
|
|
14
|
+
type EntityListOptions = {
|
|
15
|
+
enabled?: boolean;
|
|
16
|
+
gcTime?: number;
|
|
17
|
+
staleTime?: number;
|
|
18
|
+
refetchOnWindowFocus?: boolean;
|
|
19
|
+
queryKey?: unknown[];
|
|
20
|
+
};
|
|
21
|
+
export declare function useEntityList<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, params: EntityListParams<TEntity, TSelect>, options?: EntityListOptions): UseQueryResult<InferResult<TDefs, TEntity, TSelect>[]>;
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { AnyEntityDefs, EntityClient, EntityDef, InferResult } from '@drizzle-graphql-suite/client';
|
|
2
|
+
import { type UseMutationResult } from '@tanstack/react-query';
|
|
3
|
+
type InsertOptions<TResult> = {
|
|
4
|
+
invalidate?: boolean;
|
|
5
|
+
invalidateKey?: unknown[];
|
|
6
|
+
onSuccess?: (data: TResult) => void;
|
|
7
|
+
onError?: (error: Error) => void;
|
|
8
|
+
};
|
|
9
|
+
export declare function useEntityInsert<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, returning?: TSelect, options?: InsertOptions<InferResult<TDefs, TEntity, TSelect>[]>): UseMutationResult<InferResult<TDefs, TEntity, TSelect>[], Error, {
|
|
10
|
+
values: TEntity extends {
|
|
11
|
+
insertInput: infer I;
|
|
12
|
+
} ? I[] : never;
|
|
13
|
+
}>;
|
|
14
|
+
type UpdateParams<TEntity extends EntityDef> = {
|
|
15
|
+
set: TEntity extends {
|
|
16
|
+
updateInput: infer U;
|
|
17
|
+
} ? U : never;
|
|
18
|
+
where?: TEntity extends {
|
|
19
|
+
filters: infer F;
|
|
20
|
+
} ? F : never;
|
|
21
|
+
};
|
|
22
|
+
type UpdateOptions<TResult> = {
|
|
23
|
+
invalidate?: boolean;
|
|
24
|
+
invalidateKey?: unknown[];
|
|
25
|
+
onSuccess?: (data: TResult) => void;
|
|
26
|
+
onError?: (error: Error) => void;
|
|
27
|
+
};
|
|
28
|
+
export declare function useEntityUpdate<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, returning?: TSelect, options?: UpdateOptions<InferResult<TDefs, TEntity, TSelect>[]>): UseMutationResult<InferResult<TDefs, TEntity, TSelect>[], Error, UpdateParams<TEntity>>;
|
|
29
|
+
type DeleteParams<TEntity extends EntityDef> = {
|
|
30
|
+
where?: TEntity extends {
|
|
31
|
+
filters: infer F;
|
|
32
|
+
} ? F : never;
|
|
33
|
+
};
|
|
34
|
+
type DeleteOptions<TResult> = {
|
|
35
|
+
invalidate?: boolean;
|
|
36
|
+
invalidateKey?: unknown[];
|
|
37
|
+
onSuccess?: (data: TResult) => void;
|
|
38
|
+
onError?: (error: Error) => void;
|
|
39
|
+
};
|
|
40
|
+
export declare function useEntityDelete<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, returning?: TSelect, options?: DeleteOptions<InferResult<TDefs, TEntity, TSelect>[]>): UseMutationResult<InferResult<TDefs, TEntity, TSelect>[], Error, DeleteParams<TEntity>>;
|
|
41
|
+
export {};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { AnyEntityDefs, EntityClient, EntityDef, InferResult } from '@drizzle-graphql-suite/client';
|
|
2
|
+
import { type UseQueryResult } from '@tanstack/react-query';
|
|
3
|
+
type EntityQueryParams<TEntity extends EntityDef, TSelect extends Record<string, unknown>> = {
|
|
4
|
+
select: TSelect;
|
|
5
|
+
where?: TEntity extends {
|
|
6
|
+
filters: infer F;
|
|
7
|
+
} ? F : never;
|
|
8
|
+
offset?: number;
|
|
9
|
+
orderBy?: TEntity extends {
|
|
10
|
+
orderBy: infer O;
|
|
11
|
+
} ? O : never;
|
|
12
|
+
};
|
|
13
|
+
type EntityQueryOptions = {
|
|
14
|
+
enabled?: boolean;
|
|
15
|
+
gcTime?: number;
|
|
16
|
+
staleTime?: number;
|
|
17
|
+
refetchOnWindowFocus?: boolean;
|
|
18
|
+
queryKey?: unknown[];
|
|
19
|
+
};
|
|
20
|
+
export declare function useEntityQuery<TDefs extends AnyEntityDefs, TEntity extends EntityDef, TSelect extends Record<string, unknown>>(entity: EntityClient<TDefs, TEntity>, params: EntityQueryParams<TEntity, TSelect>, options?: EntityQueryOptions): UseQueryResult<InferResult<TDefs, TEntity, TSelect> | null>;
|
|
21
|
+
export {};
|