Skip to content

RTK Query - Setting a query to failed programaticallyΒ #2685

@Lukas-Kullmann

Description

@Lukas-Kullmann

In the docs, there is a section about streaming updates: https://redux-toolkit.js.org/rtk-query/usage/streaming-updates

However, there is no recommendation on how to handle errors for those updates. An example for an error in a streaming update is a malformed payload.

In our application, we would like to set the whole query into an error state if there is a streaming update. So for us it does not matter if the original query failed or if there was a problem with a streaming update.
It would be great if there was a method to set the query into a failed state for this use case.

I played around a bit and noticed that I can just build and dispatch the rejected action manually. But that feels super weird. I would rather have a method that builds that action for me.
Did I miss this functionality? What's the recommended way of handling errors for streaming updates?

Here's an example snippet on how I set the error:

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

  try {
    await cacheDataLoaded

    const listener = (event: MessageEvent) => {
      try {
        const data = JSON.parse(event.data)
        if (!isMessage(data) || data.channel !== arg) return

          updateCachedData((draft) => {
            draft.push(data)
          })
      } catch (error) {
        // example: JSON.parse failed

        dispatch({
          type: 'myApi/executeQuery/rejected',
          payload: error,
          meta: {
            requestId,
            rejectedWithValue: Boolean(error),
            requestStatus: 'rejected',
            aborted: false,
            condition: false,
            arg: {
              type: 'query',
              subscribe: true,
              subscriptionOptions: { pollingInterval: 0 },
              endpointName: 'endpointName',
              originalArgs: queryArg,
              queryCacheKey: `endpointName(${JSON.stringify(queryArg)})`,
            },
          },
          error: { message: 'Rejected' },
        });
      }
    }

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

  await cacheEntryRemoved
  ws.close()
},

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions