diff --git a/.changeset/clever-parks-report.md b/.changeset/clever-parks-report.md deleted file mode 100644 index 63a2ec563..000000000 --- a/.changeset/clever-parks-report.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -"@tanstack/db-ivm": patch -"@tanstack/db": patch ---- - -Add `utils.setWindow()` method to live query collections to dynamically change limit and offset on ordered queries. - -You can now change the pagination window of an ordered live query without recreating the collection: - -```ts -const users = createLiveQueryCollection((q) => - q - .from({ user: usersCollection }) - .orderBy(({ user }) => user.name, "asc") - .limit(10) - .offset(0) -) - -users.utils.setWindow({ offset: 10, limit: 10 }) -``` diff --git a/.changeset/cruel-buckets-shop.md b/.changeset/cruel-buckets-shop.md deleted file mode 100644 index e5ed29d02..000000000 --- a/.changeset/cruel-buckets-shop.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -"@tanstack/db": patch ---- - -Added comprehensive loading state tracking and configurable sync modes to collections and live queries: - -- Added `isLoadingSubset` property and `loadingSubset:change` events to all collections for tracking when data is being loaded -- Added `syncMode` configuration option to collections: - - `'eager'` (default): Loads all data immediately during initial sync - - `'on-demand'`: Only loads data as requested via `loadSubset` calls -- Added comprehensive status tracking to collection subscriptions with `status` property (`'ready'` | `'loadingSubset'`) and events (`status:change`, `status:ready`, `status:loadingSubset`, `unsubscribed`) -- Live queries automatically reflect loading state from their source collection subscriptions, with each query maintaining isolated loading state to prevent status "bleed" between independent queries -- Enhanced `setWindow` utility to return `Promise` when loading is triggered, allowing callers to await data loading completion -- Added `subscription` parameter to `loadSubset` handler for advanced sync implementations that need to track subscription lifecycle diff --git a/.changeset/smooth-goats-ring.md b/.changeset/smooth-goats-ring.md deleted file mode 100644 index 6fc227d34..000000000 --- a/.changeset/smooth-goats-ring.md +++ /dev/null @@ -1,58 +0,0 @@ ---- -"@tanstack/react-db": patch ---- - -Add `useLiveInfiniteQuery` hook for infinite scrolling with live updates. - -The new `useLiveInfiniteQuery` hook provides an infinite query pattern similar to TanStack Query's `useInfiniteQuery`, but with live updates from your local collection. It uses `liveQueryCollection.utils.setWindow()` internally to efficiently paginate through ordered data without recreating the query on each page fetch. - -**Key features:** - -- Automatic live updates as data changes in the collection -- Efficient pagination using dynamic window adjustment -- Peek-ahead mechanism to detect when more pages are available -- Compatible with TanStack Query's infinite query API patterns - -**Example usage:** - -```tsx -import { useLiveInfiniteQuery } from "@tanstack/react-db" - -function PostList() { - const { data, pages, fetchNextPage, hasNextPage, isLoading } = - useLiveInfiniteQuery( - (q) => - q - .from({ posts: postsCollection }) - .orderBy(({ posts }) => posts.createdAt, "desc"), - { - pageSize: 20, - getNextPageParam: (lastPage, allPages) => - lastPage.length === 20 ? allPages.length : undefined, - } - ) - - if (isLoading) return
Loading...
- - return ( -
- {pages.map((page, i) => ( -
- {page.map((post) => ( - - ))} -
- ))} - {hasNextPage && ( - - )} -
- ) -} -``` - -**Requirements:** - -- Query must include `.orderBy()` for the window mechanism to work -- Returns flattened `data` array and `pages` array for flexible rendering -- Automatically detects new pages when data is synced to the collection diff --git a/examples/angular/todos/CHANGELOG.md b/examples/angular/todos/CHANGELOG.md index cb93bb5e8..8e2724a5a 100644 --- a/examples/angular/todos/CHANGELOG.md +++ b/examples/angular/todos/CHANGELOG.md @@ -1,5 +1,13 @@ # todos +## 0.0.11 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + - @tanstack/angular-db@0.1.15 + ## 0.0.10 ### Patch Changes diff --git a/examples/angular/todos/package.json b/examples/angular/todos/package.json index f41e2bcc9..0680ebf35 100644 --- a/examples/angular/todos/package.json +++ b/examples/angular/todos/package.json @@ -1,6 +1,6 @@ { "name": "todos", - "version": "0.0.10", + "version": "0.0.11", "scripts": { "ng": "ng", "start": "ng serve", diff --git a/examples/react/projects/package.json b/examples/react/projects/package.json index 49eb701ca..bab49c39a 100644 --- a/examples/react/projects/package.json +++ b/examples/react/projects/package.json @@ -17,8 +17,8 @@ "dependencies": { "@tailwindcss/vite": "^4.1.14", "@tanstack/query-core": "^5.90.2", - "@tanstack/query-db-collection": "^0.2.30", - "@tanstack/react-db": "^0.1.31", + "@tanstack/query-db-collection": "^0.2.31", + "@tanstack/react-db": "^0.1.32", "@tanstack/react-router": "^1.132.47", "@tanstack/react-router-devtools": "^1.132.51", "@tanstack/react-router-with-query": "^1.130.17", diff --git a/examples/react/todo/CHANGELOG.md b/examples/react/todo/CHANGELOG.md index 443c89e2a..702ca6329 100644 --- a/examples/react/todo/CHANGELOG.md +++ b/examples/react/todo/CHANGELOG.md @@ -1,5 +1,15 @@ # examples/react/todo +## 0.1.10 + +### Patch Changes + +- Updated dependencies [[`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/react-db@0.1.32 + - @tanstack/electric-db-collection@0.1.34 + - @tanstack/query-db-collection@0.2.31 + - @tanstack/trailbase-db-collection@0.1.32 + ## 0.1.9 ### Patch Changes diff --git a/examples/react/todo/package.json b/examples/react/todo/package.json index 4af677ca0..84fa09e45 100644 --- a/examples/react/todo/package.json +++ b/examples/react/todo/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/db-example-react-todo", "private": true, - "version": "0.1.9", + "version": "0.1.10", "dependencies": { "@tanstack/electric-db-collection": "workspace:^", "@tanstack/query-core": "^5.90.2", diff --git a/packages/angular-db/CHANGELOG.md b/packages/angular-db/CHANGELOG.md index 551b5ada4..761e59fd2 100644 --- a/packages/angular-db/CHANGELOG.md +++ b/packages/angular-db/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/angular-db +## 0.1.15 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.14 ### Patch Changes diff --git a/packages/angular-db/package.json b/packages/angular-db/package.json index 0e19befef..36513c2a3 100644 --- a/packages/angular-db/package.json +++ b/packages/angular-db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/angular-db", "description": "Angular integration for @tanstack/db", - "version": "0.1.14", + "version": "0.1.15", "author": "Ethan McDaniel", "license": "MIT", "repository": { diff --git a/packages/db-ivm/CHANGELOG.md b/packages/db-ivm/CHANGELOG.md index d5932c58f..571175e93 100644 --- a/packages/db-ivm/CHANGELOG.md +++ b/packages/db-ivm/CHANGELOG.md @@ -1,5 +1,25 @@ # @tanstack/db-ivm +## 0.1.11 + +### Patch Changes + +- Add `utils.setWindow()` method to live query collections to dynamically change limit and offset on ordered queries. ([#663](https://github.com/TanStack/db/pull/663)) + + You can now change the pagination window of an ordered live query without recreating the collection: + + ```ts + const users = createLiveQueryCollection((q) => + q + .from({ user: usersCollection }) + .orderBy(({ user }) => user.name, "asc") + .limit(10) + .offset(0) + ) + + users.utils.setWindow({ offset: 10, limit: 10 }) + ``` + ## 0.1.10 ### Patch Changes diff --git a/packages/db-ivm/package.json b/packages/db-ivm/package.json index c424d7a6b..e2e722d0c 100644 --- a/packages/db-ivm/package.json +++ b/packages/db-ivm/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/db-ivm", "description": "Incremental View Maintenance for TanStack DB based on Differential Dataflow", - "version": "0.1.10", + "version": "0.1.11", "dependencies": { "fractional-indexing": "^3.2.0", "sorted-btree": "^1.8.1" diff --git a/packages/db/CHANGELOG.md b/packages/db/CHANGELOG.md index ea4264635..9e9142678 100644 --- a/packages/db/CHANGELOG.md +++ b/packages/db/CHANGELOG.md @@ -1,5 +1,38 @@ # @tanstack/db +## 0.4.10 + +### Patch Changes + +- Add `utils.setWindow()` method to live query collections to dynamically change limit and offset on ordered queries. ([#663](https://github.com/TanStack/db/pull/663)) + + You can now change the pagination window of an ordered live query without recreating the collection: + + ```ts + const users = createLiveQueryCollection((q) => + q + .from({ user: usersCollection }) + .orderBy(({ user }) => user.name, "asc") + .limit(10) + .offset(0) + ) + + users.utils.setWindow({ offset: 10, limit: 10 }) + ``` + +- Added comprehensive loading state tracking and configurable sync modes to collections and live queries: ([#669](https://github.com/TanStack/db/pull/669)) + - Added `isLoadingSubset` property and `loadingSubset:change` events to all collections for tracking when data is being loaded + - Added `syncMode` configuration option to collections: + - `'eager'` (default): Loads all data immediately during initial sync + - `'on-demand'`: Only loads data as requested via `loadSubset` calls + - Added comprehensive status tracking to collection subscriptions with `status` property (`'ready'` | `'loadingSubset'`) and events (`status:change`, `status:ready`, `status:loadingSubset`, `unsubscribed`) + - Live queries automatically reflect loading state from their source collection subscriptions, with each query maintaining isolated loading state to prevent status "bleed" between independent queries + - Enhanced `setWindow` utility to return `Promise` when loading is triggered, allowing callers to await data loading completion + - Added `subscription` parameter to `loadSubset` handler for advanced sync implementations that need to track subscription lifecycle + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a)]: + - @tanstack/db-ivm@0.1.11 + ## 0.4.9 ### Patch Changes diff --git a/packages/db/package.json b/packages/db/package.json index e0de8b52c..47d25726c 100644 --- a/packages/db/package.json +++ b/packages/db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/db", "description": "A reactive client store for building super fast apps on sync", - "version": "0.4.9", + "version": "0.4.10", "dependencies": { "@standard-schema/spec": "^1.0.0", "@tanstack/db-ivm": "workspace:*" diff --git a/packages/electric-db-collection/CHANGELOG.md b/packages/electric-db-collection/CHANGELOG.md index 15c81e460..a9e0866e2 100644 --- a/packages/electric-db-collection/CHANGELOG.md +++ b/packages/electric-db-collection/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/electric-db-collection +## 0.1.34 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.33 ### Patch Changes diff --git a/packages/electric-db-collection/package.json b/packages/electric-db-collection/package.json index 7278bd0c6..de849391e 100644 --- a/packages/electric-db-collection/package.json +++ b/packages/electric-db-collection/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/electric-db-collection", "description": "ElectricSQL collection for TanStack DB", - "version": "0.1.33", + "version": "0.1.34", "dependencies": { "@electric-sql/client": "^1.0.14", "@standard-schema/spec": "^1.0.0", diff --git a/packages/query-db-collection/CHANGELOG.md b/packages/query-db-collection/CHANGELOG.md index ca627e5e5..2be48ca15 100644 --- a/packages/query-db-collection/CHANGELOG.md +++ b/packages/query-db-collection/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/query-db-collection +## 0.2.31 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.2.30 ### Patch Changes diff --git a/packages/query-db-collection/package.json b/packages/query-db-collection/package.json index 1fe88841d..b6cf08a5b 100644 --- a/packages/query-db-collection/package.json +++ b/packages/query-db-collection/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/query-db-collection", "description": "TanStack Query collection for TanStack DB", - "version": "0.2.30", + "version": "0.2.31", "dependencies": { "@standard-schema/spec": "^1.0.0", "@tanstack/db": "workspace:*" diff --git a/packages/react-db/CHANGELOG.md b/packages/react-db/CHANGELOG.md index 8464a7ccb..edcc4e526 100644 --- a/packages/react-db/CHANGELOG.md +++ b/packages/react-db/CHANGELOG.md @@ -1,5 +1,65 @@ # @tanstack/react-db +## 0.1.32 + +### Patch Changes + +- Add `useLiveInfiniteQuery` hook for infinite scrolling with live updates. ([#669](https://github.com/TanStack/db/pull/669)) + + The new `useLiveInfiniteQuery` hook provides an infinite query pattern similar to TanStack Query's `useInfiniteQuery`, but with live updates from your local collection. It uses `liveQueryCollection.utils.setWindow()` internally to efficiently paginate through ordered data without recreating the query on each page fetch. + + **Key features:** + - Automatic live updates as data changes in the collection + - Efficient pagination using dynamic window adjustment + - Peek-ahead mechanism to detect when more pages are available + - Compatible with TanStack Query's infinite query API patterns + + **Example usage:** + + ```tsx + import { useLiveInfiniteQuery } from "@tanstack/react-db" + + function PostList() { + const { data, pages, fetchNextPage, hasNextPage, isLoading } = + useLiveInfiniteQuery( + (q) => + q + .from({ posts: postsCollection }) + .orderBy(({ posts }) => posts.createdAt, "desc"), + { + pageSize: 20, + getNextPageParam: (lastPage, allPages) => + lastPage.length === 20 ? allPages.length : undefined, + } + ) + + if (isLoading) return
Loading...
+ + return ( +
+ {pages.map((page, i) => ( +
+ {page.map((post) => ( + + ))} +
+ ))} + {hasNextPage && ( + + )} +
+ ) + } + ``` + + **Requirements:** + - Query must include `.orderBy()` for the window mechanism to work + - Returns flattened `data` array and `pages` array for flexible rendering + - Automatically detects new pages when data is synced to the collection + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.31 ### Patch Changes diff --git a/packages/react-db/package.json b/packages/react-db/package.json index 8bc45346c..424e58739 100644 --- a/packages/react-db/package.json +++ b/packages/react-db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/react-db", "description": "React integration for @tanstack/db", - "version": "0.1.31", + "version": "0.1.32", "author": "Kyle Mathews", "license": "MIT", "repository": { diff --git a/packages/rxdb-db-collection/CHANGELOG.md b/packages/rxdb-db-collection/CHANGELOG.md index 2dbf41f25..1502e6e3a 100644 --- a/packages/rxdb-db-collection/CHANGELOG.md +++ b/packages/rxdb-db-collection/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/rxdb-db-collection +## 0.1.21 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.20 ### Patch Changes diff --git a/packages/rxdb-db-collection/package.json b/packages/rxdb-db-collection/package.json index 29a29e559..a6d3aeae4 100644 --- a/packages/rxdb-db-collection/package.json +++ b/packages/rxdb-db-collection/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/rxdb-db-collection", "description": "RxDB collection for TanStack DB", - "version": "0.1.20", + "version": "0.1.21", "dependencies": { "rxdb": "16.19.1", "@standard-schema/spec": "^1.0.0", diff --git a/packages/solid-db/CHANGELOG.md b/packages/solid-db/CHANGELOG.md index 850e3fa11..3613566e5 100644 --- a/packages/solid-db/CHANGELOG.md +++ b/packages/solid-db/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/react-db +## 0.1.32 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.31 ### Patch Changes diff --git a/packages/solid-db/package.json b/packages/solid-db/package.json index b802f8217..66eae628a 100644 --- a/packages/solid-db/package.json +++ b/packages/solid-db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/solid-db", "description": "Solid integration for @tanstack/db", - "version": "0.1.31", + "version": "0.1.32", "author": "Kyle Mathews", "license": "MIT", "repository": { diff --git a/packages/svelte-db/CHANGELOG.md b/packages/svelte-db/CHANGELOG.md index 088f30462..1af1bf1e3 100644 --- a/packages/svelte-db/CHANGELOG.md +++ b/packages/svelte-db/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/svelte-db +## 0.1.32 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.31 ### Patch Changes diff --git a/packages/svelte-db/package.json b/packages/svelte-db/package.json index 5aa662545..984233032 100644 --- a/packages/svelte-db/package.json +++ b/packages/svelte-db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/svelte-db", "description": "Svelte integration for @tanstack/db", - "version": "0.1.31", + "version": "0.1.32", "dependencies": { "@tanstack/db": "workspace:*" }, diff --git a/packages/trailbase-db-collection/CHANGELOG.md b/packages/trailbase-db-collection/CHANGELOG.md index 4abc98065..71bd90465 100644 --- a/packages/trailbase-db-collection/CHANGELOG.md +++ b/packages/trailbase-db-collection/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/trailbase-db-collection +## 0.1.32 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.1.31 ### Patch Changes diff --git a/packages/trailbase-db-collection/package.json b/packages/trailbase-db-collection/package.json index 7142414ed..9389b5979 100644 --- a/packages/trailbase-db-collection/package.json +++ b/packages/trailbase-db-collection/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/trailbase-db-collection", "description": "TrailBase collection for TanStack DB", - "version": "0.1.31", + "version": "0.1.32", "dependencies": { "@standard-schema/spec": "^1.0.0", "@tanstack/db": "workspace:*", diff --git a/packages/vue-db/CHANGELOG.md b/packages/vue-db/CHANGELOG.md index fa14c5149..146478605 100644 --- a/packages/vue-db/CHANGELOG.md +++ b/packages/vue-db/CHANGELOG.md @@ -1,5 +1,12 @@ # @tanstack/vue-db +## 0.0.65 + +### Patch Changes + +- Updated dependencies [[`63aa8ef`](https://github.com/TanStack/db/commit/63aa8ef8b09960ce0f93e068d41b37fb0503a21a), [`b0687ab`](https://github.com/TanStack/db/commit/b0687ab4c1476362d7a25e3c1704ab0fb0385455)]: + - @tanstack/db@0.4.10 + ## 0.0.64 ### Patch Changes diff --git a/packages/vue-db/package.json b/packages/vue-db/package.json index efc0d01ec..ad46379cf 100644 --- a/packages/vue-db/package.json +++ b/packages/vue-db/package.json @@ -1,7 +1,7 @@ { "name": "@tanstack/vue-db", "description": "Vue integration for @tanstack/db", - "version": "0.0.64", + "version": "0.0.65", "author": "Kyle Mathews", "license": "MIT", "repository": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a725066aa..bd33d6f63 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -196,10 +196,10 @@ importers: specifier: ^5.90.2 version: 5.90.2 '@tanstack/query-db-collection': - specifier: ^0.2.30 + specifier: ^0.2.31 version: link:../../../packages/query-db-collection '@tanstack/react-db': - specifier: ^0.1.31 + specifier: ^0.1.32 version: link:../../../packages/react-db '@tanstack/react-router': specifier: ^1.132.47