@powersync/tanstack-react-query 0.0.5 → 0.0.7
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/README.md +6 -6
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
# TanStack Query Integration for PowerSync
|
|
2
2
|
|
|
3
|
-
`@powersync/tanstack-react-query` provides seamless integration between PowerSync's Web SDK and [TanStack Query](https://tanstack.com/query/latest/docs/framework/react/overview) for React. It wraps TanStack's `useQuery` and `useSuspenseQuery` hooks to work easily with PowerSync's SQL queries. This combines PowerSync's existing watched queries with TanStack's features like the [paginated queries](https://tanstack.com/query/latest/docs/framework/react/guides/paginated-queries), [caching](https://tanstack.com/query/latest/docs/framework/react/guides/caching), and [Suspense](https://tanstack.com/query/latest/docs/framework/react/guides/suspense).
|
|
3
|
+
`@powersync/tanstack-react-query` provides seamless integration between PowerSync's Web SDK and [TanStack Query](https://tanstack.com/query/latest/docs/framework/react/overview) for React. It wraps TanStack's `useQuery` and `useSuspenseQuery` hooks to work easily with PowerSync's SQL queries. This combines PowerSync's existing watched queries with TanStack Query's features like the [paginated queries](https://tanstack.com/query/latest/docs/framework/react/guides/paginated-queries), [caching](https://tanstack.com/query/latest/docs/framework/react/guides/caching), and [Suspense](https://tanstack.com/query/latest/docs/framework/react/guides/suspense).
|
|
4
4
|
|
|
5
5
|
## Note: Alpha Release
|
|
6
6
|
|
|
7
7
|
This package is currently in an alpha release.
|
|
8
8
|
|
|
9
|
-
## Getting
|
|
9
|
+
## Getting Started
|
|
10
10
|
|
|
11
|
-
To use `@powersync/tanstack-react-query`, you need to set up both the `
|
|
11
|
+
To use `@powersync/tanstack-react-query`, you need to set up both the `PowerSyncContext` and the TanStack `QueryClientProvider` in your application.
|
|
12
12
|
|
|
13
13
|
```JSX
|
|
14
14
|
// App.jsx
|
|
@@ -22,7 +22,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
|
|
22
22
|
|
|
23
23
|
export const App = () => {
|
|
24
24
|
const powerSync = React.useMemo(() => {
|
|
25
|
-
//
|
|
25
|
+
// Set up PowerSync client
|
|
26
26
|
}, [])
|
|
27
27
|
const queryClient = React.useMemo(() => new QueryClient(), [])
|
|
28
28
|
|
|
@@ -40,7 +40,7 @@ export const App = () => {
|
|
|
40
40
|
|
|
41
41
|
### useQuery
|
|
42
42
|
|
|
43
|
-
The `useQuery` hook from `@powersync/tanstack-react-query` works similarly to the standard
|
|
43
|
+
The `useQuery` hook from `@powersync/tanstack-react-query` works similarly to the standard TanStack React Query `useQuery` hook but integrates with PowerSync for watched query functionality. Queries automatically update when dependent tables change.
|
|
44
44
|
|
|
45
45
|
```JSX
|
|
46
46
|
// TodoListDisplay.jsx
|
|
@@ -127,7 +127,7 @@ return <></>
|
|
|
127
127
|
}
|
|
128
128
|
```
|
|
129
129
|
|
|
130
|
-
###
|
|
130
|
+
### Kysely Support
|
|
131
131
|
|
|
132
132
|
You are also able to use a compilable query (e.g. [Kysely queries](https://github.com/powersync-ja/powersync-js/tree/main/packages/kysely-driver)) as a query argument in place of a SQL statement string.
|
|
133
133
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@powersync/tanstack-react-query",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"registry": "https://registry.npmjs.org/",
|
|
6
6
|
"access": "public"
|
|
@@ -22,12 +22,12 @@
|
|
|
22
22
|
},
|
|
23
23
|
"homepage": "https://docs.powersync.com",
|
|
24
24
|
"peerDependencies": {
|
|
25
|
-
"@powersync/common": "^1.20.
|
|
25
|
+
"@powersync/common": "^1.20.2",
|
|
26
26
|
"react": "*"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@tanstack/react-query": "^5.55.4",
|
|
30
|
-
"@powersync/common": "1.20.
|
|
30
|
+
"@powersync/common": "1.20.2",
|
|
31
31
|
"@powersync/react": "1.5.0"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|