react-native-inapp-inspector 1.1.34 → 1.1.35

package/dist/esm/i18n/locales/en.json

@@ -39,12 +39,35 @@
         "redux": "Redux"
     },
     "settings": {
-        "mainTitle": "Settings",
+        "mainTitle": "Settings & Modules",
+        "mainSubtitle": "Manage modules and preferences",
         "requiredBadge": "REQUIRED",
         "defaultBadge": "DEFAULT",
         "notConnectedBadge": "NOT CONNECTED",
         "notDetectedBadge": "NOT DETECTED",
         "readOnlyBadge": "READ ONLY",
+        "coreBadge": "CORE",
+        "activeBadge": "ACTIVE",
+        "dormantBadge": "DORMANT",
+        "protectedBadge": "PROTECTED",
+        "modulesAndTools": "Modules & Tools",
+        "uiPreferences": "UI Preferences",
+        "zeroOverheadTitle": "Zero Background Overhead",
+        "zeroOverheadDesc": "Check the modules you wish to activate. Disabled modules consume 0% CPU & memory until saved.",
+        "unsavedPending": "● Unsaved selections pending",
+        "allSynchronized": "All modules synchronized",
+        "modulesActive": "{{active}} of {{total}} Modules Active",
+        "saveChanges": "Save Changes",
+        "settingsSaved": "Settings Saved",
+        "settingsSavedDesc": "Active module configurations have been successfully updated.",
+        "configure": "Configure",
+        "appearanceTheme": "APPEARANCE & THEME",
+        "windowLayout": "WINDOW & LAYOUT",
+        "startupDefault": "STARTUP & DEFAULT SCREEN",
+        "logFiltersDeduplication": "LOG FILTERS & DEDUPLICATION",
+        "resetSettings": "Reset All Settings",
+        "resetSettingsDesc": "Wipe customized preferences back to default",
+        "reset": "Reset",
         "reduxNotConnectedTip": "Redux store is not connected. Call connectReduxStore(store) or use inspectorReduxMiddleware to enable.",
         "analyticsNotConnectedTip": "Analytics is not initialized. Call setupAnalyticsLogger(analytics()) to enable.",
         "tabVisibility": "Tab Visibility",
@@ -55,7 +78,7 @@
             "title": "APIs Settings",
             "total": "Total: {{count}}",
             "maxRequestLogs": "Max Request Logs",
-            "maxRequestLogsDescription": "How many network requests to keep in memory",
+            "maxRequestLogsDescription": "Buffer size of network requests preserved in memory",
             "clearNetworkLogs": "Clear Network Logs",
             "clearNetworkLogsDescription": "{{count}} requests stored",
             "networkLogsCleared": "Network logs cleared.",
@@ -69,56 +92,91 @@
             "title": "Logs Settings",
             "total": "Total: {{count}}",
             "maxConsoleLogs": "Max Console Logs",
-            "maxConsoleLogsDescription": "How many console logs to keep in memory",
-            "logLevels": "Log Levels",
-            "logLevelsDescription": "Which console levels to capture",
-            "showInfo": "Show info logs",
-            "showWarn": "Show warn logs",
-            "showError": "Show error logs",
+            "maxConsoleLogsDescription": "How many console messages to retain",
+            "logLevels": "Log Severities",
+            "logLevelsDescription": "Select which severities to capture in Logs",
+            "showInfo": "Show Info logs",
+            "showInfoDesc": "Informational logs & debug prints",
+            "showWarn": "Show Warning logs",
+            "showWarnDesc": "Warning notices & deprecations",
+            "showError": "Show Error logs",
+            "showErrorDesc": "Runtime errors & exceptions",
             "clearConsoleLogs": "Clear Console Logs",
             "clearConsoleLogsDescription": "{{count}} logs stored",
             "consoleLogsCleared": "Console logs cleared."
         },
         "analytics": {
             "title": "Analytics Settings",
-            "total": "Total: {{count}}",
-            "maxAnalyticsEvents": "Max Analytics Events",
-            "maxAnalyticsEventsDescription": "How many analytics events to keep in memory",
-            "clearAnalyticsEvents": "Clear Analytics Events",
-            "clearAnalyticsEventsDescription": "{{count}} events stored",
+            "total": "Events: {{count}}",
+            "maxAnalyticsEvents": "Events Captured",
+            "maxAnalyticsEventsDescription": "{{count}} analytics events stored in buffer",
+            "clearAnalyticsEvents": "Clear Analytics History",
+            "clearAnalyticsEventsDescription": "Wipe all captured telemetry events",
             "analyticsEventsCleared": "Analytics events cleared."
         },
         "redux": {
             "title": "Redux Settings",
             "reducers": "Reducers: {{count}}",
             "autoRefresh": "Auto-refresh Store",
-            "autoRefreshDescription": "Automatically capture Redux store state updates",
+            "autoRefreshDescription": "Capture Redux store state tree on every dispatch",
             "defaultJsonExpandDepth": "Default JSON Expand Depth",
             "defaultJsonExpandDepthDescription": "Initial depth of Redux state tree to auto-expand",
             "clearReduxState": "Clear Redux State",
-            "clearReduxStateDescription": "Reset state snapshot in inspector",
-            "clearReduxStateEmpty": "No store snapshot stored",
+            "clearReduxStateDescription": "Reset current state snapshot in inspector",
+            "clearReduxStateEmpty": "No store snapshot recorded",
             "reduxStateCleared": "Redux state snapshot cleared.",
             "clearReduxTimeline": "Clear Redux Timeline",
             "clearReduxTimelineDescription": "Remove all captured action history",
             "reduxTimelineCleared": "Redux action history cleared."
         },
+        "bundle": {
+            "title": "Bundle Settings",
+            "sourceBundler": "Metro Source Bundler",
+            "sourceBundlerDesc": "Parses live module trees and calculates binary size breakdowns",
+            "clearCache": "Clear Bundle Cache",
+            "clearCacheDesc": "Force re-fetching and parsing of JS bundle",
+            "cacheCleared": "Bundle analysis cache cleared."
+        },
+        "performance": {
+            "title": "Performance Settings",
+            "frameMeasurement": "Live Frame Measurement",
+            "frameMeasurementDesc": "Samples UI/JS frame rates & detects wasteful re-renders",
+            "clearEvents": "Clear Performance Events",
+            "clearEventsDesc": "Reset recorded jank and FPS drops history",
+            "eventsCleared": "Performance events cleared."
+        },
+        "crash": {
+            "title": "Crash Settings",
+            "maxCrashLogs": "Max Crash Logs",
+            "maxCrashLogsDesc": "How many crash records to preserve in history",
+            "globalGuard": "Global Crash Guard",
+            "globalGuardDesc": "Intercepts native, JS, and render errors directly",
+            "clearHistory": "Clear Crash History",
+            "clearHistoryDesc": "{{count}} crash logs stored",
+            "historyCleared": "Crash logs cleared."
+        },
         "general": {
-            "darkMode": "Dark Mode",
-            "darkModeDescription": "Switch the inspector to a dark color scheme",
-            "modalHeight": "Modal Height",
-            "modalHeightDescription": "Height of the inspector overlay",
-            "modalAnimation": "Modal Animation",
-            "modalAnimationDescription": "Animation used when opening the inspector",
+            "darkMode": "Dark Mode Theme",
+            "darkModeDescription": "Toggle sleek dark aesthetic or light contrast",
+            "modalHeight": "Inspector Window Height",
+            "modalHeightDescription": "Modal screen coverage percentage",
+            "modalAnimation": "Transition Animation",
+            "modalAnimationDescription": "Entrance and dismissal presentation style",
             "duplicateLogs": "Show Duplicate Logs",
-            "duplicateLogsDescription": "Group consecutive identical console logs",
+            "duplicateLogsDescription": "Off: Identical repeated entries collapse into ×N badges",
+            "defaultOpeningTab": "Default Opening Tab",
+            "defaultOpeningTabDesc": "Initial tab active when launcher button is tapped",
+            "activeConsoleLogLevels": "Active Console Log Levels",
+            "activeConsoleLogLevelsDesc": "Select which severities to capture in Logs",
             "resetToDefaults": "Reset to Defaults",
             "resetToDefaultsDescription": "Restore all inspector settings",
             "resetConfirmationTitle": "Settings Reset",
             "resetConfirmationMessage": "All settings have been reset to default values.",
             "storageStatus": "Persistent Storage",
-            "storageStatusEnabled": "Settings persist across app restarts",
-            "storageStatusDisabled": "Using in-memory storage (Android)"
+            "storageStatusEnabled": "Settings Storage: Persistent ({{type}})",
+            "storageStatusEnabledDesc": "Your preferences and module visibility persist across app reboots.",
+            "storageStatusDisabled": "Settings Storage: In-Memory (Temporary)",
+            "storageStatusDisabledDesc": "Preferences reset on app kill. Pass custom storage to <NetworkInspector storage={...} /> to persist on Android."
         }
     },
     "network": {
@@ -178,10 +236,20 @@
         "noMatchingHeaders": "No matching headers",
         "diffHidden": "{ Diff hidden }",
         "noDiff": "No differences from previous API.",
+        "healthTitle": "Network Health & Telemetry",
+        "successRate": "Success Rate",
+        "avgLatency": "Avg Latency",
+        "p95Latency": "P95 Latency",
+        "bandwidth": "Bandwidth",
+        "fastest": "Fastest",
+        "slowest": "Slowest",
+        "timingWaterfall": "Timing Waterfall & Latency",
+        "throughput": "Throughput",
+        "performanceTier": "Performance Tier",
         "perf": {
-            "fast": "Fast",
-            "moderate": "Moderate",
-            "slow": "Slow"
+            "fast": "Fast (< 200ms)",
+            "moderate": "Moderate (200-800ms)",
+            "slow": "Slow (> 800ms)"
         },
         "jsonViewer": {
             "pretty": "Pretty",

package/dist/esm/index.js

@@ -12,14 +12,16 @@ import { formatDisplayUrl, getNavigationInfo, deduplicateLogs, getDomainColor, g
 // #5 — settings persistence
 import { loadSettings, saveSettings, setCustomStorage, clearPersistedSettings, } from './helpers/settingsStore';
 // Network
-import { setupNetworkLogger, clearNetworkLogs, subscribeNetworkLogs, } from './customHooks/networkLogger';
+import { setupNetworkLogger, clearNetworkLogs, subscribeNetworkLogs, setNetworkModuleEnabled, } from './customHooks/networkLogger';
 // Console
-import { setupConsoleLogger, clearConsoleLogs, subscribeConsoleLogs, } from './customHooks/consoleLogger';
+import { setupConsoleLogger, clearConsoleLogs, subscribeConsoleLogs, setConsoleModuleEnabled, } from './customHooks/consoleLogger';
 import { IGNORED_LOG_PREFIXES } from './customHooks/logFilters';
 // Crash Protection
-import { setupGlobalCrashHandler, subscribeCrashEvents, getCrashRecords, clearCrashRecords, setMaxCrashLogsLimit, } from './customHooks/crashHandler';
-import { subscribeAnalyticsEvents, clearAnalyticsEvents, autoSetupAnalyticsLogger, isAnalyticsConnected, } from './customHooks/analyticsLogger';
-import { getReduxState, subscribeReduxState, setReduxAutoRefresh, getLastActionForReducer, clearActionHistory, isReduxConnected, } from './customHooks/reduxLogger';
+import { setupGlobalCrashHandler, subscribeCrashEvents, getCrashRecords, clearCrashRecords, setMaxCrashLogsLimit, setCrashModuleEnabled, } from './customHooks/crashHandler';
+import { subscribeAnalyticsEvents, clearAnalyticsEvents, autoSetupAnalyticsLogger, isAnalyticsConnected, setAnalyticsModuleEnabled, } from './customHooks/analyticsLogger';
+import { getReduxState, subscribeReduxState, setReduxAutoRefresh, getLastActionForReducer, clearActionHistory, isReduxConnected, setReduxModuleEnabled, } from './customHooks/reduxLogger';
+import { setPerformanceModuleEnabled } from './customHooks/performanceTracker';
+import { setBundleModuleEnabled } from './customHooks/bundleAnalyzer';
 import { LIB_VERSION } from './constants';
 // Stylesheet
 import { toggleGlobalTheme } from './styles';
@@ -165,11 +167,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
     const [tabVisibility, setTabVisibility] = useState({
         apis: true,
         logs: true,
-        analytics: true,
+        analytics: false,
         redux: false,
         bundle: false,
         performance: false,
-        crash: true,
+        crash: false,
     });
     const [maxNetworkLogs, setMaxNetworkLogs] = useState(100);
     const [reduxAutoRefresh, setReduxAutoRefreshState] = useState(true);
@@ -177,6 +179,16 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
     // #6 — tab the inspector opens on. Shown with a DEFAULT badge in Settings.
     const [defaultTab, setDefaultTab] = useState('apis');
     const [showDuplicateLogs, setShowDuplicateLogs] = useState(false);
+    // Synchronize runtime background listeners with active settings
+    useEffect(() => {
+        setNetworkModuleEnabled(!!tabVisibility.apis);
+        setConsoleModuleEnabled(!!tabVisibility.logs);
+        setAnalyticsModuleEnabled(!!tabVisibility.analytics);
+        setReduxModuleEnabled(!!tabVisibility.redux);
+        setPerformanceModuleEnabled(!!tabVisibility.performance);
+        setCrashModuleEnabled(!!tabVisibility.crash);
+        setBundleModuleEnabled(!!tabVisibility.bundle);
+    }, [tabVisibility]);
     const resetToDefaults = async () => {
         await clearPersistedSettings();
         setIsDark(false);
@@ -186,11 +198,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
         setTabVisibility({
             apis: true,
             logs: true,
-            analytics: true,
+            analytics: false,
             redux: false,
             bundle: false,
             performance: false,
-            crash: true,
+            crash: false,
         });
         setDefaultTab('apis');
         setMaxCrashLogs(100);
@@ -226,9 +238,6 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                     ...prev,
                     ...saved.tabVisibility,
                     apis: true, // APIs is always required
-                    crash: saved.tabVisibility.crash !== undefined
-                        ? saved.tabVisibility.crash
-                        : true,
                 }));
             if (saved.defaultTab)
                 setDefaultTab(saved.defaultTab);
@@ -250,11 +259,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                     ...{
                         apis: true,
                         logs: true,
-                        analytics: true,
+                        analytics: false,
                         redux: false,
                         bundle: false,
                         performance: false,
-                        crash: true,
+                        crash: false,
                     },
                     ...(saved.tabVisibility || {}),
                     apis: true,
@@ -619,13 +628,37 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
         loop.start();
         return () => loop.stop();
     }, [unreadPulseAnim]);
-    // #6 — every time the inspector is opened, land on the chosen default tab.
+    const isVisibleRefObj = useRef(visible);
+    // #6 — every time the inspector is opened, land on chosen default tab & sync latest logs
     useEffect(() => {
+        isVisibleRefObj.current = visible;
         if (visible) {
             const target = defaultTab === 'apis' || tabVisibility?.[defaultTab]
                 ? defaultTab
                 : 'apis';
             setActiveTab(target);
+            // Instant synchronization of data collected while modal was closed
+            if (latestNetworkLogsRef.current.length > 0) {
+                const deduped = deduplicateLogs(latestNetworkLogsRef.current);
+                const incoming = new Set(deduped.map(l => l.id));
+                prevLogIdsRef.current = incoming;
+                setLogs(deduped);
+            }
+            if (latestConsoleLogsRef.current.length > 0) {
+                setConsoleLogs(latestConsoleLogsRef.current);
+            }
+            if (latestAnalyticsEventsRef.current.length > 0) {
+                setAnalyticsEvents(latestAnalyticsEventsRef.current);
+            }
+            const freshState = getReduxState();
+            if (freshState) {
+                setReduxState(typeof freshState === 'object' ? { ...freshState } : freshState);
+                setReduxLastActionMap({ ...getLastActionForReducer() });
+            }
+            const freshCrashes = getCrashRecords();
+            if (freshCrashes.length > 0) {
+                setCrashRecords(freshCrashes);
+            }
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [visible]);
@@ -653,6 +686,7 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
         setupConsoleLogger();
         autoSetupAnalyticsLogger();
         setupGlobalCrashHandler();
+        const isVisibleRef = isVisibleRefObj;
         const unsubscribeCrash = subscribeCrashEvents(crashInfo => {
             if (crashInfo.message === '__CLEARED__') {
                 setCrashRecords([]);
@@ -660,7 +694,9 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                 return;
             }
             const updated = getCrashRecords();
-            setCrashRecords(updated);
+            if (isVisibleRef.current) {
+                setCrashRecords(updated);
+            }
         });
         // Sync crashes recorded before this subscription ran (e.g. a render crash
         // during the very first commit, which fires before effects are mounted).
@@ -674,6 +710,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             latestNetworkLogsRef.current = raw;
             if (isNetworkPausedRef.current)
                 return;
+            if (!isVisibleRef.current)
+                return; // ZERO-RENDER INACTIVE MODE
             clearTimeout(timeoutId);
             const updateNetworkState = () => {
                 const deduped = deduplicateLogs(raw);
@@ -713,6 +751,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             latestAnalyticsEventsRef.current = raw;
             if (isAnalyticsPausedRef.current)
                 return;
+            if (!isVisibleRef.current)
+                return; // ZERO-RENDER INACTIVE MODE
             clearTimeout(analyticsTimeoutId);
             const updateAnalyticsState = () => {
                 const incoming = new Set(raw.map(e => e.id));
@@ -750,6 +790,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             latestConsoleLogsRef.current = raw;
             if (isConsolePausedRef.current)
                 return;
+            if (!isVisibleRef.current)
+                return; // ZERO-RENDER INACTIVE MODE
             clearTimeout(consoleTimeoutId);
             if (isFirstConsoleCall) {
                 isFirstConsoleCall = false;
@@ -762,11 +804,13 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             }
         });
         const initialReduxState = getReduxState();
-        setReduxState(initialReduxState && typeof initialReduxState === 'object' ? { ...initialReduxState } : initialReduxState);
-        setReduxLastActionMap({ ...getLastActionForReducer() });
+        if (initialReduxState) {
+            setReduxState(typeof initialReduxState === 'object' ? { ...initialReduxState } : initialReduxState);
+            setReduxLastActionMap({ ...getLastActionForReducer() });
+        }
         const unsubscribeRedux = subscribeReduxState(() => {
-            // New references each time guarantee the Redux tab updates live, even when
-            // the root state object reference is unchanged or auto-refresh is paused.
+            if (!isVisibleRef.current)
+                return; // ZERO-RENDER INACTIVE MODE
             const freshState = getReduxState();
             setReduxState(freshState && typeof freshState === 'object' ? { ...freshState } : freshState);
             setReduxLastActionMap({ ...getLastActionForReducer() });

package/dist/esm/styles/AppColors.d.ts

@@ -154,6 +154,20 @@ declare const LightColors: {
     greyBorder: string;
     paperBg: string;
     contentBg: string;
+    toastBg: string;
+    toastBorder: string;
+    mintGreenBg: string;
+    mintGreenBorder: string;
+    mintGreenText: string;
+    amberWarmBg: string;
+    amberWarmBorder: string;
+    amberWarmText: string;
+    violetSoftBg: string;
+    violetSoftBorder: string;
+    violetSoftText: string;
+    skySoftBg: string;
+    skySoftBorder: string;
+    skySoftText: string;
     domainColors: string[];
 };
 export declare const getThemeColors: (isDark: boolean) => {
@@ -312,6 +326,20 @@ export declare const getThemeColors: (isDark: boolean) => {
     greyBorder: string;
     paperBg: string;
     contentBg: string;
+    toastBg: string;
+    toastBorder: string;
+    mintGreenBg: string;
+    mintGreenBorder: string;
+    mintGreenText: string;
+    amberWarmBg: string;
+    amberWarmBorder: string;
+    amberWarmText: string;
+    violetSoftBg: string;
+    violetSoftBorder: string;
+    violetSoftText: string;
+    skySoftBg: string;
+    skySoftBorder: string;
+    skySoftText: string;
     domainColors: string[];
 };
 export declare const AppColors: typeof LightColors;

package/dist/esm/styles/AppColors.js

@@ -161,6 +161,21 @@ const LightColors = {
     greyBorder: '#E3DFEC',
     paperBg: '#FBF9FC',
     contentBg: '#F8F7FB',
+    // ─── Toast / Glass / Chip Tokens ───
+    toastBg: '#0F172AEE',
+    toastBorder: '#33415588',
+    mintGreenBg: '#ECFDF5',
+    mintGreenBorder: '#A7F3D0',
+    mintGreenText: '#059669',
+    amberWarmBg: '#FFFBEB',
+    amberWarmBorder: '#FDE68A',
+    amberWarmText: '#92400E',
+    violetSoftBg: '#EDE9FE',
+    violetSoftBorder: '#DDD6FE',
+    violetSoftText: '#7C3AED',
+    skySoftBg: '#E0F2FE',
+    skySoftBorder: '#BAE6FD',
+    skySoftText: '#0284C7',
     // ─── Domain Colors (Thai Airways Themed) ───
     domainColors: [
         '#5C2D91',
@@ -237,6 +252,21 @@ const DarkColors = {
     amber700: '#C5A059',
     amber800: '#B89758',
     green500: '#22C55E',
+    // ─── Toast / Glass / Chip Tokens (Dark) ───
+    toastBg: '#1E293BEE',
+    toastBorder: '#47556988',
+    mintGreenBg: '#064E3B66',
+    mintGreenBorder: '#05966988',
+    mintGreenText: '#34D399',
+    amberWarmBg: '#451A0366',
+    amberWarmBorder: '#D9770688',
+    amberWarmText: '#FCD34D',
+    violetSoftBg: '#3B076466',
+    violetSoftBorder: '#7C3AED88',
+    violetSoftText: '#C084FC',
+    skySoftBg: '#082F4966',
+    skySoftBorder: '#0284C788',
+    skySoftText: '#38BDF8',
     green600: '#16A34A',
     green700: '#15803D',
     green800: '#166534',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-inapp-inspector",
-  "version": "1.1.34",
+  "version": "1.1.35",
   "description": "The zero-config, all-in-one in-app debugger for React Native & Expo. Inspect Network (fetch/axios), Console logs, Stack Traces, Redux State, Firebase Analytics, and JS Bundle size directly on device.",
   "repository": {
     "type": "git",
@@ -30,8 +30,9 @@
     "react-native-inapp-inspector.podspec"
   ],
   "scripts": {
+    "clean": "rm -rf dist",
     "prebuild": "node scripts/gen-version.js",
-    "build": "tsc && tsc -p tsconfig.esm.json",
+    "build": "npm run clean && tsc && tsc -p tsconfig.esm.json",
     "watch": "tsc -w",
     "prepack": "npm run build",
     "publish": "node release.cjs",