react-native-inapp-inspector 2.3.18 → 2.3.20

package/src/customHooks/reduxLogger.ts

@@ -1,406 +0,0 @@
-// #8 — Redux inspector module.
-//
-// Two integration paths, both feeding the same timeline/state snapshot:
-//
-//   1. `inspectorReduxMiddleware` (recommended) — a standard Redux middleware.
-//      Because it sits inside the middleware chain it sees EVERY action,
-//      including ones dispatched from thunks, sagas, listeners and RTK Query.
-//
-//   2. `connectReduxStore(store)` — zero-config fallback. It wraps the outer
-//      `store.dispatch` AND diffs state on `store.subscribe`, so even actions
-//      that bypass the wrapped dispatch (thunk/saga internals capture the raw
-//      dispatch reference at store-creation time) still update the state tree
-//      and per-reducer "last action" consistently.
-
-import {ReduxHistoryEntry} from '../types';
-import {parseStackLine} from '../helpers';
-
-export {ReduxHistoryEntry};
-
-let currentReduxState: any = null;
-const listeners = new Set<() => void>();
-let globalReduxAutoRefresh = true;
-let isReduxModuleEnabled = false;
-
-export const setReduxModuleEnabled = (enabled: boolean) => {
-  isReduxModuleEnabled = enabled;
-};
-
-export const getReduxModuleEnabled = () => isReduxModuleEnabled;
-
-let lastActionForReducer: Record<string, any> = {};
-
-let actionHistory: ReduxHistoryEntry[] = [];
-
-let maxReduxHistoryLimit = 50;
-let historyIdSeq = 0;
-
-export const setMaxReduxHistoryLimit = (limit: number): void => {
-  maxReduxHistoryLimit = Math.max(10, limit);
-  if (actionHistory.length > maxReduxHistoryLimit) {
-    actionHistory = actionHistory.slice(0, maxReduxHistoryLimit);
-    notify();
-  }
-};
-
-export const getMaxReduxHistoryLimit = (): number => maxReduxHistoryLimit;
-
-export const pruneReduxHistory = (targetCount?: number): number => {
-  const countToKeep = targetCount !== undefined ? Math.max(0, targetCount) : Math.floor(actionHistory.length / 2);
-  const pruned = actionHistory.length - countToKeep;
-  if (pruned > 0) {
-    actionHistory = actionHistory.slice(0, countToKeep);
-    notify();
-  }
-  return Math.max(0, pruned);
-};
-
-// Guards against double-instrumentation (e.g. connectReduxStore called twice,
-// or middleware + connect used together) which previously produced duplicate
-// timeline entries and inconsistent counts.
-const connectedStores = new WeakSet<object>();
-let middlewareAttached = false;
-
-export const isReduxConnected = () =>
-  middlewareAttached || currentReduxState != null || actionHistory.length > 0;
-
-export const getReduxState = () => currentReduxState;
-
-export const setReduxAutoRefresh = (val: boolean) => {
-  globalReduxAutoRefresh = val;
-};
-
-export const getReduxAutoRefresh = () => globalReduxAutoRefresh;
-
-export const getLastActionForReducer = () => lastActionForReducer;
-
-export const clearLastActionForReducer = () => {
-  lastActionForReducer = {};
-  notify();
-};
-
-export const getActionHistory = () => actionHistory;
-
-export const clearActionHistory = () => {
-  actionHistory = [];
-  notify();
-};
-
-export const setReduxState = (state: any) => {
-  currentReduxState = state;
-  notify();
-};
-
-export const subscribeReduxState = (cb: () => void) => {
-  listeners.add(cb);
-  return () => {
-    listeners.delete(cb);
-  };
-};
-
-function notify() {
-  listeners.forEach(cb => cb());
-}
-
-function actionTypeOf(action: any): string {
-  if (typeof action === 'string') return action;
-  if (action && typeof action === 'object' && action.type != null) {
-    return String(action.type);
-  }
-  if (typeof action === 'function') {
-    return action.name ? `thunk: ${action.name}` : 'thunk';
-  }
-  return 'UNKNOWN_ACTION';
-}
-
-function detectActionOrigin(stack: string, actionType: string, actionObj?: any): {
-  originType: 'saga' | 'thunk' | 'ui' | 'direct' | 'listener';
-  caller?: string;
-  callerFile?: string;
-  callerLine?: number;
-  callerCol?: number;
-} {
-  const stackLower = (stack || '').toLowerCase();
-  const typeLower = (actionType || '').toLowerCase();
-
-  // Explicit hint on action if developer tagged it
-  if (actionObj && actionObj.__origin) {
-    const raw = String(actionObj.__origin).toLowerCase();
-    if (raw.includes('saga')) return {originType: 'saga'};
-    if (raw.includes('thunk')) return {originType: 'thunk'};
-    if (raw.includes('ui')) return {originType: 'ui'};
-  }
-
-  // 1. Saga Detection (Stack + Action naming conventions)
-  const isSaga =
-    stackLower.includes('redux-saga') ||
-    stackLower.includes('runputeffect') ||
-    stackLower.includes('proc.js') ||
-    stackLower.includes('effects.js') ||
-    stackLower.includes('sagamiddleware') ||
-    stackLower.includes('saga.ts') ||
-    stackLower.includes('saga.js') ||
-    stackLower.includes('sagas') ||
-    typeLower.includes('saga') ||
-    typeLower.startsWith('saga/') ||
-    typeLower.startsWith('@saga/');
-
-  // 2. Thunk / RTK Query Detection
-  const isThunk =
-    stackLower.includes('createasyncthunk') ||
-    stackLower.includes('redux-thunk') ||
-    stackLower.includes('rtk-query') ||
-    stackLower.includes('thunkmiddleware') ||
-    stackLower.includes('actioncreator') ||
-    typeLower.includes('thunk') ||
-    typeLower.endsWith('/pending') ||
-    typeLower.endsWith('/fulfilled') ||
-    typeLower.endsWith('/rejected');
-
-  // 3. Parse Stack Frames to find best application caller
-  const lines = (stack || '').split('\n').map(l => l.trim()).filter(Boolean);
-  let bestFrame: any = null;
-
-  for (let i = 0; i < lines.length; i++) {
-    const line = lines[i];
-    // Ignore logger / middleware lines inside inspector
-    if (
-      line.includes('reduxLogger') ||
-      line.includes('inspectorReduxMiddleware') ||
-      line.includes('recordAction') ||
-      line.includes('redux.js') ||
-      line.includes('redux.cjs')
-    ) {
-      continue;
-    }
-    const parsed = parseStackLine(line, false);
-    if (parsed.frameType === 'app' || (!parsed.isRuntimeNoise && parsed.fileName !== 'Unknown')) {
-      bestFrame = parsed;
-      break;
-    }
-  }
-
-  if (!bestFrame && lines.length > 0) {
-    for (let i = 0; i < lines.length; i++) {
-      if (!lines[i].includes('reduxLogger') && !lines[i].includes('inspectorReduxMiddleware')) {
-        bestFrame = parseStackLine(lines[i], false);
-        break;
-      }
-    }
-  }
-
-  let originType: 'saga' | 'thunk' | 'ui' | 'direct' | 'listener' = 'direct';
-  if (isSaga || (bestFrame && bestFrame.fileName?.toLowerCase().includes('saga'))) {
-    originType = 'saga';
-  } else if (isThunk || (bestFrame && bestFrame.fileName?.toLowerCase().includes('thunk'))) {
-    originType = 'thunk';
-  } else if (
-    bestFrame &&
-    (bestFrame.fileName?.endsWith('.tsx') ||
-      bestFrame.functionName?.includes('onPress') ||
-      bestFrame.functionName?.includes('touchable') ||
-      bestFrame.functionName?.includes('Effect'))
-  ) {
-    originType = 'ui';
-  } else if (stackLower.includes('listener') || stackLower.includes('subscribe')) {
-    originType = 'listener';
-  }
-
-  return {
-    originType,
-    caller: bestFrame?.copyableLocation || bestFrame?.raw || undefined,
-    callerFile: bestFrame?.fullPath || bestFrame?.fileName || undefined,
-    callerLine: bestFrame?.lineNumber ? Number(bestFrame.lineNumber) : undefined,
-    callerCol: bestFrame?.columnNumber ? Number(bestFrame.columnNumber) : undefined,
-  };
-}
-
-function extractSliceName(actionType: string, affectedSlices: string[]): string | undefined {
-  if (affectedSlices && affectedSlices.length > 0) {
-    return affectedSlices[0];
-  }
-  // If Redux Toolkit action format: e.g. "users/fetchById" -> "users"
-  const match = actionType.match(/^([a-zA-Z0-9_\-]+)\//);
-  if (match && match[1] && !match[1].startsWith('@@')) {
-    return match[1];
-  }
-  return undefined;
-}
-
-function recordAction(action: any, prevState: any, nextState: any, rawStack?: string) {
-  if (!isReduxModuleEnabled) return;
-  const stack = rawStack || new Error().stack || '';
-  const type = actionTypeOf(action);
-  const payload =
-    action && typeof action === 'object' && action.payload !== undefined
-      ? action.payload
-      : null;
-  const now = Date.now();
-  const timestamp = new Date(now).toLocaleTimeString();
-
-  const affectedSlices: string[] = [];
-  const origin = detectActionOrigin(stack, type, action);
-  const sliceName = extractSliceName(type, affectedSlices);
-
-  if (
-    prevState &&
-    nextState &&
-    typeof prevState === 'object' &&
-    typeof nextState === 'object'
-  ) {
-    Object.keys(nextState).forEach(key => {
-      if (prevState[key] !== nextState[key]) {
-        lastActionForReducer[key] = {
-          type,
-          payload,
-          timestamp,
-          updatedAt: now,
-          originType: origin.originType,
-          callerFile: origin.callerFile,
-          callerLine: origin.callerLine,
-          callerCol: origin.callerCol,
-          caller: origin.caller,
-          stack,
-        };
-        affectedSlices.push(key);
-      }
-    });
-  }
-
-  actionHistory.unshift({
-    id: ++historyIdSeq,
-    type,
-    payload,
-    timestamp,
-    updatedAt: now,
-    affectedSlices,
-    prevState,
-    nextState,
-    stack,
-    caller: origin.caller,
-    callerFile: origin.callerFile,
-    callerLine: origin.callerLine,
-    callerCol: origin.callerCol,
-    originType: origin.originType,
-    sliceName,
-  });
-  if (actionHistory.length > maxReduxHistoryLimit) {
-    actionHistory.length = maxReduxHistoryLimit;
-  }
-
-  if (globalReduxAutoRefresh) {
-    currentReduxState = nextState;
-  }
-  // Timeline / last-action map always changed — notify even when the state
-  // tree snapshot is paused so those panels stay live.
-  notify();
-}
-
-/**
- * Standard Redux middleware — add it to your store to capture every action,
- * including those dispatched from thunks, sagas and RTK Query:
- *
- *   const store = configureStore({
- *     reducer,
- *     middleware: gDM => gDM().concat(inspectorReduxMiddleware),
- *   });
- *
- * Pair with `connectReduxStore(store)` (safe — they de-duplicate) or rely on
- * the middleware alone; the initial snapshot is taken on the first action.
- */
-export const inspectorReduxMiddleware =
-  (storeApi: any) => (next: (action: any) => any) => (action: any) => {
-    middlewareAttached = true;
-    const capturedStack = new Error().stack || '';
-    // Thunks are functions — let them run; their inner plain-action dispatches
-    // pass back through this same middleware, so nothing is lost.
-    if (typeof action === 'function') {
-      return next(action);
-    }
-    const prevState = storeApi.getState();
-    const result = next(action);
-    const nextState = storeApi.getState();
-    if (currentReduxState == null) currentReduxState = nextState;
-    recordAction(action, prevState, nextState, capturedStack);
-    return result;
-  };
-
-export const connectReduxStore = (store: any) => {
-  if (
-    !store ||
-    typeof store.getState !== 'function' ||
-    typeof store.subscribe !== 'function'
-  ) {
-    console.warn(
-      '[NetworkInspector] Invalid Redux store passed to connectReduxStore.',
-    );
-    return;
-  }
-
-  // Idempotent — connecting the same store twice must not double-wrap
-  // dispatch or double-record the timeline.
-  if (connectedStores.has(store)) {
-    return;
-  }
-  connectedStores.add(store);
-
-  // Wrap the outer dispatch so directly dispatched actions get full
-  // type/payload attribution. Skipped when the middleware is already
-  // attached, otherwise every direct dispatch would be recorded twice.
-  const originalDispatch = store.dispatch.bind(store);
-  let inWrappedDispatch = false;
-  store.dispatch = (action: any) => {
-    const capturedStack = new Error().stack || '';
-    if (middlewareAttached || typeof action === 'function') {
-      // Middleware handles recording, or it's a thunk whose inner dispatches
-      // will be picked up individually.
-      inWrappedDispatch = true;
-      try {
-        return originalDispatch(action);
-      } finally {
-        inWrappedDispatch = false;
-      }
-    }
-    const prevState = store.getState();
-    inWrappedDispatch = true;
-    let result;
-    try {
-      result = originalDispatch(action);
-    } finally {
-      inWrappedDispatch = false;
-    }
-    recordAction(action, prevState, store.getState(), capturedStack);
-    return result;
-  };
-
-  setReduxState(store.getState());
-
-  // Subscribe-diff fallback: catches state changes whose dispatch bypassed
-  // the wrapper above (thunk/saga internals hold the raw dispatch reference).
-  // Without this, the tree and per-reducer last-action drifted out of sync.
-  let lastSeenState = store.getState();
-  store.subscribe(() => {
-    const nextState = store.getState();
-    if (nextState === lastSeenState) return;
-    const prevState = lastSeenState;
-    lastSeenState = nextState;
-
-    if (inWrappedDispatch || middlewareAttached) {
-      // Already recorded with proper attribution; just refresh the snapshot.
-      if (globalReduxAutoRefresh) {
-        currentReduxState = nextState;
-        notify();
-      }
-      return;
-    }
-    // Change arrived outside the wrapped dispatch — record it so the
-    // timeline stays consistent, even without the original action type.
-    const subStack = new Error().stack || '';
-    recordAction(
-      {type: '@@inspector/EXTERNAL_STATE_CHANGE'},
-      prevState,
-      nextState,
-      subStack,
-    );
-  });
-};