@redux-devtools/rtk-query-monitor v5.2.0

Redux DevTools RTK Query inspector monitor

A monitor that displays RTK query queries and mutations for Redux DevTools.

Created by FaberVitale, inspired by react-query devtools.

Demo

• link
• demo source

Preview

Installation

npm

npm i @redux-devtools/rtk-query-monitor --save

yarn

yarn add @redux-devtools/rtk-query-monitor

Usage

You can use RtkQueryMonitor as the only monitor in your app:

containers/DevTools.js

import React from 'react';
import { createDevTools } from '@redux-devtools/core';
import { RtkQueryrMonitor } from '@redux-devtools/rtk-query-monitor';

export default createDevTools(<RtkQueryrMonitor />);

Then you can render <DevTools> to any place inside app or even into a separate popup window.

Alternatively, you can use it together with DockMonitor to make it dockable.

See also

• DockMonitor README

• Read how to start using Redux DevTools.

• Redux Devtools walkthrough

Features

• sorts active queries and mutations in ascending or descending order by:
  • fulfilledTimeStamp
  • query key
  • query status
  • endpoint
  • api reducerPath
• filters active queries and mutations by:
  • fulfilledTimeStamp
  • query key
  • query status
  • endpoint
  • api reducerPath
• toggleable regular expression search
• Displays
  • status flags
  • query state
  • tags
  • subscriptions
  • api state
  • api stats
  • actions relevant to the selected query or mutation

Redux DevTools props

Development

Start Demo

pnpm --filter "rtk-query-demo" start

License

MIT