react-native-inapp-inspector 2.0.5 → 2.0.6

package/dist/esm/index.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import { Alert, Animated, PanResponder, Platform, UIManager, LogBox, InteractionManager, } from 'react-native';
+import { Alert, Animated, PanResponder, Platform, UIManager, LogBox, InteractionManager, View, StyleSheet, } from 'react-native';
 import { NavigationContext } from '@react-navigation/native';
 // i18n
 import { I18nextProvider, i18n } from './i18n';
@@ -23,14 +23,22 @@ import { subscribeAnalyticsEvents, clearAnalyticsEvents, autoSetupAnalyticsLogge
 import { getReduxState, subscribeReduxState, setReduxAutoRefresh, getLastActionForReducer, clearActionHistory, isReduxConnected, setReduxModuleEnabled, } from './customHooks/reduxLogger';
 import { setPerformanceModuleEnabled } from './customHooks/performanceTracker';
 import { setBundleModuleEnabled } from './customHooks/bundleAnalyzer';
+import { fetchAllStorageEntries, setStorageItem, removeStorageItem, clearAllStorage, subscribeStorageChanges, } from './customHooks/storageInspector';
+import { getSystemDiagnostics } from './helpers/deviceInfo';
+import { runLivePackageAudit, subscribeAuditChanges, logCodeQualityIssue, } from './helpers/packageAuditor';
 import { showNativeFloatingButton, hideNativeFloatingButton, setNativeFloatingButtonBadge, subscribeNativeFloatingButtonPress, subscribeNativeDeviceShake, isNativeModuleAvailable, } from './native/NativeInspector';
 import { LIB_VERSION } from './constants';
 // Stylesheet
 import { toggleGlobalTheme } from './styles';
-const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigationRef, appIcon, environment, initialVisible, visible: controlledVisible, }) => {
+const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigationRef, appIcon, environment, initialVisible, visible: controlledVisible, initialTab, enablePerformanceHud = false, }) => {
+    // Zero-overhead production stub: if disabled, return null immediately
+    if (!enabled || !isEnabled) {
+        return null;
+    }
     // Set custom storage synchronously during render phase
     setCustomStorage(storage || null);
     const [isDark, setIsDark] = useState(false);
+    const [isPerformanceHudEnabled, setIsPerformanceHudEnabled] = useState(enablePerformanceHud);
     const [reduxState, setReduxState] = useState(null);
     // Per-reducer last action is kept in component state so the
     // Redux tab re-renders live on every dispatch, independent of the state tree ref.
@@ -45,6 +53,11 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             setVisible(controlledVisible);
         }
     }, [controlledVisible]);
+    useEffect(() => {
+        if (enablePerformanceHud !== undefined) {
+            setIsPerformanceHudEnabled(enablePerformanceHud);
+        }
+    }, [enablePerformanceHud]);
     const [isReady, setIsReady] = useState(false);
     const [selected, setSelected] = useState(null);
     const [selectedLogs, setSelectedLogs] = useState(new Set());
@@ -84,7 +97,7 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
     const [showReqDiff, setShowReqDiff] = useState(false);
     const [showResDiff, setShowResDiff] = useState(false);
     // ─── Analytics state ───────────────────────────────────────────────────────
-    const [activeTab, setActiveTab] = useState('apis');
+    const [activeTab, setActiveTab] = useState(initialTab || 'apis');
     const [analyticsEvents, setAnalyticsEvents] = useState([]);
     // ─── Logs state ────────────────────────────────────────────────────────────
     const [consoleLogs, setConsoleLogs] = useState([]);
@@ -140,6 +153,47 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             setLastReadCrashesCount(crashRecords.length);
         }
     }, [activeTab, crashRecords.length]);
+    // ─── Storage state ─────────────────────────────────────────────────────────
+    const [storageEntries, setStorageEntries] = useState([]);
+    const [selectedStorageKey, setSelectedStorageKey] = useState(null);
+    const refreshStorageEntries = useCallback(async () => {
+        try {
+            const entries = await fetchAllStorageEntries();
+            setStorageEntries(entries);
+        }
+        catch { }
+    }, []);
+    const updateStorageEntry = useCallback(async (key, value) => {
+        await setStorageItem(key, value);
+        await refreshStorageEntries();
+    }, [refreshStorageEntries]);
+    const deleteStorageEntry = useCallback(async (key) => {
+        await removeStorageItem(key);
+        await refreshStorageEntries();
+    }, [refreshStorageEntries]);
+    const clearAllStorageEntries = useCallback(async () => {
+        await clearAllStorage();
+        await refreshStorageEntries();
+    }, [refreshStorageEntries]);
+    useEffect(() => {
+        refreshStorageEntries();
+        const unsub = subscribeStorageChanges(refreshStorageEntries);
+        return () => unsub();
+    }, [refreshStorageEntries]);
+    // ─── Device info state ──────────────────────────────────────────────────────
+    const [deviceInfo] = useState(() => getSystemDiagnostics());
+    // ─── Code Quality & Package Audit state ─────────────────────────────────────
+    const [auditReport, setAuditReport] = useState(() => runLivePackageAudit());
+    useEffect(() => {
+        const unsub = subscribeAuditChanges(setAuditReport);
+        return () => unsub();
+    }, []);
+    const refreshAuditReport = useCallback(() => {
+        setAuditReport(runLivePackageAudit());
+    }, []);
+    const logCustomAuditIssue = useCallback((issue) => {
+        logCodeQualityIssue(issue);
+    }, []);
     const [maxConsoleLogs, setMaxConsoleLogs] = useState(100);
     const [showConsoleLevels, setShowConsoleLevels] = useState({
         info: true,
@@ -180,6 +234,9 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
         logs: true,
         analytics: false,
         redux: false,
+        storage: false,
+        device: false,
+        audit: false,
         bundle: false,
         performance: false,
         crash: false,
@@ -234,6 +291,9 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             logs: true,
             analytics: false,
             redux: false,
+            storage: false,
+            device: false,
+            audit: false,
             bundle: false,
             performance: false,
             crash: false,
@@ -271,14 +331,24 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                 setModalHeightPercent(saved.modalHeightPercent);
             if (saved.modalAnimationType)
                 setModalAnimationType(saved.modalAnimationType);
-            if (saved.tabVisibility)
+            if (saved.tabVisibility) {
+                const savedVis = saved.tabVisibility;
                 setTabVisibility(prev => ({
                     ...prev,
-                    ...saved.tabVisibility,
+                    ...savedVis,
+                    storage: savedVis.storage ?? false,
+                    device: savedVis.device ?? false,
+                    audit: savedVis.audit ?? false,
                     apis: true, // APIs is always required
                 }));
-            if (saved.defaultTab)
+            }
+            if (initialTab) {
+                setActiveTab(initialTab);
+            }
+            else if (saved.defaultTab) {
                 setDefaultTab(saved.defaultTab);
+                setActiveTab(saved.defaultTab);
+            }
             if (saved.isAutoRamLimitEnabled != null)
                 setIsAutoRamLimitEnabled(saved.isAutoRamLimitEnabled);
             if (saved.maxNetworkLogs != null)
@@ -299,7 +369,10 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                 setShowDuplicateLogs(saved.showDuplicateLogs);
             if (saved.showUpdateToast != null)
                 setShowUpdateToast(saved.showUpdateToast);
-            if (saved.defaultTab) {
+            if (initialTab) {
+                setActiveTab(initialTab);
+            }
+            else if (saved.defaultTab) {
                 const dt = saved.defaultTab;
                 const vis = {
                     ...{
@@ -307,6 +380,9 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                         logs: true,
                         analytics: false,
                         redux: false,
+                        storage: false,
+                        device: false,
+                        audit: false,
                         bundle: false,
                         performance: false,
                         crash: false,
@@ -775,6 +851,12 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
                 ? defaultTab
                 : 'apis';
             setActiveTab(target);
+            setSelected(null);
+            setSelectedEvent(null);
+            setSelectedLog(null);
+            setSelectedReduxSlice(null);
+            setSelectedReduxAction(null);
+            setSelectedCrash(null);
             // Track inspector opened event in GA4
             trackInspectorOpen({ activeTab: target });
             // Instant synchronization of data collected while modal was closed
@@ -1754,6 +1836,20 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
             setCrashRecords([]);
             setSelectedCrash(null);
         },
+        // ─── Storage ─────────────────────────────────────────────────────────
+        storageEntries,
+        refreshStorageEntries,
+        updateStorageEntry,
+        deleteStorageEntry,
+        clearAllStorageEntries,
+        selectedStorageKey,
+        setSelectedStorageKey,
+        // ─── Device ──────────────────────────────────────────────────────────
+        deviceInfo,
+        // ─── Audit / Code Quality ─────────────────────────────────────────────
+        auditReport,
+        refreshAuditReport,
+        logCustomAuditIssue,
         // ─── Settings ───────────────────────────────────────────────────────
         settingsActiveSubTab,
         setSettingsActiveSubTab,
@@ -1778,13 +1874,17 @@ const NetworkInspector = ({ enabled = true, isEnabled = true, storage, navigatio
         isAutoRamLimitEnabled,
         setIsAutoRamLimitEnabled,
         deviceFreeRamMb,
+        isPerformanceHudEnabled,
+        setIsPerformanceHudEnabled,
         reduxAutoRefresh,
         setReduxAutoRefreshState,
         reduxExpandDepth,
         setReduxExpandDepth,
     };
     return (<InspectorContext.Provider value={contextValue}>
-      <MainScreen />
+      <View style={StyleSheet.absoluteFill} pointerEvents="box-none">
+        <MainScreen />
+      </View>
     </InspectorContext.Provider>);
 };
 const NetworkInspectorWrapper = (props) => {
@@ -1813,5 +1913,6 @@ export { usePerformanceTracker, useComponentProfiler, useNavigationProfiler, tra
 export { InspectLog, InspectTrackTime, InspectCatch, } from './decorators';
 export { getNativeDeviceMetrics, enableNativeCrashProtection, subscribeNativeCrashes, showNativeFloatingButton, hideNativeFloatingButton, setNativeFloatingButtonBadge, subscribeNativeFloatingButtonPress, subscribeNativeDeviceShake, startNativeFpsMonitoring, stopNativeFpsMonitoring, getNativeFpsMetrics, getNativeStorageItem, setNativeStorageItem, isNativeModuleAvailable, } from './native/NativeInspector';
 export { sendSessionTelemetryPing, trackTelemetryEvent, trackInspectorOpen, trackTabSwitch, trackLogExport, GA4_MEASUREMENT_ID, GA4_API_SECRET, } from './helpers';
+export { runLivePackageAudit, logCodeQualityIssue, clearCustomAuditIssues, } from './helpers/packageAuditor';
 export { BrandSquareIcon, BrandCircleIcon, } from './components/NetworkIcons';
 export { ActiveTab, Method, StatusFilter, SortOrder, LocalFilter, ModalAnimationType, SettingsPage, SettingsSubTab, LogFilter, ConsoleLogType, AnalyticsEventSource, GAEventCategory, StackFrameType, DiffResultType, BundleSubTab, PerformanceSubTab, CrashType, CrashExportFormat, CrashDetailSubTab, CrashFilterType, BreadcrumbType, } from './types';

package/dist/esm/native/NativeInspector.d.ts

@@ -14,6 +14,7 @@ export interface NativeDeviceMetrics {
     isCharging?: boolean;
     deviceModel?: string;
     deviceBrand?: string;
+    deviceId?: string;
     osVersion?: string;
     apiLevel?: number;
     cpuAbi?: string;

package/dist/esm/types/enums.d.ts

@@ -3,6 +3,9 @@ export declare const ActiveTab: {
     readonly Analytics: "analytics";
     readonly Logs: "logs";
     readonly Redux: "redux";
+    readonly Storage: "storage";
+    readonly Device: "device";
+    readonly Audit: "audit";
     readonly Bundle: "bundle";
     readonly Performance: "performance";
     readonly Crash: "crash";
@@ -49,6 +52,9 @@ export declare const SettingsPage: {
     readonly Logs: "logs";
     readonly Analytics: "analytics";
     readonly Redux: "redux";
+    readonly Storage: "storage";
+    readonly Device: "device";
+    readonly Audit: "audit";
     readonly Bundle: "bundle";
     readonly Performance: "performance";
     readonly Crash: "crash";
@@ -56,6 +62,7 @@ export declare const SettingsPage: {
 export type SettingsPage = (typeof SettingsPage)[keyof typeof SettingsPage] | null;
 export declare const SettingsSubTab: {
     readonly Module: "module";
+    readonly Limits: "limits";
     readonly Ui: "ui";
 };
 export type SettingsSubTab = (typeof SettingsSubTab)[keyof typeof SettingsSubTab];

package/dist/esm/types/enums.js

@@ -6,6 +6,9 @@ export const ActiveTab = {
     Analytics: 'analytics',
     Logs: 'logs',
     Redux: 'redux',
+    Storage: 'storage',
+    Device: 'device',
+    Audit: 'audit',
     Bundle: 'bundle',
     Performance: 'performance',
     Crash: 'crash',
@@ -46,12 +49,16 @@ export const SettingsPage = {
     Logs: 'logs',
     Analytics: 'analytics',
     Redux: 'redux',
+    Storage: 'storage',
+    Device: 'device',
+    Audit: 'audit',
     Bundle: 'bundle',
     Performance: 'performance',
     Crash: 'crash',
 };
 export const SettingsSubTab = {
     Module: 'module',
+    Limits: 'limits',
     Ui: 'ui',
 };
 export const LogFilter = {

package/dist/esm/types/interfaces.d.ts

@@ -3,6 +3,64 @@ import { ViewStyle } from 'react-native';
 import { Animated, PanResponderInstance } from 'react-native';
 import type { ActiveTab, BreadcrumbType, CrashType, GroupedListItem, LocalFilter, LogFilter, Method, SettingsPage, SettingsSubTab, SortOrder, StatusFilter } from './index';
 export type SearchScope = 'all' | 'url' | 'reqBody' | 'resBody' | 'headers';
+export interface StorageEntry {
+    key: string;
+    value: string;
+    sizeBytes: number;
+    isJson: boolean;
+    parsedJson?: any;
+    updatedAt: number;
+}
+export interface DeviceInfoData {
+    appName: string;
+    bundleId: string;
+    appVersion: string;
+    buildNumber: string;
+    reactNativeVersion: string;
+    jsEngine: string;
+    isHermes: boolean;
+    isFabric: boolean;
+    isTurboModule: boolean;
+    platform: 'ios' | 'android' | 'windows' | 'macos' | 'web';
+    osVersion: string;
+    deviceModel: string;
+    deviceId?: string;
+    isDevice: boolean;
+    screenWidth: number;
+    screenHeight: number;
+    screenScale: number;
+    screenFontScale: number;
+    statusBarHeight: number;
+    memoryMb?: number;
+    arch?: string;
+    locale?: string;
+    timeZone?: string;
+}
+export type AuditSeverity = 'critical' | 'warning' | 'info' | 'optimal';
+export type AuditCategory = 'dependency' | 'typescript' | 'peer' | 'performance' | 'security';
+export interface AuditIssue {
+    id: string;
+    title: string;
+    message: string;
+    severity: AuditSeverity;
+    category: AuditCategory;
+    packageName?: string;
+    currentVersion?: string;
+    requiredVersion?: string;
+    fixCommand?: string;
+    fixSnippet?: string;
+    timestamp: number;
+}
+export interface PackageHealthReport {
+    score: number;
+    grade: 'A+' | 'A' | 'B' | 'C' | 'D';
+    totalIssues: number;
+    criticalCount: number;
+    warningCount: number;
+    infoCount: number;
+    issues: AuditIssue[];
+    scannedAt: number;
+}
 export interface ParsedStackFrame {
     method: string;
     file: string;
@@ -164,6 +222,8 @@ export interface NetworkInspectorProps {
     environment?: 'DEV' | 'UAT' | 'PrePROD' | 'PROD' | 'QA' | 'Staging' | string;
     initialVisible?: boolean;
     visible?: boolean;
+    initialTab?: ActiveTab;
+    enablePerformanceHud?: boolean;
 }
 export interface NavigationTrackerProps {
     onStateChange: (state: any) => void;
@@ -176,6 +236,8 @@ export interface InspectorContextValue {
     isEnabled: boolean;
     appIcon?: any;
     environment?: string;
+    isPerformanceHudEnabled: boolean;
+    setIsPerformanceHudEnabled: React.Dispatch<React.SetStateAction<boolean>>;
     modalHeightPercent: number;
     setModalHeightPercent: React.Dispatch<React.SetStateAction<number>>;
     modalAnimationType: 'slide' | 'fade' | 'none';
@@ -305,6 +367,17 @@ export interface InspectorContextValue {
     maxCrashLogs: number;
     setMaxCrashLogs: React.Dispatch<React.SetStateAction<number>>;
     clearAllCrashes: () => void;
+    storageEntries: StorageEntry[];
+    refreshStorageEntries: () => Promise<void>;
+    updateStorageEntry: (key: string, value: string) => Promise<void>;
+    deleteStorageEntry: (key: string) => Promise<void>;
+    clearAllStorageEntries: () => Promise<void>;
+    selectedStorageKey: string | null;
+    setSelectedStorageKey: React.Dispatch<React.SetStateAction<string | null>>;
+    deviceInfo: DeviceInfoData;
+    auditReport: PackageHealthReport;
+    refreshAuditReport: () => void;
+    logCustomAuditIssue: (issue: Omit<AuditIssue, 'id' | 'timestamp'>) => void;
     settingsActiveSubTab: SettingsSubTab;
     setSettingsActiveSubTab: React.Dispatch<React.SetStateAction<SettingsSubTab>>;
     defaultTab: ActiveTab;

package/ios/NetworkInspectorModule.mm

@@ -515,6 +515,10 @@ RCT_EXPORT_METHOD(getDeviceMetrics:(RCTPromiseResolveBlock)resolve
     [metrics setObject:[UIDevice currentDevice].systemName forKey:@"deviceBrand"];
     [metrics setObject:[UIDevice currentDevice].systemVersion forKey:@"osVersion"];
     [metrics setObject:@"arm64" forKey:@"cpuAbi"];
+    NSString *deviceId = [[UIDevice currentDevice].identifierForVendor UUIDString];
+    if (deviceId) {
+        [metrics setObject:deviceId forKey:@"deviceId"];
+    }
 
     // 5. Application Identifiers (Legal & Non-PII)
     NSBundle *mainBundle = [NSBundle mainBundle];
@@ -557,10 +561,13 @@ static UIWindow *GetAppActiveWindow(void) {
     return [UIApplication sharedApplication].windows.firstObject;
 }
 
+static BOOL isFloatingButtonRequestedVisible = NO;
+
 RCT_EXPORT_METHOD(showFloatingButton:(NSDictionary *)options
                   resolve:(RCTPromiseResolveBlock)resolve
                   reject:(RCTPromiseRejectBlock)reject) {
     dispatch_async(dispatch_get_main_queue(), ^{
+        isFloatingButtonRequestedVisible = YES;
         UIWindow *targetWindow = GetAppActiveWindow();
         CGRect screenBounds = targetWindow ? targetWindow.bounds : [UIScreen mainScreen].bounds;
 
@@ -599,6 +606,7 @@ RCT_EXPORT_METHOD(showFloatingButton:(NSDictionary *)options
         }
 
         void (^attachToWindow)(void) = ^{
+            if (!isFloatingButtonRequestedVisible) return;
             UIWindow *activeWin = GetAppActiveWindow();
             if (!activeWin || !floatingButtonView) return;
             
@@ -635,12 +643,11 @@ RCT_EXPORT_METHOD(showFloatingButton:(NSDictionary *)options
 RCT_EXPORT_METHOD(hideFloatingButton:(RCTPromiseResolveBlock)resolve
                   reject:(RCTPromiseRejectBlock)reject) {
     dispatch_async(dispatch_get_main_queue(), ^{
+        isFloatingButtonRequestedVisible = NO;
         if (floatingButtonView != nil) {
-            [UIView animateWithDuration:0.15 animations:^{
-                floatingButtonView.alpha = 0.0;
-            } completion:^(BOOL finished) {
-                floatingButtonView.hidden = YES;
-            }];
+            floatingButtonView.alpha = 0.0;
+            floatingButtonView.hidden = YES;
+            [floatingButtonView removeFromSuperview];
         }
         resolve(@(YES));
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-inapp-inspector",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "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",
@@ -44,6 +44,9 @@
     "clean": "rm -rf dist",
     "prebuild": "node scripts/gen-version.js",
     "build": "npm run clean && tsc && tsc -p tsconfig.esm.json && node scripts/inject-telemetry.js",
+    "typecheck": "tsc --noEmit",
+    "format": "prettier --write \"src/**/*.{ts,tsx}\"",
+    "format:check": "prettier --check \"src/**/*.{ts,tsx}\"",
     "watch": "tsc -w",
     "prepack": "npm run build",
     "publish": "node release.cjs",