tRPC•3mo ago

Keep subscription `.data` after stopping (Tanstack Query)

It looks like

mySubscription.data

mySubscription.data

mySubscription.data

mySubscription.data is

undefined

undefined

after the subscription stops from the server side (returning from generator function).

Can I keep this data without introducing my own

useState

useState

and leverage Tanstack Query instead?

I'm using the old React Query integration because there's no documentation for the new integration for subscriptions (i.e.

useSubscription(trpc.mySub.useOptions())

useSubscription(trpc.mySub.useOptions())

useSubscription(trpc.mySub.useOptions())

useSubscription(trpc.mySub.useOptions()) ).

const trpc = createTRPCReact<AppRouter>()
const trpcClient = trpc.createClient({...})

const trpc = createTRPCReact<AppRouter>()
const trpcClient = trpc.createClient({...})

const trpc = createTRPCReact<AppRouter>()
const trpcClient = trpc.createClient({...})

const trpc = createTRPCReact<AppRouter>()
const trpcClient = trpc.createClient({...})

Nick•10/6/25, 4:05 PM

Just on the docs point, what's missing from here that you would want? https://trpc.io/docs/client/tanstack-react-query/usage#subscriptionOptions

TanStack React Query | tRPC

TanStack React Query usage

Nick•10/6/25, 4:06 PM

It's a good idea to retain the data, though to avoid a breaking change I would think that needs to be a config setting retainDataOnStop or something

In general the API is designed for you to use your own useState because that gives you total flexibility, but we did play with the idea of having a reducer style API on useSubscription to cover various use cases before settling on a simpler API

NNick Just on the docs point, what's missing from here that you would want? https://tr...

functiondjOP•10/6/25, 5:52 PM

my bad, i just didn't find that section when searching for "trpc useSubscription" and similar.

edit: maybe searching useSubscriptionuseSubscription should rank that section high in the results because by default it will only show if the search results are expanded, even though it's (imo) much more relevant than the different subsections of the classic react query integration or the migration details.

to find this section you either need to go through more of the documentation and discover the section, or you need to know beforehand that you must search for "subscriptionoption".

NNick It's a good idea to retain the data, though to avoid a breaking change I would t...

functiondjOP•10/6/25, 5:55 PM

It's a good idea to retain the data, though to avoid a breaking change I would think that needs to be a config setting retainDataOnStop or something

i think that would be a win for this API to save some manual state management. it's also a nice complement to the state management that the tanstack query integration already does, just like you can easily use the last yielded data to render e.g. progress info until the subscription procedure returns.

In general the API is designed for you to use your own useState because that gives you total flexibility, but we did play with the idea of having a reducer style API on useSubscription to cover various use cases before settling on a simpler API

i also thought that could be cool but it's probably not worth the complexity and it's easy enough for users like me that want to keep data beyond a given yieldyield to simply add the previous data to the following yieldyield statements, like through an object. that way users have more control and the system stays simple.

functiondjOP•10/6/25, 5:56 PM

tl;dr i see value in a retainDataOnStopretainDataOnStop setting and i agree that more sophisticated mechanics are not necessary.

Ffunctiondj my bad, i just didn't find that section when searching for "trpc useSubscription...

functiondjOP•10/6/25, 5:59 PM

can't edit to add an attachment screenshot so here it is

Ffunctiondj can't edit to add an attachment screenshot so here it is

Nick•10/6/25, 10:11 PM

Weird we might need to kick the index