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'}

 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'}

tRPC + React Query Data Invalidation?

Similar Threads

Similar Threads

Similar Threads