mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2024-11-27 12:03:56 +03:00
a4c987fc1f
- remotedev-redux-devtools-extension@3.0.1 - d3-state-visualizer@1.5.0 - d3tooltip@2.0.0 - map2tree@2.0.0 - react-base16-styling@0.9.0 - react-dock@0.5.0 - react-json-tree@0.16.0 - @redux-devtools/app@2.0.0 - @redux-devtools/chart-monitor@2.0.0 - @redux-devtools/cli@1.0.1 - @redux-devtools/dock-monitor@2.0.0 - @redux-devtools/extension@3.1.0 - @redux-devtools/inspector-monitor-test-tab@0.8.0 - @redux-devtools/inspector-monitor-trace-tab@0.3.0 - @redux-devtools/inspector-monitor@2.0.0 - @redux-devtools/instrument@2.0.0 - @redux-devtools/log-monitor@3.0.0 - @redux-devtools/remote@0.7.0 - @redux-devtools/rtk-query-monitor@2.0.0 - @redux-devtools/serialize@0.4.0 - @redux-devtools/slider-monitor@3.0.0 - @redux-devtools/ui@1.1.0 - @redux-devtools/utils@1.1.0 - @redux-devtools/core@3.10.0 - d3-state-visualizer-tree-example@0.1.3 - react-dock-demo@0.1.3 - react-json-tree-example@1.1.5 - test-demo@0.1.3 - inspector-demo@0.1.3 - rtk-query-demo@0.1.3 - slider-todomvc@0.1.5 - counter-redux@0.1.5 - todomvc@0.2.4 |
||
---|---|---|
.. | ||
demo | ||
src | ||
.babelrc | ||
.eslintignore | ||
.eslintrc.js | ||
LICENSE.md | ||
monitor-demo.gif | ||
package.json | ||
README.md | ||
rollup.config.js | ||
tsconfig.json |
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
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
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
Name | Description |
---|---|
theme |
Either a string referring to one of the themes provided by redux-devtools-themes (feel free to contribute!) or a custom object of the same format. Optional. By default, set to 'nicinabox' . |
invertTheme |
Boolean value that will invert the colors of the selected theme. Optional. By default, set to false |
Development
Start Demo
yarn lerna run start --stream --scope @redux-devtools/rtk-query-monitor