T
TanStack2mo ago
metropolitan-bronze

Is it possible to useLiveSuspenseQuery?

I am converting some useSuspenseQuery to using tanstack/db and would like to mirror the same suspense behavior so that react will suspend at least until the query's initial loading is complete. My AI coding helper suggested I add an options object to the useLiveQuery(query, { suspense: true }) -- but this is not a real option! actually I can't find the word "suspense" or "suspend" anywhere in the documentation at all. As a backup I have a route loader that is doing an await, like this:
const data = (await myProfileCollection.toArrayWhenReady()).at(0)
const data = (await myProfileCollection.toArrayWhenReady()).at(0)
But even this looks like I'm doing it a little wrong. The AI also tried to get me to do await myProfileCollection.sync.awaited but that also didn't work, and, again, isn't quite the same convenience as having a suspense-ified query option like a useLiveSuspenseQuery() .
4 Replies
rival-black
rival-black2mo ago
I think collections have preload, and you can call that in the loader. Last time I checked, the implementation of tanstack db didn't support suspense. Though I think it can be added relatively easily if we use the new use hook introduced by react. But then it would lock the rest of the react users who haven't updated to the version of react which introduced the hook out. Might be easily fixable by introducing the useLiveSuspenseQuery(). Which will use use under the hood to load the data from the promise and subscribe for update from then on wards. I'm working on a POC, will probably have an PR up this weekend. Dunno if it'll be merged though.
rival-black
rival-black2mo ago
Found this issue: https://github.com/TanStack/db/issues/545 Seems like it's being discussed/planned.
GitHub
Add SSR & RSC Support for @tanstack/react-db · Issue #545 · TanSt...
Summary Add server-side rendering (SSR) and React Server Components (RSC) support to @tanstack/react-db following patterns similar to TanStack Query's implementation. This will enable React app...
metropolitan-bronze
metropolitan-bronzeOP2mo ago
yes I see there's a PR even ! https://github.com/TanStack/db/pull/709 hooray
GitHub
feat: Add SSR/RSC support for live queries in @tanstack/react-db by...
Implements SSR (Server-Side Rendering) and RSC (React Server Components) support for live queries, following TanStack Query's hydration patterns. Key Features Server-side query execution: ...
xenial-black
xenial-black2mo ago
Should land next week 👍

Did you find this page helpful?