rhh4x0R•8mo ago

tRPC + React Query Data Invalidation?

Hey y'all, I'm working with tRPC and React Query and just trying to understand how this works. I have a call that basically sees if the server is online or offline, however, when I disconnect the server I'll get the error eventually on the client, but it won't nullify the query data. Is that normal? Perhaps it just keeps it in the cache -- can I invalidate it to get the proper info? Ex. it'll show online when it's up, but when I turn it off it'll show... error fetching online Not sure why that's the case here.

 const query = trpcReact.health.useQuery();

    return (
        <>
            <h1>Dashboard</h1>
            {query.isLoading ? 'loading...' : null }
            {query.isError ? 'error' : null }
            {query.isFetching ? 'fetching' : 'not fetching'}
            {query.data != null && query.data.ok ? 'online' : 'offline'}

 const query = trpcReact.health.useQuery();

    return (
        <>
            <h1>Dashboard</h1>
            {query.isLoading ? 'loading...' : null }
            {query.isError ? 'error' : null }
            {query.isFetching ? 'fetching' : 'not fetching'}
            {query.data != null && query.data.ok ? 'online' : 'offline'}

3 Replies

rhh4x0ROP•8mo ago

I also tried to switch query.data != undefined, same issue.

Sandvich•8mo ago

Are you as the client turning the server offline or is the client just watching and waiting to see if the server goes offline? If it's the first then you can invalidate the cache yourself if it's the second then the query needs to do polling maybe? or if it's like a websocket connection then you can watch that an when it disconnects invalidate the query Also this seems like a react query question not a tRPC question. Do you want a link to that Discord server?

rhh4x0ROP•8mo ago

Appreciate it. I had it working on an older version of tRPC but now that you mention it I have new versions of react query too. I’ve got it — I’ll ask there. Thank you.