Infinite Query Docs - #2390
Merged
Merged
Conversation
Contributor
📝 WalkthroughWalkthroughThis pull request adds documentation infrastructure for an Infinite Queries feature. A new navigation link entry is added to the "Working with data" section, and a comprehensive documentation page is created explaining the Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Suggested reviewers
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
📝 Coding Plan
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Contributor
|
View Vercel preview at instant-www-js-drewh-inf-q-docs-jsv.vercel.app. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (2)
client/www/pages/docs/infinite-queries.md (2)
61-61: Simplify redundant phrase.The phrase "returning back" is redundant; "returning" alone conveys the meaning.
✍️ Optional style improvement
-Changing any part of the query will result in a full reset of all data, returning back to a state with only one page loaded. +Changing any part of the query will result in a full reset of all data, returning to a state with only one page loaded.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` at line 61, Edit the sentence that currently reads "Changing any part of the query will result in a full reset of all data, returning back to a state with only one page loaded." and remove the redundant word "back" so it reads "Changing any part of the query will result in a full reset of all data, returning to a state with only one page loaded." — update the line containing that exact sentence in infinite-queries.md.
50-50: Consider more formal verb choice.The phrase "get created" could be replaced with "are created" for a more formal documentation tone.
✍️ Optional style improvement
-Any new posts that get created will automatically appear at the top, and as the user scrolls, the `loadNextPage` can load older posts as needed. +Any new posts that are created will automatically appear at the top, and as the user scrolls, the `loadNextPage` can load older posts as needed.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` at line 50, Change the informal phrasing in the sentence containing "get created" to a more formal tense: replace "Any new posts that get created will automatically appear at the top" with "Any new posts that are created will automatically appear at the top" (the sentence that also references loadNextPage for loading older posts).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Line 10: Update the phrase "top level namespace" to the hyphenated form
"top-level namespace" in the sentence inside the infinite-queries.md content
(the sentence mentioning only one top level namespace is allowed) so the
compound adjective is correctly hyphenated; ensure the change appears wherever
that exact phrase occurs in the file.
- Line 8: The documentation sentence about useInfiniteQuery is incomplete:
update the description to mention that useInfiniteQuery returns not just the
list of data, canLoadNextPage, and loadNextPage, but also error and isLoading
(so it matches the example destructuring). Edit the paragraph referencing the
useInfiniteQuery hook to list all five return values (data list,
canLoadNextPage, loadNextPage, error, isLoading) and ensure the wording matches
the example shown later in the file.
- Around line 39-40: The example incorrectly calls data.map(...) even though the
query returns an object shaped like { posts: [...] }; update the rendering to
iterate over data.posts instead (e.g., use data.posts.map(post => <Post
key={post.id} post={post} />)), and add a null-safe guard (data && data.posts or
optional chaining data?.posts) to avoid runtime errors when data is undefined;
adjust the block that renders <Post key={post.id} post={post} /> accordingly.
---
Nitpick comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Line 61: Edit the sentence that currently reads "Changing any part of the
query will result in a full reset of all data, returning back to a state with
only one page loaded." and remove the redundant word "back" so it reads
"Changing any part of the query will result in a full reset of all data,
returning to a state with only one page loaded." — update the line containing
that exact sentence in infinite-queries.md.
- Line 50: Change the informal phrasing in the sentence containing "get created"
to a more formal tense: replace "Any new posts that get created will
automatically appear at the top" with "Any new posts that are created will
automatically appear at the top" (the sentence that also references loadNextPage
for loading older posts).
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 7d2cc889-b5d1-4d6c-963e-674115cf4f3d
📒 Files selected for processing (2)
client/www/data/docsNavigation.jsclient/www/pages/docs/infinite-queries.md
stopachka
reviewed
Mar 19, 2026
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (1)
client/www/pages/docs/infinite-queries.md (1)
8-8:⚠️ Potential issue | 🟡 MinorClarify all returned fields from
useInfiniteQuery.Line 8 still reads as if only pagination fields are “new,” but the example on Line 20 destructures
errorandisLoadingtoo. Please explicitly list all returned fields for consistency with the snippet.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` at line 8, Update the docs text around useInfiniteQuery to list all returned fields returned by the hook (not just pagination ones): explicitly mention canLoadNextPage and loadNextPage plus the standard query fields like error, isLoading (and any other fields mirrored from useQuery) so the prose matches the example that destructures error and isLoading; adjust the sentence that currently highlights only pagination to enumerate these symbols (useInfiniteQuery, canLoadNextPage, loadNextPage, error, isLoading) for clarity and consistency with the snippet.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Line 58: The example query literal `{todos: {$: {limit: 20, order: createdAt:
"asc"}}}` contains malformed object syntax for the order clause; update the
example so the order parameter is a proper object (e.g., use order: {createdAt:
"asc"}) so the full example becomes a valid query object and will copy/paste
without syntax errors.
- Around line 71-85: The example uses db.subscribeInfiniteQuery with the
callback incorrectly nested inside the query object; update the call to follow
the correct signature subscribeInfiniteQuery(query, callback, opts?) by passing
the query object as the first argument and the callback (which reads
resp.data.posts and resp.canLoadNextPage) as the second argument, leaving
unsubscribe and loadNextPage destructured from the returned object; ensure the
query remains the same (posts: { $: { limit: 20, order: { createdAt: 'desc' } }
}) and that the callback is a separate parameter.
---
Duplicate comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Line 8: Update the docs text around useInfiniteQuery to list all returned
fields returned by the hook (not just pagination ones): explicitly mention
canLoadNextPage and loadNextPage plus the standard query fields like error,
isLoading (and any other fields mirrored from useQuery) so the prose matches the
example that destructures error and isLoading; adjust the sentence that
currently highlights only pagination to enumerate these symbols
(useInfiniteQuery, canLoadNextPage, loadNextPage, error, isLoading) for clarity
and consistency with the snippet.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: d5216f47-0e5f-4bd8-b310-ed8c0f557198
📒 Files selected for processing (1)
client/www/pages/docs/infinite-queries.md
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (1)
client/www/pages/docs/infinite-queries.md (1)
58-58:⚠️ Potential issue | 🟠 MajorFix the malformed
orderobject in the reactivity example.Line 58 is not valid object syntax, so this snippet cannot be copy/pasted.
orderneeds to be an object:order: { createdAt: "asc" }.🛠️ Proposed fix
-For example, with `{todos: {$: {limit: 20, order: createdAt: "asc"}}}` (showing oldest todos first) +For example, with `{todos: {$: {limit: 20, order: {createdAt: "asc"}}}}` (showing oldest todos first)#!/bin/bash # Verify the malformed object literal in the docs example. sed -n '56,60p' client/www/pages/docs/infinite-queries.md🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` at line 58, The example object literal `{todos: {$: {limit: 20, order: createdAt: "asc"}}}` is malformed; update the `order` field to be an object by changing that snippet to `{todos: {$: {limit: 20, order: { createdAt: "asc" }}}}` so the reactivity example is valid and copy/pasteable—search for the `{todos: {$: {limit: 20, order:` snippet to locate and fix it.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@client/www/lib/swrCache.ts`:
- Around line 14-29: The block in swrCache.ts calling db.subscribeInfiniteQuery
(and using unsubscribe, loadNextPage and resp.data.posts) must be removed from
module scope: db is not declared, the callback assumes resp.data is present
(unsafe access to resp.data.posts) and unsubscribe is never stored/called
causing a leak; either move this snippet to a docs/example file or wrap it
behind an explicit initialization API (e.g., an initSubscribe function) that
accepts a db instance, checks the response union before accessing data,
returns/stores the unsubscribe function for proper cleanup, and ensures errors
are handled before using resp.data.posts.
In `@client/www/pages/docs/infinite-queries.md`:
- Around line 71-87: Update the Vanilla JS example for db.subscribeInfiniteQuery
to guard the discriminated union response by checking resp.error versus
resp.data before accessing resp.data.posts (e.g., handle the error case by
logging or showing resp.error.message) and demonstrate the teardown pattern by
showing how to call the captured unsubscribe function (from the const {
unsubscribe, loadNextPage } = db.subscribeInfiniteQuery(...) tuple) when
cleaning up (for example in a returned cleanup function or on window unload) so
consumers see both error handling and proper unsubscription.
---
Duplicate comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Line 58: The example object literal `{todos: {$: {limit: 20, order: createdAt:
"asc"}}}` is malformed; update the `order` field to be an object by changing
that snippet to `{todos: {$: {limit: 20, order: { createdAt: "asc" }}}}` so the
reactivity example is valid and copy/pasteable—search for the `{todos: {$:
{limit: 20, order:` snippet to locate and fix it.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 159d0db8-eeea-4b42-b5fe-50ea12859540
📒 Files selected for processing (2)
client/www/lib/swrCache.tsclient/www/pages/docs/infinite-queries.md
drew-harris
force-pushed
the
drewh/inf-q-docs
branch
from
March 19, 2026 22:32
0502a74 to
eed0dcc
Compare
Contributor
There was a problem hiding this comment.
♻️ Duplicate comments (2)
client/www/pages/docs/infinite-queries.md (2)
71-87:⚠️ Potential issue | 🟠 MajorAdd error handling and cleanup pattern to the example.
The callback accesses
resp.data.postswithout checking forresp.error, which will fail when errors occur. Additionally, whileunsubscribeis captured, the documentation doesn't demonstrate when or how to call it for proper cleanup.🛡️ Suggested enhancement
const { unsubscribe, loadNextPage } = db.subscribeInfiniteQuery( { posts: { $: { limit: 20, // Load 20 posts at a time order: { createdAt: 'desc', }, }, }, }, (resp) => { + if (resp.error) { + console.error('Error:', resp.error.message); + return; + } console.log('Posts: ', resp.data.posts); console.log('Can Load More ?', resp.canLoadNextPage); }, ); + +// Clean up the subscription when no longer needed: +// unsubscribe();🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` around lines 71 - 87, Update the subscribeInfiniteQuery example to handle errors and demonstrate cleanup: inside the callback passed to db.subscribeInfiniteQuery (the resp handler) check resp.error before accessing resp.data.posts and handle/log it (early return on error), and show calling unsubscribe (captured from const { unsubscribe, loadNextPage }) in a cleanup pattern (e.g., in a useEffect return or on component unmount) to avoid leaks; reference the subscribeInfiniteQuery call, the resp parameter, and the unsubscribe identifier so readers can locate and implement the checks and cleanup.
58-58:⚠️ Potential issue | 🔴 CriticalFix invalid query syntax.
The inline query has malformed JavaScript syntax. The
orderparameter requires an object with the field as a key, notorder: createdAt: "asc".🐛 Proposed fix
-For example, with `{todos: {$: {limit: 20, order: createdAt: "asc"}}}` (showing oldest todos first) +For example, with `{todos: {$: {limit: 20, order: {createdAt: "asc"}}}}` (showing oldest todos first)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` at line 58, The example inline query `{todos: {$: {limit: 20, order: createdAt: "asc"}}}` has invalid JavaScript for the `order` parameter; update the docs to use an object for `order` (i.e., set `order` to an object whose key is the field name and value is the sort direction) so the example becomes valid JavaScript—locate the example string in the docs and replace the malformed `order: createdAt: "asc"` with the proper object form.
🧹 Nitpick comments (1)
client/www/pages/docs/infinite-queries.md (1)
15-16: Remove unused import.The
initfunction is imported at line 15 but never used. The example importsdbdirectly from"../db", which suggestsdbis already initialized elsewhere. Consider removing the unused import to avoid confusion.♻️ Suggested fix
-import { init } from '@instantdb/react'; import { db } from "../db"🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@client/www/pages/docs/infinite-queries.md` around lines 15 - 16, Remove the unused import of init from '@instantdb/react' since it is not referenced in this file; keep the direct import of db (from "../db") which indicates initialization occurs elsewhere. Locate the import statement that includes init and delete just that import token (or the entire import line if it only imports init) so only the necessary import of db remains, ensuring no other code paths reference init in this module.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Around line 71-87: Update the subscribeInfiniteQuery example to handle errors
and demonstrate cleanup: inside the callback passed to db.subscribeInfiniteQuery
(the resp handler) check resp.error before accessing resp.data.posts and
handle/log it (early return on error), and show calling unsubscribe (captured
from const { unsubscribe, loadNextPage }) in a cleanup pattern (e.g., in a
useEffect return or on component unmount) to avoid leaks; reference the
subscribeInfiniteQuery call, the resp parameter, and the unsubscribe identifier
so readers can locate and implement the checks and cleanup.
- Line 58: The example inline query `{todos: {$: {limit: 20, order: createdAt:
"asc"}}}` has invalid JavaScript for the `order` parameter; update the docs to
use an object for `order` (i.e., set `order` to an object whose key is the field
name and value is the sort direction) so the example becomes valid
JavaScript—locate the example string in the docs and replace the malformed
`order: createdAt: "asc"` with the proper object form.
---
Nitpick comments:
In `@client/www/pages/docs/infinite-queries.md`:
- Around line 15-16: Remove the unused import of init from '@instantdb/react'
since it is not referenced in this file; keep the direct import of db (from
"../db") which indicates initialization occurs elsewhere. Locate the import
statement that includes init and delete just that import token (or the entire
import line if it only imports init) so only the necessary import of db remains,
ensuring no other code paths reference init in this module.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: f19a2a1f-8fbd-4b76-8ffb-4c0810f45c78
📒 Files selected for processing (1)
client/www/pages/docs/infinite-queries.md
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds user docs page for infinite query.
https://instant-www-js-drewh-inf-q-docs-jsv.vercel.app/docs/infinite-queries