chore(rtk-query): rename package to '@redux-devtools/rtk-query-monitor'

packages/redux-devtools-app/package.json

@@ -43,7 +43,7 @@
     "@redux-devtools/inspector-monitor-test-tab": "^0.7.2",
     "@redux-devtools/inspector-monitor-trace-tab": "^0.2.2",
     "@redux-devtools/log-monitor": "^2.3.0",
-    "@redux-devtools/rtk-query-inspector-monitor": "^1.0.0",
+    "@redux-devtools/rtk-query-monitor": "^1.0.0",
     "@redux-devtools/slider-monitor": "^2.0.0-8",
     "@reduxjs/toolkit": "^1.6.0",
     "d3-state-visualizer": "^1.4.0",

packages/redux-devtools-app/src/utils/getMonitor.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import LogMonitor from '@redux-devtools/log-monitor';
 import ChartMonitorWrapper from '../containers/monitors/ChartMonitorWrapper';
 import InspectorWrapper from '../containers/monitors/InspectorWrapper';
-import RtkQueryInspectorMonitor from '@redux-devtools/rtk-query-inspector-monitor/lib/RtkQueryInspectorMonitor';
+import RtkQueryMonitor from '@redux-devtools/rtk-query-monitor';
 
 export const monitors = [
   { value: 'InspectorMonitor', name: 'Inspector' },
@@ -20,7 +20,7 @@ export default function getMonitor({ monitor }: { monitor: string }) {
     case 'ChartMonitor':
       return <ChartMonitorWrapper />;
     case 'RtkQueryMonitor':
-      return <RtkQueryInspectorMonitor />;
+      return <RtkQueryMonitor />;
     default:
       return <InspectorWrapper />;
   }

packages/redux-devtools-rtk-query-inspector-monitor/src/index.ts

@@ -1,2 +0,0 @@
-export { default } from './RtkQueryInspectorMonitor';
-export { ExternalProps } from './types';

packages/redux-devtools-rtk-query-monitor/README.md

@@ -7,7 +7,7 @@ Created by [FaberVitale](https://github.com/FaberVitale), inspired by [react-que
 ## Demo
 
 - [link](https://rtk-query-monitor-demo.netlify.app/)
-- [demo source](https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-inspector-monitor/demo)
+- [demo source](https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-monitor/demo)
 
 ## Preview
 
@@ -18,27 +18,27 @@ Created by [FaberVitale](https://github.com/FaberVitale), inspired by [react-que
 ### npm
 
 ```bash
-npm i @redux-devtools/rtk-query-inspector-monitor --save
+npm i @redux-devtools/rtk-query-monitor --save
 ```
 
 ### yarn
 
 ```bash
-yarn add @redux-devtools/rtk-query-inspector-monitor
+yarn add @redux-devtools/rtk-query-monitor
 ```
 
 ## Usage
 
-You can use `RtkQueryInspectorMonitor` as the only monitor in your app:
+You can use `RtkQueryMonitor` as the only monitor in your app:
 
 ##### `containers/DevTools.js`
 
 ```ts
 import React from 'react';
 import { createDevTools } from '@redux-devtools/core';
-import RtkQueryInspectorMonitor from '@redux-devtools/rtk-query-inspector-monitor';
+import RtkQueryrMonitor from '@redux-devtools/rtk-query-monitor';
 
-export default createDevTools(<RtkQueryInspectorMonitor />);
+export default createDevTools(<RtkQueryrMonitor />);
 ```
 
 Then you can render `<DevTools>` to any place inside app or even into a separate popup window.

packages/redux-devtools-rtk-query-monitor/demo/README.md

@@ -15,11 +15,11 @@ yarn
 ### 2. Install demo dependencies
 
 ```bash
-yarn exec --cwd 'packages/redux-devtools-rtk-query-inspector-monitor/demo' yarn
+yarn exec --cwd 'packages/redux-devtools-rtk-query-monitor/demo' yarn
 ```
 
 ### 3. Start demo
 
 ```bash
-yarn lerna run --stream start --scope '@redux-devtools/rtk-query-inspector-monitor'
+yarn lerna run --stream start --scope '@redux-devtools/rtk-query-monitor'
 ```

packages/redux-devtools-rtk-query-monitor/demo/package.json

@@ -1,10 +1,15 @@
 {
-  "name": "rtk-query-imspector-monitor-demo",
+  "name": "rtk-query-monitor-demo",
+  "version": "1.0.0",
   "private": true,
   "scripts": {
     "start": "cross-env SKIP_PREFLIGHT_CHECK=true react-scripts start",
     "build": "cross-env SKIP_PREFLIGHT_CHECK=true react-scripts build"
   },
+  "author": {
+    "name": "FaberVitale",
+    "url": "https://github.com/FaberVitale"
+  },
   "dependencies": {
     "@chakra-ui/react": "1.0.0",
     "@emotion/react": "^11.4.0",

packages/redux-devtools-rtk-query-monitor/demo/src/App.tsx

@@ -29,7 +29,7 @@ export function App() {
             <Link
               className="link"
               isExternal
-              href="https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-inspector-monitor/demo"
+              href="https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-monitor/demo"
             >
               demo source
             </Link>
@@ -38,9 +38,9 @@ export function App() {
             <Link
               className="link"
               isExternal
-              href="https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-inspector-monitor"
+              href="https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-monitor"
             >
-              @redux-devtools/rtk-query-inspector-monitor source
+              @redux-devtools/rtk-query-monitor source
             </Link>
           </ListItem>
           <ListItem>

packages/redux-devtools-rtk-query-monitor/demo/src/DevTools.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { createDevTools } from '@redux-devtools/core';
 import DockMonitor from '@redux-devtools/dock-monitor';
-import RtkQueryInspectorMonitor from './build/RtkQueryInspectorMonitor.js';
+import RtkQueryMonitor from './build/RtkQueryMonitor.js';
 
 export default createDevTools(
   <DockMonitor
@@ -9,6 +9,6 @@ export default createDevTools(
     changePositionKey="ctrl-q"
     changeMonitorKey="ctrl-m"
   >
-    <RtkQueryInspectorMonitor />
+    <RtkQueryMonitor />
   </DockMonitor>
 );

packages/redux-devtools-rtk-query-monitor/demo/yarn.lock

@@ -14985,9 +14985,9 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"rtk-query-imspector-monitor-demo@workspace:.":
+"rtk-query-monitor-demo@workspace:.":
   version: 0.0.0-use.local
-  resolution: "rtk-query-imspector-monitor-demo@workspace:."
+  resolution: "rtk-query-monitor-demo@workspace:."
   dependencies:
     "@chakra-ui/react": 1.0.0
     "@emotion/react": ^11.4.0

packages/redux-devtools-rtk-query-monitor/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@redux-devtools/rtk-query-inspector-monitor",
+  "name": "@redux-devtools/rtk-query-monitor",
   "version": "1.0.0",
   "description": "rtk-query monitor for Redux DevTools",
   "keywords": [
@@ -10,7 +10,7 @@
     "redux-toolkit",
     "rtk-query"
   ],
-  "homepage": "https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-inspector-monitor",
+  "homepage": "https://github.com/FaberVitale/redux-devtools/tree/feat/rtk-query-monitor/packages/redux-devtools-rtk-query-monitor",
   "bugs": {
     "url": "https://github.com/reduxjs/redux-devtools/issues"
   },

packages/redux-devtools-rtk-query-monitor/src/RtkQueryInspector.tsx

@@ -7,7 +7,7 @@ import {
   QueryFormValues,
   QueryInfo,
   QueryPreviewTabs,
-  RtkQueryInspectorMonitorState,
+  RtkQueryMonitorState,
   StyleUtils,
 } from './types';
 import { createInspectorSelectors, computeSelectorSource } from './selectors';
@@ -23,12 +23,12 @@ import { getApiStateOf, getQuerySubscriptionsOf } from './utils/rtk-query';
 
 type SelectorsSource<S> = {
   userState: S | null;
-  monitorState: RtkQueryInspectorMonitorState;
+  monitorState: RtkQueryMonitorState;
 };
 
 export interface RtkQueryInspectorProps<S, A extends Action<unknown>>
-  extends LiftedState<S, A, RtkQueryInspectorMonitorState> {
+  extends LiftedState<S, A, RtkQueryMonitorState> {
-  dispatch: Dispatch<LiftedAction<S, A, RtkQueryInspectorMonitorState>>;
+  dispatch: Dispatch<LiftedAction<S, A, RtkQueryMonitorState>>;
   theme: keyof typeof themes | Base16Theme;
   invertTheme: boolean;
   state: S | null;

packages/redux-devtools-rtk-query-monitor/src/RtkQueryMonitor.tsx

@@ -5,8 +5,8 @@ import RtkQueryInspector from './RtkQueryInspector';
 import { reducer } from './reducers';
 import {
   ExternalProps,
-  RtkQueryInspectorMonitorProps,
+  RtkQueryMonitorProps,
-  RtkQueryInspectorMonitorState,
+  RtkQueryMonitorState,
   StyleUtils,
 } from './types';
 import {
@@ -19,13 +19,13 @@ interface DefaultProps {
   invertTheme: boolean;
 }
 
-export interface RtkQueryInspectorComponentState {
+export interface RtkQueryComponentState {
   readonly styleUtils: StyleUtils;
 }
 
-class RtkQueryInspectorMonitor<S, A extends Action<unknown>> extends Component<
+class RtkQueryMonitor<S, A extends Action<unknown>> extends Component<
-  RtkQueryInspectorMonitorProps<S, A>,
+  RtkQueryMonitorProps<S, A>,
-  RtkQueryInspectorComponentState
+  RtkQueryComponentState
 > {
   static update = reducer;
 
@@ -46,7 +46,7 @@ class RtkQueryInspectorMonitor<S, A extends Action<unknown>> extends Component<
     invertTheme: false,
   };
 
-  constructor(props: RtkQueryInspectorMonitorProps<S, A>) {
+  constructor(props: RtkQueryMonitorProps<S, A>) {
     super(props);
 
     this.state = {
@@ -73,13 +73,13 @@ class RtkQueryInspectorMonitor<S, A extends Action<unknown>> extends Component<
   }
 }
 
-export default RtkQueryInspectorMonitor as unknown as React.ComponentType<
+export default RtkQueryMonitor as unknown as React.ComponentType<
   ExternalProps<unknown, Action<unknown>>
 > & {
   update(
     monitorProps: ExternalProps<unknown, Action<unknown>>,
-    state: RtkQueryInspectorMonitorState | undefined,
+    state: RtkQueryMonitorState | undefined,
     action: Action
-  ): RtkQueryInspectorMonitorState;
+  ): RtkQueryMonitorState;
   defaultProps: DefaultProps;
 };

packages/redux-devtools-rtk-query-monitor/src/components/QueryList.tsx

@@ -1,11 +1,11 @@
 import React, { PureComponent, ReactNode } from 'react';
 import { StyleUtilsContext } from '../styles/createStylingFromTheme';
-import { QueryInfo, RtkQueryInspectorMonitorState } from '../types';
+import { QueryInfo, RtkQueryMonitorState } from '../types';
 import { isQuerySelected } from '../utils/rtk-query';
 
 export interface QueryListProps {
   queryInfos: QueryInfo[];
-  selectedQueryKey: RtkQueryInspectorMonitorState['selectedQueryKey'];
+  selectedQueryKey: RtkQueryMonitorState['selectedQueryKey'];
   onSelectQuery: (query: QueryInfo) => void;
 }
 

packages/redux-devtools-rtk-query-monitor/src/index.ts

@@ -0,0 +1,2 @@
+export { default } from './RtkQueryMonitor';
+export { ExternalProps } from './types';

packages/redux-devtools-rtk-query-monitor/src/reducers.ts

@@ -3,14 +3,14 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { RtkQueryInspectorProps } from './RtkQueryInspector';
 import {
   QueryInfo,
-  RtkQueryInspectorMonitorState,
+  RtkQueryMonitorState,
   QueryFormValues,
   QueryPreviewTabs,
 } from './types';
 import { QueryComparators } from './utils/comparators';
 import { QueryFilters } from './utils/filters';
 
-const initialState: RtkQueryInspectorMonitorState = {
+const initialState: RtkQueryMonitorState = {
   queryForm: {
     values: {
       queryComparator: QueryComparators.fulfilledTimeStamp,
@@ -28,7 +28,7 @@ const monitorSlice = createSlice({
    * `@@` prefix is mandatory.
    * @see lifedAction @ `packages/redux-devtools-app/src/actions/index.ts`
    */
-  name: '@@rtk-query-inspector-monitor',
+  name: '@@rtk-query-monitor',
   initialState,
   reducers: {
     changeQueryFormValues(
@@ -54,9 +54,9 @@ const monitorSlice = createSlice({
 
 export function reducer<S, A extends Action<unknown>>(
   props: RtkQueryInspectorProps<S, A>,
-  state: RtkQueryInspectorMonitorState | undefined,
+  state: RtkQueryMonitorState | undefined,
   action: AnyAction
-): RtkQueryInspectorMonitorState {
+): RtkQueryMonitorState {
   return monitorSlice.reducer(state, action);
 }
 

packages/redux-devtools-rtk-query-monitor/src/styles/createStylingFromTheme.ts

@@ -9,7 +9,7 @@ import {
 import rgba from 'hex-rgba';
 import * as reduxThemes from 'redux-devtools-themes';
 import { Action } from 'redux';
-import { RtkQueryInspectorMonitorProps, StyleUtils } from '../types';
+import { RtkQueryMonitorProps, StyleUtils } from '../types';
 import { createContext } from 'react';
 
 jss.setup(preset());
@@ -366,7 +366,7 @@ export const createStylingFromTheme = createStyling(getDefaultThemeStyling, {
 });
 
 export function createThemeState<S, A extends Action<unknown>>(
-  props: RtkQueryInspectorMonitorProps<S, A>
+  props: RtkQueryMonitorProps<S, A>
 ): StyleUtils {
   const base16Theme =
     getBase16Theme(props.theme, { ...reduxThemes }) ?? reduxThemes.nicinabox;

packages/redux-devtools-rtk-query-monitor/src/types.ts

@@ -20,7 +20,7 @@ export interface QueryFormValues {
   searchValue: string;
   queryFilter: QueryFilters;
 }
-export interface RtkQueryInspectorMonitorState {
+export interface RtkQueryMonitorState {
   readonly queryForm: {
     values: QueryFormValues;
   };
@@ -28,11 +28,9 @@ export interface RtkQueryInspectorMonitorState {
   readonly selectedPreviewTab: QueryPreviewTabs;
 }
 
-export interface RtkQueryInspectorMonitorProps<S, A extends Action<unknown>>
+export interface RtkQueryMonitorProps<S, A extends Action<unknown>>
-  extends LiftedState<S, A, RtkQueryInspectorMonitorState> {
+  extends LiftedState<S, A, RtkQueryMonitorState> {
-  dispatch: Dispatch<
+  dispatch: Dispatch<Action | LiftedAction<S, A, RtkQueryMonitorState>>;
-    Action | LiftedAction<S, A, RtkQueryInspectorMonitorState>
-  >;
   theme: keyof typeof themes | Base16Theme;
   invertTheme?: boolean;
 }
@@ -54,16 +52,8 @@ export type RtkQueryApiConfig = RtkQueryApiState['config'];
 export type RtkQueryProvided = RtkQueryApiState['provided'];
 
 export interface ExternalProps<S, A extends Action<unknown>> {
-  dispatch: Dispatch<
+  dispatch: Dispatch<Action | LiftedAction<S, A, RtkQueryMonitorState>>;
-    Action | LiftedAction<S, A, RtkQueryInspectorMonitorState>
-  >;
-
-  preserveScrollTop: boolean;
-  select: (state: S) => unknown;
   theme: keyof typeof themes | Base16Theme;
-  expandActionRoot: boolean;
-  expandStateRoot: boolean;
-  markStateDiff: boolean;
   hideMainButtons?: boolean;
   invertTheme: boolean;
 }
@@ -92,7 +82,7 @@ export interface SelectOption<T = string> {
 
 export interface SelectorsSource<S> {
   userState: S | null;
-  monitorState: RtkQueryInspectorMonitorState;
+  monitorState: RtkQueryMonitorState;
 }
 
 export interface StyleUtils {

packages/redux-devtools-rtk-query-monitor/src/utils/rtk-query.ts

@@ -2,7 +2,7 @@ import { isPlainObject } from '@reduxjs/toolkit';
 import { QueryStatus } from '@reduxjs/toolkit/query';
 import {
   QueryInfo,
-  RtkQueryInspectorMonitorState,
+  RtkQueryMonitorState,
   RtkQueryApiState,
   RTKQuerySubscribers,
   RtkQueryTag,
@@ -206,7 +206,7 @@ export function flipComparator<T>(comparator: Comparator<T>): Comparator<T> {
 }
 
 export function isQuerySelected(
-  selectedQueryKey: RtkQueryInspectorMonitorState['selectedQueryKey'],
+  selectedQueryKey: RtkQueryMonitorState['selectedQueryKey'],
   queryInfo: QueryInfo
 ): boolean {
   return (

yarn.lock

@@ -3377,7 +3377,7 @@ __metadata:
     "@redux-devtools/inspector-monitor-test-tab": ^0.7.2
     "@redux-devtools/inspector-monitor-trace-tab": ^0.2.2
     "@redux-devtools/log-monitor": ^2.3.0
-    "@redux-devtools/rtk-query-inspector-monitor": ^1.0.0
+    "@redux-devtools/rtk-query-monitor": ^1.0.0
     "@redux-devtools/slider-monitor": ^2.0.0-8
     "@reduxjs/toolkit": ^1.6.0
     "@rjsf/core": ^2.5.1
@@ -3680,9 +3680,9 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@redux-devtools/rtk-query-inspector-monitor@^1.0.0, @redux-devtools/rtk-query-inspector-monitor@workspace:packages/redux-devtools-rtk-query-inspector-monitor":
+"@redux-devtools/rtk-query-monitor@^1.0.0, @redux-devtools/rtk-query-monitor@workspace:packages/redux-devtools-rtk-query-monitor":
   version: 0.0.0-use.local
-  resolution: "@redux-devtools/rtk-query-inspector-monitor@workspace:packages/redux-devtools-rtk-query-inspector-monitor"
+  resolution: "@redux-devtools/rtk-query-monitor@workspace:packages/redux-devtools-rtk-query-monitor"
   dependencies:
     "@redux-devtools/core": ^3.9.0
     "@redux-devtools/dock-monitor": ^1.4.0