How to propagate errors to query hooks when using RTK Query streaming updates?

[BenJetson]

Hello, all.

I am developing an application using RTK Query that integrates with websockets. I followed the instructions for Streaming Updates and I have been able to get data with live updates in my app!

One thing I haven't been able to figure out is how to indicate error conditions with streaming updates.

Let's assume that I have a component which uses this query that supports steaming updates:

function DataView() {
  const { data, error } = useMessageStreamingQuery();

  if (error) {
    return (
      <>
        <h1>There was a problem!</h1>
        <pre>{JSON.stringify(error)}</pre>
      </>
    );
  }

  return (
      <>
        <h1>Found the data!</h1>
        <p>This will keep updating, no need to refresh.</p>

        <pre>{JSON.stringify(data)}</pre>
      </>
    );
}

This follows the standard pattern in the docs for Error Handling. If this was an ordinary query, a request error would properly display here.

The problem I encounter is trying to indicate errors in onCacheEntryAdded. Say the initial request returns data successfully, and you receive a few updates. Some time later, the server sends back a message over the socket indicating an error has occurred (like perhaps login tokens expired or service unavailable etc).

Here's a modified copy of the example from the streaming update docs:

async onCacheEntryAdded(
  arg,
  { updateCachedData, cacheDataLoaded, cacheEntryRemoved }
) {
  const ws = new WebSocket('ws://localhost:8080')
  try {
    await cacheDataLoaded

    const listener = (event) => {
      const response = JSON.parse(event.data)

      if (response.error === undefined) {
        updateCachedData((draft) => {
          draft.push(response.data)
        })
      } else {
        // XXX how do I handle here so that the use hook will indicate errors?
      }

    }

    ws.addEventListener('message', listener)
  } catch {}

  await cacheEntryRemoved
  ws.close()
}

There doesn't seem to be a way to push an error through at point // XXX in a way that the useMessageStreamingQuery() hook will receive the error message. Does anyone know of a way to do this?

[markerikson]

Pasting my answer from #4993:

The short answer is that RTK Query is meant to track the status of a promise and cache its result. The lifecycle methods let you kick off additional side effect logic, but essentially anything you do in there is then outside the scope of RTK Query's cache entry.

So, while RTKQ gives you space to write additional logic, any status you would want to track regarding some external connection would need to be handled separately yourself.

Beyond that, we don't currently have a way to force a cache entry to have an errored status.