react-native-inapp-inspector 1.1.33 → 1.1.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/commonjs/components/ConsoleLogCard.js +57 -56
- package/dist/commonjs/components/CopyButton.js +7 -1
- package/dist/commonjs/components/Inspector/BundleTab.js +268 -27
- package/dist/commonjs/components/Inspector/CrashDetail.js +16 -12
- package/dist/commonjs/components/Inspector/InspectorHeader.js +16 -16
- package/dist/commonjs/components/Inspector/MainScreen.js +6 -2
- package/dist/commonjs/components/Inspector/NetworkTab.js +97 -1
- package/dist/commonjs/components/Inspector/ReduxDetail.js +24 -19
- package/dist/commonjs/components/Inspector/ReduxTab.js +12 -8
- package/dist/commonjs/components/Inspector/SettingsPanel.js +1243 -673
- package/dist/commonjs/components/LogCard.js +27 -9
- package/dist/commonjs/components/MetaAccordion.js +42 -0
- package/dist/commonjs/components/NetworkIcons.d.ts +9 -0
- package/dist/commonjs/components/NetworkIcons.js +48 -1
- package/dist/commonjs/components/Toast.js +3 -3
- package/dist/commonjs/components/TouchableScale.d.ts +4 -2
- package/dist/commonjs/components/TouchableScale.js +4 -4
- package/dist/commonjs/constants/version.d.ts +1 -1
- package/dist/commonjs/constants/version.js +1 -1
- package/dist/commonjs/customHooks/analyticsLogger.d.ts +2 -0
- package/dist/commonjs/customHooks/analyticsLogger.js +10 -1
- package/dist/commonjs/customHooks/bundleAnalyzer.d.ts +2 -0
- package/dist/commonjs/customHooks/bundleAnalyzer.js +80 -33
- package/dist/commonjs/customHooks/consoleLogger.d.ts +2 -0
- package/dist/commonjs/customHooks/consoleLogger.js +10 -1
- package/dist/commonjs/customHooks/crashHandler.d.ts +2 -0
- package/dist/commonjs/customHooks/crashHandler.js +10 -1
- package/dist/commonjs/customHooks/networkLogger.d.ts +2 -0
- package/dist/commonjs/customHooks/networkLogger.js +12 -1
- package/dist/commonjs/customHooks/performanceTracker.d.ts +3 -1
- package/dist/commonjs/customHooks/performanceTracker.js +18 -4
- package/dist/commonjs/customHooks/reduxLogger.d.ts +2 -0
- package/dist/commonjs/customHooks/reduxLogger.js +10 -1
- package/dist/commonjs/i18n/locales/en.json +96 -28
- package/dist/commonjs/index.js +78 -34
- package/dist/commonjs/styles/AppColors.d.ts +28 -0
- package/dist/commonjs/styles/AppColors.js +30 -0
- package/dist/esm/components/ConsoleLogCard.js +58 -57
- package/dist/esm/components/CopyButton.js +7 -1
- package/dist/esm/components/Inspector/BundleTab.js +268 -27
- package/dist/esm/components/Inspector/CrashDetail.js +16 -12
- package/dist/esm/components/Inspector/InspectorHeader.js +16 -16
- package/dist/esm/components/Inspector/MainScreen.js +6 -2
- package/dist/esm/components/Inspector/NetworkTab.js +99 -3
- package/dist/esm/components/Inspector/ReduxDetail.js +24 -19
- package/dist/esm/components/Inspector/ReduxTab.js +12 -8
- package/dist/esm/components/Inspector/SettingsPanel.js +1246 -676
- package/dist/esm/components/LogCard.js +27 -9
- package/dist/esm/components/MetaAccordion.js +42 -0
- package/dist/esm/components/NetworkIcons.d.ts +9 -0
- package/dist/esm/components/NetworkIcons.js +38 -0
- package/dist/esm/components/Toast.js +3 -3
- package/dist/esm/components/TouchableScale.d.ts +4 -2
- package/dist/esm/components/TouchableScale.js +4 -4
- package/dist/esm/constants/version.d.ts +1 -1
- package/dist/esm/constants/version.js +1 -1
- package/dist/esm/customHooks/analyticsLogger.d.ts +2 -0
- package/dist/esm/customHooks/analyticsLogger.js +7 -0
- package/dist/esm/customHooks/bundleAnalyzer.d.ts +2 -0
- package/dist/esm/customHooks/bundleAnalyzer.js +77 -32
- package/dist/esm/customHooks/consoleLogger.d.ts +2 -0
- package/dist/esm/customHooks/consoleLogger.js +7 -0
- package/dist/esm/customHooks/crashHandler.d.ts +2 -0
- package/dist/esm/customHooks/crashHandler.js +7 -0
- package/dist/esm/customHooks/networkLogger.d.ts +2 -0
- package/dist/esm/customHooks/networkLogger.js +9 -0
- package/dist/esm/customHooks/performanceTracker.d.ts +3 -1
- package/dist/esm/customHooks/performanceTracker.js +15 -3
- package/dist/esm/customHooks/reduxLogger.d.ts +2 -0
- package/dist/esm/customHooks/reduxLogger.js +7 -0
- package/dist/esm/i18n/locales/en.json +96 -28
- package/dist/esm/index.js +64 -20
- package/dist/esm/styles/AppColors.d.ts +28 -0
- package/dist/esm/styles/AppColors.js +30 -0
- package/package.json +3 -2
|
@@ -170,6 +170,11 @@ export function getCallerSourceFile(fallbackName) {
|
|
|
170
170
|
export const getInitialRenderProfiles = () => [];
|
|
171
171
|
export const getInitialPerformanceEvents = () => [];
|
|
172
172
|
export const INITIAL_EVENTS = [];
|
|
173
|
+
let isPerformanceModuleEnabled = false;
|
|
174
|
+
export const setPerformanceModuleEnabled = (enabled) => {
|
|
175
|
+
isPerformanceModuleEnabled = enabled;
|
|
176
|
+
};
|
|
177
|
+
export const getPerformanceModuleEnabled = () => isPerformanceModuleEnabled;
|
|
173
178
|
const globalRenderRegistry = new Map();
|
|
174
179
|
const renderListeners = new Set();
|
|
175
180
|
const notifyRenderListeners = () => {
|
|
@@ -190,10 +195,14 @@ export const subscribeRenderProfiles = (listener) => {
|
|
|
190
195
|
};
|
|
191
196
|
export const getRenderProfiles = () => Array.from(globalRenderRegistry.values());
|
|
192
197
|
export const registerComponentProfile = (profile) => {
|
|
198
|
+
if (!isPerformanceModuleEnabled)
|
|
199
|
+
return;
|
|
193
200
|
globalRenderRegistry.set(profile.name, profile);
|
|
194
201
|
notifyRenderListeners();
|
|
195
202
|
};
|
|
196
203
|
export const trackComponentRender = (params) => {
|
|
204
|
+
if (!isPerformanceModuleEnabled)
|
|
205
|
+
return;
|
|
197
206
|
const existing = globalRenderRegistry.get(params.name);
|
|
198
207
|
const now = Date.now();
|
|
199
208
|
const renderTimeMs = params.renderTimeMs ?? 1.5;
|
|
@@ -434,7 +443,8 @@ export const useComponentProfiler = (componentName, options) => {
|
|
|
434
443
|
});
|
|
435
444
|
});
|
|
436
445
|
};
|
|
437
|
-
export const usePerformanceTracker = () => {
|
|
446
|
+
export const usePerformanceTracker = (enabled = true) => {
|
|
447
|
+
const isTrackerActive = enabled && isPerformanceModuleEnabled;
|
|
438
448
|
const [isRecording, setIsRecording] = useState(true);
|
|
439
449
|
const [currentFps, setCurrentFps] = useState(60);
|
|
440
450
|
const [minFps, setMinFps] = useState(60);
|
|
@@ -448,6 +458,8 @@ export const usePerformanceTracker = () => {
|
|
|
448
458
|
const [renderProfiles, setRenderProfiles] = useState(() => getRenderProfiles());
|
|
449
459
|
const [events, setEvents] = useState(() => getPerformanceEvents());
|
|
450
460
|
useEffect(() => {
|
|
461
|
+
if (!isTrackerActive)
|
|
462
|
+
return;
|
|
451
463
|
const unsubRender = subscribeRenderProfiles(profiles => {
|
|
452
464
|
setRenderProfiles(profiles);
|
|
453
465
|
});
|
|
@@ -458,13 +470,13 @@ export const usePerformanceTracker = () => {
|
|
|
458
470
|
unsubRender();
|
|
459
471
|
unsubEvents();
|
|
460
472
|
};
|
|
461
|
-
}, []);
|
|
473
|
+
}, [isTrackerActive]);
|
|
462
474
|
const lastFrameTimeRef = useRef(Date.now());
|
|
463
475
|
const rafIdRef = useRef(null);
|
|
464
476
|
const appStartTimestampRef = useRef(Date.now());
|
|
465
477
|
// Live Frame Measurement Loop
|
|
466
478
|
useEffect(() => {
|
|
467
|
-
if (!isRecording)
|
|
479
|
+
if (!isTrackerActive || !isRecording)
|
|
468
480
|
return;
|
|
469
481
|
let isMounted = true;
|
|
470
482
|
let frameCount = 0;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { ReduxHistoryEntry } from '../types';
|
|
2
2
|
export { ReduxHistoryEntry };
|
|
3
|
+
export declare const setReduxModuleEnabled: (enabled: boolean) => void;
|
|
4
|
+
export declare const getReduxModuleEnabled: () => boolean;
|
|
3
5
|
export declare const isReduxConnected: () => boolean;
|
|
4
6
|
export declare const getReduxState: () => any;
|
|
5
7
|
export declare const setReduxAutoRefresh: (val: boolean) => void;
|
|
@@ -15,6 +15,11 @@ import { parseStackLine } from '../helpers';
|
|
|
15
15
|
let currentReduxState = null;
|
|
16
16
|
const listeners = new Set();
|
|
17
17
|
let globalReduxAutoRefresh = true;
|
|
18
|
+
let isReduxModuleEnabled = false;
|
|
19
|
+
export const setReduxModuleEnabled = (enabled) => {
|
|
20
|
+
isReduxModuleEnabled = enabled;
|
|
21
|
+
};
|
|
22
|
+
export const getReduxModuleEnabled = () => isReduxModuleEnabled;
|
|
18
23
|
let lastActionForReducer = {};
|
|
19
24
|
let actionHistory = [];
|
|
20
25
|
const MAX_HISTORY = 50;
|
|
@@ -163,6 +168,8 @@ function extractSliceName(actionType, affectedSlices) {
|
|
|
163
168
|
return undefined;
|
|
164
169
|
}
|
|
165
170
|
function recordAction(action, prevState, nextState, rawStack) {
|
|
171
|
+
if (!isReduxModuleEnabled)
|
|
172
|
+
return;
|
|
166
173
|
const stack = rawStack || new Error().stack || '';
|
|
167
174
|
const type = actionTypeOf(action);
|
|
168
175
|
const payload = action && typeof action === 'object' && action.payload !== undefined
|
|
@@ -39,12 +39,35 @@
|
|
|
39
39
|
"redux": "Redux"
|
|
40
40
|
},
|
|
41
41
|
"settings": {
|
|
42
|
-
"mainTitle": "Settings",
|
|
42
|
+
"mainTitle": "Settings & Modules",
|
|
43
|
+
"mainSubtitle": "Manage modules and preferences",
|
|
43
44
|
"requiredBadge": "REQUIRED",
|
|
44
45
|
"defaultBadge": "DEFAULT",
|
|
45
46
|
"notConnectedBadge": "NOT CONNECTED",
|
|
46
47
|
"notDetectedBadge": "NOT DETECTED",
|
|
47
48
|
"readOnlyBadge": "READ ONLY",
|
|
49
|
+
"coreBadge": "CORE",
|
|
50
|
+
"activeBadge": "ACTIVE",
|
|
51
|
+
"dormantBadge": "DORMANT",
|
|
52
|
+
"protectedBadge": "PROTECTED",
|
|
53
|
+
"modulesAndTools": "Modules & Tools",
|
|
54
|
+
"uiPreferences": "UI Preferences",
|
|
55
|
+
"zeroOverheadTitle": "Zero Background Overhead",
|
|
56
|
+
"zeroOverheadDesc": "Check the modules you wish to activate. Disabled modules consume 0% CPU & memory until saved.",
|
|
57
|
+
"unsavedPending": "● Unsaved selections pending",
|
|
58
|
+
"allSynchronized": "All modules synchronized",
|
|
59
|
+
"modulesActive": "{{active}} of {{total}} Modules Active",
|
|
60
|
+
"saveChanges": "Save Changes",
|
|
61
|
+
"settingsSaved": "Settings Saved",
|
|
62
|
+
"settingsSavedDesc": "Active module configurations have been successfully updated.",
|
|
63
|
+
"configure": "Configure",
|
|
64
|
+
"appearanceTheme": "APPEARANCE & THEME",
|
|
65
|
+
"windowLayout": "WINDOW & LAYOUT",
|
|
66
|
+
"startupDefault": "STARTUP & DEFAULT SCREEN",
|
|
67
|
+
"logFiltersDeduplication": "LOG FILTERS & DEDUPLICATION",
|
|
68
|
+
"resetSettings": "Reset All Settings",
|
|
69
|
+
"resetSettingsDesc": "Wipe customized preferences back to default",
|
|
70
|
+
"reset": "Reset",
|
|
48
71
|
"reduxNotConnectedTip": "Redux store is not connected. Call connectReduxStore(store) or use inspectorReduxMiddleware to enable.",
|
|
49
72
|
"analyticsNotConnectedTip": "Analytics is not initialized. Call setupAnalyticsLogger(analytics()) to enable.",
|
|
50
73
|
"tabVisibility": "Tab Visibility",
|
|
@@ -55,7 +78,7 @@
|
|
|
55
78
|
"title": "APIs Settings",
|
|
56
79
|
"total": "Total: {{count}}",
|
|
57
80
|
"maxRequestLogs": "Max Request Logs",
|
|
58
|
-
"maxRequestLogsDescription": "
|
|
81
|
+
"maxRequestLogsDescription": "Buffer size of network requests preserved in memory",
|
|
59
82
|
"clearNetworkLogs": "Clear Network Logs",
|
|
60
83
|
"clearNetworkLogsDescription": "{{count}} requests stored",
|
|
61
84
|
"networkLogsCleared": "Network logs cleared.",
|
|
@@ -69,56 +92,91 @@
|
|
|
69
92
|
"title": "Logs Settings",
|
|
70
93
|
"total": "Total: {{count}}",
|
|
71
94
|
"maxConsoleLogs": "Max Console Logs",
|
|
72
|
-
"maxConsoleLogsDescription": "How many console
|
|
73
|
-
"logLevels": "Log
|
|
74
|
-
"logLevelsDescription": "
|
|
75
|
-
"showInfo": "Show
|
|
76
|
-
"
|
|
77
|
-
"
|
|
95
|
+
"maxConsoleLogsDescription": "How many console messages to retain",
|
|
96
|
+
"logLevels": "Log Severities",
|
|
97
|
+
"logLevelsDescription": "Select which severities to capture in Logs",
|
|
98
|
+
"showInfo": "Show Info logs",
|
|
99
|
+
"showInfoDesc": "Informational logs & debug prints",
|
|
100
|
+
"showWarn": "Show Warning logs",
|
|
101
|
+
"showWarnDesc": "Warning notices & deprecations",
|
|
102
|
+
"showError": "Show Error logs",
|
|
103
|
+
"showErrorDesc": "Runtime errors & exceptions",
|
|
78
104
|
"clearConsoleLogs": "Clear Console Logs",
|
|
79
105
|
"clearConsoleLogsDescription": "{{count}} logs stored",
|
|
80
106
|
"consoleLogsCleared": "Console logs cleared."
|
|
81
107
|
},
|
|
82
108
|
"analytics": {
|
|
83
109
|
"title": "Analytics Settings",
|
|
84
|
-
"total": "
|
|
85
|
-
"maxAnalyticsEvents": "
|
|
86
|
-
"maxAnalyticsEventsDescription": "
|
|
87
|
-
"clearAnalyticsEvents": "Clear Analytics
|
|
88
|
-
"clearAnalyticsEventsDescription": "
|
|
110
|
+
"total": "Events: {{count}}",
|
|
111
|
+
"maxAnalyticsEvents": "Events Captured",
|
|
112
|
+
"maxAnalyticsEventsDescription": "{{count}} analytics events stored in buffer",
|
|
113
|
+
"clearAnalyticsEvents": "Clear Analytics History",
|
|
114
|
+
"clearAnalyticsEventsDescription": "Wipe all captured telemetry events",
|
|
89
115
|
"analyticsEventsCleared": "Analytics events cleared."
|
|
90
116
|
},
|
|
91
117
|
"redux": {
|
|
92
118
|
"title": "Redux Settings",
|
|
93
119
|
"reducers": "Reducers: {{count}}",
|
|
94
120
|
"autoRefresh": "Auto-refresh Store",
|
|
95
|
-
"autoRefreshDescription": "
|
|
121
|
+
"autoRefreshDescription": "Capture Redux store state tree on every dispatch",
|
|
96
122
|
"defaultJsonExpandDepth": "Default JSON Expand Depth",
|
|
97
123
|
"defaultJsonExpandDepthDescription": "Initial depth of Redux state tree to auto-expand",
|
|
98
124
|
"clearReduxState": "Clear Redux State",
|
|
99
|
-
"clearReduxStateDescription": "Reset state snapshot in inspector",
|
|
100
|
-
"clearReduxStateEmpty": "No store snapshot
|
|
125
|
+
"clearReduxStateDescription": "Reset current state snapshot in inspector",
|
|
126
|
+
"clearReduxStateEmpty": "No store snapshot recorded",
|
|
101
127
|
"reduxStateCleared": "Redux state snapshot cleared.",
|
|
102
128
|
"clearReduxTimeline": "Clear Redux Timeline",
|
|
103
129
|
"clearReduxTimelineDescription": "Remove all captured action history",
|
|
104
130
|
"reduxTimelineCleared": "Redux action history cleared."
|
|
105
131
|
},
|
|
132
|
+
"bundle": {
|
|
133
|
+
"title": "Bundle Settings",
|
|
134
|
+
"sourceBundler": "Metro Source Bundler",
|
|
135
|
+
"sourceBundlerDesc": "Parses live module trees and calculates binary size breakdowns",
|
|
136
|
+
"clearCache": "Clear Bundle Cache",
|
|
137
|
+
"clearCacheDesc": "Force re-fetching and parsing of JS bundle",
|
|
138
|
+
"cacheCleared": "Bundle analysis cache cleared."
|
|
139
|
+
},
|
|
140
|
+
"performance": {
|
|
141
|
+
"title": "Performance Settings",
|
|
142
|
+
"frameMeasurement": "Live Frame Measurement",
|
|
143
|
+
"frameMeasurementDesc": "Samples UI/JS frame rates & detects wasteful re-renders",
|
|
144
|
+
"clearEvents": "Clear Performance Events",
|
|
145
|
+
"clearEventsDesc": "Reset recorded jank and FPS drops history",
|
|
146
|
+
"eventsCleared": "Performance events cleared."
|
|
147
|
+
},
|
|
148
|
+
"crash": {
|
|
149
|
+
"title": "Crash Settings",
|
|
150
|
+
"maxCrashLogs": "Max Crash Logs",
|
|
151
|
+
"maxCrashLogsDesc": "How many crash records to preserve in history",
|
|
152
|
+
"globalGuard": "Global Crash Guard",
|
|
153
|
+
"globalGuardDesc": "Intercepts native, JS, and render errors directly",
|
|
154
|
+
"clearHistory": "Clear Crash History",
|
|
155
|
+
"clearHistoryDesc": "{{count}} crash logs stored",
|
|
156
|
+
"historyCleared": "Crash logs cleared."
|
|
157
|
+
},
|
|
106
158
|
"general": {
|
|
107
|
-
"darkMode": "Dark Mode",
|
|
108
|
-
"darkModeDescription": "
|
|
109
|
-
"modalHeight": "
|
|
110
|
-
"modalHeightDescription": "
|
|
111
|
-
"modalAnimation": "
|
|
112
|
-
"modalAnimationDescription": "
|
|
159
|
+
"darkMode": "Dark Mode Theme",
|
|
160
|
+
"darkModeDescription": "Toggle sleek dark aesthetic or light contrast",
|
|
161
|
+
"modalHeight": "Inspector Window Height",
|
|
162
|
+
"modalHeightDescription": "Modal screen coverage percentage",
|
|
163
|
+
"modalAnimation": "Transition Animation",
|
|
164
|
+
"modalAnimationDescription": "Entrance and dismissal presentation style",
|
|
113
165
|
"duplicateLogs": "Show Duplicate Logs",
|
|
114
|
-
"duplicateLogsDescription": "
|
|
166
|
+
"duplicateLogsDescription": "Off: Identical repeated entries collapse into ×N badges",
|
|
167
|
+
"defaultOpeningTab": "Default Opening Tab",
|
|
168
|
+
"defaultOpeningTabDesc": "Initial tab active when launcher button is tapped",
|
|
169
|
+
"activeConsoleLogLevels": "Active Console Log Levels",
|
|
170
|
+
"activeConsoleLogLevelsDesc": "Select which severities to capture in Logs",
|
|
115
171
|
"resetToDefaults": "Reset to Defaults",
|
|
116
172
|
"resetToDefaultsDescription": "Restore all inspector settings",
|
|
117
173
|
"resetConfirmationTitle": "Settings Reset",
|
|
118
174
|
"resetConfirmationMessage": "All settings have been reset to default values.",
|
|
119
175
|
"storageStatus": "Persistent Storage",
|
|
120
|
-
"storageStatusEnabled": "Settings
|
|
121
|
-
"
|
|
176
|
+
"storageStatusEnabled": "Settings Storage: Persistent ({{type}})",
|
|
177
|
+
"storageStatusEnabledDesc": "Your preferences and module visibility persist across app reboots.",
|
|
178
|
+
"storageStatusDisabled": "Settings Storage: In-Memory (Temporary)",
|
|
179
|
+
"storageStatusDisabledDesc": "Preferences reset on app kill. Pass custom storage to <NetworkInspector storage={...} /> to persist on Android."
|
|
122
180
|
}
|
|
123
181
|
},
|
|
124
182
|
"network": {
|
|
@@ -178,10 +236,20 @@
|
|
|
178
236
|
"noMatchingHeaders": "No matching headers",
|
|
179
237
|
"diffHidden": "{ Diff hidden }",
|
|
180
238
|
"noDiff": "No differences from previous API.",
|
|
239
|
+
"healthTitle": "Network Health & Telemetry",
|
|
240
|
+
"successRate": "Success Rate",
|
|
241
|
+
"avgLatency": "Avg Latency",
|
|
242
|
+
"p95Latency": "P95 Latency",
|
|
243
|
+
"bandwidth": "Bandwidth",
|
|
244
|
+
"fastest": "Fastest",
|
|
245
|
+
"slowest": "Slowest",
|
|
246
|
+
"timingWaterfall": "Timing Waterfall & Latency",
|
|
247
|
+
"throughput": "Throughput",
|
|
248
|
+
"performanceTier": "Performance Tier",
|
|
181
249
|
"perf": {
|
|
182
|
-
"fast": "Fast",
|
|
183
|
-
"moderate": "Moderate",
|
|
184
|
-
"slow": "Slow"
|
|
250
|
+
"fast": "Fast (< 200ms)",
|
|
251
|
+
"moderate": "Moderate (200-800ms)",
|
|
252
|
+
"slow": "Slow (> 800ms)"
|
|
185
253
|
},
|
|
186
254
|
"jsonViewer": {
|
|
187
255
|
"pretty": "Pretty",
|
package/dist/esm/index.js
CHANGED
|
@@ -12,14 +12,16 @@ import { formatDisplayUrl, getNavigationInfo, deduplicateLogs, getDomainColor, g
|
|
|
12
12
|
// #5 — settings persistence
|
|
13
13
|
import { loadSettings, saveSettings, setCustomStorage, clearPersistedSettings, } from './helpers/settingsStore';
|
|
14
14
|
// Network
|
|
15
|
-
import { setupNetworkLogger, clearNetworkLogs, subscribeNetworkLogs, } from './customHooks/networkLogger';
|
|
15
|
+
import { setupNetworkLogger, clearNetworkLogs, subscribeNetworkLogs, setNetworkModuleEnabled, } from './customHooks/networkLogger';
|
|
16
16
|
// Console
|
|
17
|
-
import { setupConsoleLogger, clearConsoleLogs, subscribeConsoleLogs, } from './customHooks/consoleLogger';
|
|
17
|
+
import { setupConsoleLogger, clearConsoleLogs, subscribeConsoleLogs, setConsoleModuleEnabled, } from './customHooks/consoleLogger';
|
|
18
18
|
import { IGNORED_LOG_PREFIXES } from './customHooks/logFilters';
|
|
19
19
|
// Crash Protection
|
|
20
|
-
import { setupGlobalCrashHandler, subscribeCrashEvents, getCrashRecords, clearCrashRecords, setMaxCrashLogsLimit, } from './customHooks/crashHandler';
|
|
21
|
-
import { subscribeAnalyticsEvents, clearAnalyticsEvents, autoSetupAnalyticsLogger, isAnalyticsConnected, } from './customHooks/analyticsLogger';
|
|
22
|
-
import { getReduxState, subscribeReduxState, setReduxAutoRefresh, getLastActionForReducer, clearActionHistory, isReduxConnected, } from './customHooks/reduxLogger';
|
|
20
|
+
import { setupGlobalCrashHandler, subscribeCrashEvents, getCrashRecords, clearCrashRecords, setMaxCrashLogsLimit, setCrashModuleEnabled, } from './customHooks/crashHandler';
|
|
21
|
+
import { subscribeAnalyticsEvents, clearAnalyticsEvents, autoSetupAnalyticsLogger, isAnalyticsConnected, setAnalyticsModuleEnabled, } from './customHooks/analyticsLogger';
|
|
22
|
+
import { getReduxState, subscribeReduxState, setReduxAutoRefresh, getLastActionForReducer, clearActionHistory, isReduxConnected, setReduxModuleEnabled, } from './customHooks/reduxLogger';
|
|
23
|
+
import { setPerformanceModuleEnabled } from './customHooks/performanceTracker';
|
|
24
|
+
import { setBundleModuleEnabled } from './customHooks/bundleAnalyzer';
|
|
23
25
|
import { LIB_VERSION } from './constants';
|
|
24
26
|
// Stylesheet
|
|
25
27
|
import { toggleGlobalTheme } from './styles';
|
|
@@ -165,11 +167,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
165
167
|
const [tabVisibility, setTabVisibility] = useState({
|
|
166
168
|
apis: true,
|
|
167
169
|
logs: true,
|
|
168
|
-
analytics:
|
|
170
|
+
analytics: false,
|
|
169
171
|
redux: false,
|
|
170
172
|
bundle: false,
|
|
171
173
|
performance: false,
|
|
172
|
-
crash:
|
|
174
|
+
crash: false,
|
|
173
175
|
});
|
|
174
176
|
const [maxNetworkLogs, setMaxNetworkLogs] = useState(100);
|
|
175
177
|
const [reduxAutoRefresh, setReduxAutoRefreshState] = useState(true);
|
|
@@ -177,6 +179,16 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
177
179
|
// #6 — tab the inspector opens on. Shown with a DEFAULT badge in Settings.
|
|
178
180
|
const [defaultTab, setDefaultTab] = useState('apis');
|
|
179
181
|
const [showDuplicateLogs, setShowDuplicateLogs] = useState(false);
|
|
182
|
+
// Synchronize runtime background listeners with active settings
|
|
183
|
+
useEffect(() => {
|
|
184
|
+
setNetworkModuleEnabled(!!tabVisibility.apis);
|
|
185
|
+
setConsoleModuleEnabled(!!tabVisibility.logs);
|
|
186
|
+
setAnalyticsModuleEnabled(!!tabVisibility.analytics);
|
|
187
|
+
setReduxModuleEnabled(!!tabVisibility.redux);
|
|
188
|
+
setPerformanceModuleEnabled(!!tabVisibility.performance);
|
|
189
|
+
setCrashModuleEnabled(!!tabVisibility.crash);
|
|
190
|
+
setBundleModuleEnabled(!!tabVisibility.bundle);
|
|
191
|
+
}, [tabVisibility]);
|
|
180
192
|
const resetToDefaults = async () => {
|
|
181
193
|
await clearPersistedSettings();
|
|
182
194
|
setIsDark(false);
|
|
@@ -186,11 +198,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
186
198
|
setTabVisibility({
|
|
187
199
|
apis: true,
|
|
188
200
|
logs: true,
|
|
189
|
-
analytics:
|
|
201
|
+
analytics: false,
|
|
190
202
|
redux: false,
|
|
191
203
|
bundle: false,
|
|
192
204
|
performance: false,
|
|
193
|
-
crash:
|
|
205
|
+
crash: false,
|
|
194
206
|
});
|
|
195
207
|
setDefaultTab('apis');
|
|
196
208
|
setMaxCrashLogs(100);
|
|
@@ -226,9 +238,6 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
226
238
|
...prev,
|
|
227
239
|
...saved.tabVisibility,
|
|
228
240
|
apis: true, // APIs is always required
|
|
229
|
-
crash: saved.tabVisibility.crash !== undefined
|
|
230
|
-
? saved.tabVisibility.crash
|
|
231
|
-
: true,
|
|
232
241
|
}));
|
|
233
242
|
if (saved.defaultTab)
|
|
234
243
|
setDefaultTab(saved.defaultTab);
|
|
@@ -250,11 +259,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
250
259
|
...{
|
|
251
260
|
apis: true,
|
|
252
261
|
logs: true,
|
|
253
|
-
analytics:
|
|
262
|
+
analytics: false,
|
|
254
263
|
redux: false,
|
|
255
264
|
bundle: false,
|
|
256
265
|
performance: false,
|
|
257
|
-
crash:
|
|
266
|
+
crash: false,
|
|
258
267
|
},
|
|
259
268
|
...(saved.tabVisibility || {}),
|
|
260
269
|
apis: true,
|
|
@@ -619,13 +628,37 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
619
628
|
loop.start();
|
|
620
629
|
return () => loop.stop();
|
|
621
630
|
}, [unreadPulseAnim]);
|
|
622
|
-
|
|
631
|
+
const isVisibleRefObj = useRef(visible);
|
|
632
|
+
// #6 — every time the inspector is opened, land on chosen default tab & sync latest logs
|
|
623
633
|
useEffect(() => {
|
|
634
|
+
isVisibleRefObj.current = visible;
|
|
624
635
|
if (visible) {
|
|
625
636
|
const target = defaultTab === 'apis' || tabVisibility?.[defaultTab]
|
|
626
637
|
? defaultTab
|
|
627
638
|
: 'apis';
|
|
628
639
|
setActiveTab(target);
|
|
640
|
+
// Instant synchronization of data collected while modal was closed
|
|
641
|
+
if (latestNetworkLogsRef.current.length > 0) {
|
|
642
|
+
const deduped = deduplicateLogs(latestNetworkLogsRef.current);
|
|
643
|
+
const incoming = new Set(deduped.map(l => l.id));
|
|
644
|
+
prevLogIdsRef.current = incoming;
|
|
645
|
+
setLogs(deduped);
|
|
646
|
+
}
|
|
647
|
+
if (latestConsoleLogsRef.current.length > 0) {
|
|
648
|
+
setConsoleLogs(latestConsoleLogsRef.current);
|
|
649
|
+
}
|
|
650
|
+
if (latestAnalyticsEventsRef.current.length > 0) {
|
|
651
|
+
setAnalyticsEvents(latestAnalyticsEventsRef.current);
|
|
652
|
+
}
|
|
653
|
+
const freshState = getReduxState();
|
|
654
|
+
if (freshState) {
|
|
655
|
+
setReduxState(typeof freshState === 'object' ? { ...freshState } : freshState);
|
|
656
|
+
setReduxLastActionMap({ ...getLastActionForReducer() });
|
|
657
|
+
}
|
|
658
|
+
const freshCrashes = getCrashRecords();
|
|
659
|
+
if (freshCrashes.length > 0) {
|
|
660
|
+
setCrashRecords(freshCrashes);
|
|
661
|
+
}
|
|
629
662
|
}
|
|
630
663
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
631
664
|
}, [visible]);
|
|
@@ -653,6 +686,7 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
653
686
|
setupConsoleLogger();
|
|
654
687
|
autoSetupAnalyticsLogger();
|
|
655
688
|
setupGlobalCrashHandler();
|
|
689
|
+
const isVisibleRef = isVisibleRefObj;
|
|
656
690
|
const unsubscribeCrash = subscribeCrashEvents(crashInfo => {
|
|
657
691
|
if (crashInfo.message === '__CLEARED__') {
|
|
658
692
|
setCrashRecords([]);
|
|
@@ -660,7 +694,9 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
660
694
|
return;
|
|
661
695
|
}
|
|
662
696
|
const updated = getCrashRecords();
|
|
663
|
-
|
|
697
|
+
if (isVisibleRef.current) {
|
|
698
|
+
setCrashRecords(updated);
|
|
699
|
+
}
|
|
664
700
|
});
|
|
665
701
|
// Sync crashes recorded before this subscription ran (e.g. a render crash
|
|
666
702
|
// during the very first commit, which fires before effects are mounted).
|
|
@@ -674,6 +710,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
674
710
|
latestNetworkLogsRef.current = raw;
|
|
675
711
|
if (isNetworkPausedRef.current)
|
|
676
712
|
return;
|
|
713
|
+
if (!isVisibleRef.current)
|
|
714
|
+
return; // ZERO-RENDER INACTIVE MODE
|
|
677
715
|
clearTimeout(timeoutId);
|
|
678
716
|
const updateNetworkState = () => {
|
|
679
717
|
const deduped = deduplicateLogs(raw);
|
|
@@ -713,6 +751,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
713
751
|
latestAnalyticsEventsRef.current = raw;
|
|
714
752
|
if (isAnalyticsPausedRef.current)
|
|
715
753
|
return;
|
|
754
|
+
if (!isVisibleRef.current)
|
|
755
|
+
return; // ZERO-RENDER INACTIVE MODE
|
|
716
756
|
clearTimeout(analyticsTimeoutId);
|
|
717
757
|
const updateAnalyticsState = () => {
|
|
718
758
|
const incoming = new Set(raw.map(e => e.id));
|
|
@@ -750,6 +790,8 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
750
790
|
latestConsoleLogsRef.current = raw;
|
|
751
791
|
if (isConsolePausedRef.current)
|
|
752
792
|
return;
|
|
793
|
+
if (!isVisibleRef.current)
|
|
794
|
+
return; // ZERO-RENDER INACTIVE MODE
|
|
753
795
|
clearTimeout(consoleTimeoutId);
|
|
754
796
|
if (isFirstConsoleCall) {
|
|
755
797
|
isFirstConsoleCall = false;
|
|
@@ -762,11 +804,13 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
|
|
|
762
804
|
}
|
|
763
805
|
});
|
|
764
806
|
const initialReduxState = getReduxState();
|
|
765
|
-
|
|
766
|
-
|
|
807
|
+
if (initialReduxState) {
|
|
808
|
+
setReduxState(typeof initialReduxState === 'object' ? { ...initialReduxState } : initialReduxState);
|
|
809
|
+
setReduxLastActionMap({ ...getLastActionForReducer() });
|
|
810
|
+
}
|
|
767
811
|
const unsubscribeRedux = subscribeReduxState(() => {
|
|
768
|
-
|
|
769
|
-
|
|
812
|
+
if (!isVisibleRef.current)
|
|
813
|
+
return; // ZERO-RENDER INACTIVE MODE
|
|
770
814
|
const freshState = getReduxState();
|
|
771
815
|
setReduxState(freshState && typeof freshState === 'object' ? { ...freshState } : freshState);
|
|
772
816
|
setReduxLastActionMap({ ...getLastActionForReducer() });
|
|
@@ -154,6 +154,20 @@ declare const LightColors: {
|
|
|
154
154
|
greyBorder: string;
|
|
155
155
|
paperBg: string;
|
|
156
156
|
contentBg: string;
|
|
157
|
+
toastBg: string;
|
|
158
|
+
toastBorder: string;
|
|
159
|
+
mintGreenBg: string;
|
|
160
|
+
mintGreenBorder: string;
|
|
161
|
+
mintGreenText: string;
|
|
162
|
+
amberWarmBg: string;
|
|
163
|
+
amberWarmBorder: string;
|
|
164
|
+
amberWarmText: string;
|
|
165
|
+
violetSoftBg: string;
|
|
166
|
+
violetSoftBorder: string;
|
|
167
|
+
violetSoftText: string;
|
|
168
|
+
skySoftBg: string;
|
|
169
|
+
skySoftBorder: string;
|
|
170
|
+
skySoftText: string;
|
|
157
171
|
domainColors: string[];
|
|
158
172
|
};
|
|
159
173
|
export declare const getThemeColors: (isDark: boolean) => {
|
|
@@ -312,6 +326,20 @@ export declare const getThemeColors: (isDark: boolean) => {
|
|
|
312
326
|
greyBorder: string;
|
|
313
327
|
paperBg: string;
|
|
314
328
|
contentBg: string;
|
|
329
|
+
toastBg: string;
|
|
330
|
+
toastBorder: string;
|
|
331
|
+
mintGreenBg: string;
|
|
332
|
+
mintGreenBorder: string;
|
|
333
|
+
mintGreenText: string;
|
|
334
|
+
amberWarmBg: string;
|
|
335
|
+
amberWarmBorder: string;
|
|
336
|
+
amberWarmText: string;
|
|
337
|
+
violetSoftBg: string;
|
|
338
|
+
violetSoftBorder: string;
|
|
339
|
+
violetSoftText: string;
|
|
340
|
+
skySoftBg: string;
|
|
341
|
+
skySoftBorder: string;
|
|
342
|
+
skySoftText: string;
|
|
315
343
|
domainColors: string[];
|
|
316
344
|
};
|
|
317
345
|
export declare const AppColors: typeof LightColors;
|
|
@@ -161,6 +161,21 @@ const LightColors = {
|
|
|
161
161
|
greyBorder: '#E3DFEC',
|
|
162
162
|
paperBg: '#FBF9FC',
|
|
163
163
|
contentBg: '#F8F7FB',
|
|
164
|
+
// ─── Toast / Glass / Chip Tokens ───
|
|
165
|
+
toastBg: '#0F172AEE',
|
|
166
|
+
toastBorder: '#33415588',
|
|
167
|
+
mintGreenBg: '#ECFDF5',
|
|
168
|
+
mintGreenBorder: '#A7F3D0',
|
|
169
|
+
mintGreenText: '#059669',
|
|
170
|
+
amberWarmBg: '#FFFBEB',
|
|
171
|
+
amberWarmBorder: '#FDE68A',
|
|
172
|
+
amberWarmText: '#92400E',
|
|
173
|
+
violetSoftBg: '#EDE9FE',
|
|
174
|
+
violetSoftBorder: '#DDD6FE',
|
|
175
|
+
violetSoftText: '#7C3AED',
|
|
176
|
+
skySoftBg: '#E0F2FE',
|
|
177
|
+
skySoftBorder: '#BAE6FD',
|
|
178
|
+
skySoftText: '#0284C7',
|
|
164
179
|
// ─── Domain Colors (Thai Airways Themed) ───
|
|
165
180
|
domainColors: [
|
|
166
181
|
'#5C2D91',
|
|
@@ -237,6 +252,21 @@ const DarkColors = {
|
|
|
237
252
|
amber700: '#C5A059',
|
|
238
253
|
amber800: '#B89758',
|
|
239
254
|
green500: '#22C55E',
|
|
255
|
+
// ─── Toast / Glass / Chip Tokens (Dark) ───
|
|
256
|
+
toastBg: '#1E293BEE',
|
|
257
|
+
toastBorder: '#47556988',
|
|
258
|
+
mintGreenBg: '#064E3B66',
|
|
259
|
+
mintGreenBorder: '#05966988',
|
|
260
|
+
mintGreenText: '#34D399',
|
|
261
|
+
amberWarmBg: '#451A0366',
|
|
262
|
+
amberWarmBorder: '#D9770688',
|
|
263
|
+
amberWarmText: '#FCD34D',
|
|
264
|
+
violetSoftBg: '#3B076466',
|
|
265
|
+
violetSoftBorder: '#7C3AED88',
|
|
266
|
+
violetSoftText: '#C084FC',
|
|
267
|
+
skySoftBg: '#082F4966',
|
|
268
|
+
skySoftBorder: '#0284C788',
|
|
269
|
+
skySoftText: '#38BDF8',
|
|
240
270
|
green600: '#16A34A',
|
|
241
271
|
green700: '#15803D',
|
|
242
272
|
green800: '#166534',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-inapp-inspector",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.35",
|
|
4
4
|
"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.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -30,8 +30,9 @@
|
|
|
30
30
|
"react-native-inapp-inspector.podspec"
|
|
31
31
|
],
|
|
32
32
|
"scripts": {
|
|
33
|
+
"clean": "rm -rf dist",
|
|
33
34
|
"prebuild": "node scripts/gen-version.js",
|
|
34
|
-
"build": "tsc && tsc -p tsconfig.esm.json",
|
|
35
|
+
"build": "npm run clean && tsc && tsc -p tsconfig.esm.json",
|
|
35
36
|
"watch": "tsc -w",
|
|
36
37
|
"prepack": "npm run build",
|
|
37
38
|
"publish": "node release.cjs",
|