react-native-inapp-inspector 2.3.14 → 2.3.16

package/dist/esm/index.js

@@ -12,15 +12,16 @@ import { setupNetworkLogger, clearNetworkLogs, subscribeNetworkLogs, setNetworkM
 import { setupConsoleLogger, clearConsoleLogs, subscribeConsoleLogs, setConsoleModuleEnabled, } from './customHooks/consoleLogger';
 import { IGNORED_LOG_PREFIXES } from './customHooks/logFilters';
 import { setupGlobalCrashHandler, subscribeCrashEvents, getCrashRecords, clearCrashRecords, setMaxCrashLogsLimit, setCrashModuleEnabled, } from './customHooks/crashHandler';
-import { trackActiveTelemetryHeartbeat, setTelemetryEnabled, } from './helpers/telemetry';
+import { trackActiveTelemetryHeartbeat, setTelemetryEnabled, trackInspectorTabView, trackInspectorScreenView, } from './helpers/telemetry';
 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 { showNativeFloatingButton, hideNativeFloatingButton, setNativeFloatingButtonBadge, subscribeNativeFloatingButtonPress, subscribeNativeDeviceShake, isNativeModuleAvailable, } from './native/NativeInspector';
+import { fetchRemoteConfigModuleStatus, } from './helpers/remoteConfig';
 import { LIB_VERSION } from './constants';
 import { toggleGlobalTheme } from './styles';
-const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, environment, initialVisible = false, visible: controlledVisible, }) => {
+const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, environment, initialVisible = false, visible: controlledVisible, remoteConfig, }) => {
     setCustomStorage(storage || null);
     const [isDark, setIsDark] = useState(false);
     const [reduxState, setReduxState] = useState(null);
@@ -127,7 +128,7 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
     const [maxConsoleLogs, setMaxConsoleLogs] = useState(100);
     const [showConsoleLevels, setShowConsoleLevels] = useState({
         info: true,
-        warn: false,
+        warn: true,
         error: true,
     });
     const visibleConsoleLogs = useMemo(() => {
@@ -155,8 +156,9 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         return filtered.slice(0, maxConsoleLogs);
     }, [consoleLogs, showConsoleLevels, maxConsoleLogs]);
     const [logSearch, setLogSearch] = useState('');
-    const [logFilters, setLogFilters] = useState(new Set(['user-log']));
+    const [logFilters, setLogFilters] = useState(new Set(['all']));
     const [settingsPage, setSettingsPage] = useState(null);
+    const [isFeedbackOpen, setIsFeedbackOpen] = useState(false);
     const [settingsActiveSubTab, setSettingsActiveSubTab] = useState('module');
     const [tabVisibility, setTabVisibility] = useState({
         apis: true,
@@ -170,8 +172,8 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         storage: false,
         debugging: false,
     });
-    const [maxNetworkLogs, setMaxNetworkLogs] = useState(100);
-    const [maxAnalyticsEventsLimit, setMaxAnalyticsEventsLimit] = useState(75);
+    const [maxNetworkLogs, setMaxNetworkLogs] = useState(250);
+    const [maxAnalyticsEventsLimit, setMaxAnalyticsEventsLimit] = useState(150);
     const [isAutoRamLimitEnabled, setIsAutoRamLimitEnabled] = useState(true);
     const [deviceFreeRamMb, setDeviceFreeRamMb] = useState(1800);
     const [reduxAutoRefresh, setReduxAutoRefreshState] = useState(true);
@@ -309,6 +311,25 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
             cancelled = true;
         };
     }, []);
+    useEffect(() => {
+        let isMounted = true;
+        if (remoteConfig === false)
+            return;
+        fetchRemoteConfigModuleStatus(typeof remoteConfig === 'object' ? remoteConfig : undefined)
+            .then(remoteModules => {
+            if (isMounted && remoteModules) {
+                setTabVisibility(prev => ({
+                    ...prev,
+                    ...remoteModules,
+                    apis: remoteModules.apis ?? true,
+                }));
+            }
+        })
+            .catch(() => { });
+        return () => {
+            isMounted = false;
+        };
+    }, [remoteConfig]);
     useEffect(() => {
         if (!settingsHydratedRef.current)
             return;
@@ -448,6 +469,7 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
             setActiveTab(key);
             loadNativePage(key);
         }
+        trackInspectorTabView(key);
     }, [loadNativePage]);
     const [selectedEvent, setSelectedEvent] = useState(null);
     const [analyticsSearch, setAnalyticsSearch] = useState('');
@@ -758,10 +780,12 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
     useEffect(() => {
         isVisibleRefObj.current = visible;
         if (visible) {
+            trackInspectorScreenView('InspectorModal');
             const target = defaultTab === 'apis' || tabVisibility?.[defaultTab]
                 ? defaultTab
                 : 'apis';
             setActiveTab(target);
+            trackInspectorTabView(target);
             if (latestNetworkLogsRef.current.length > 0) {
                 const deduped = deduplicateLogs(latestNetworkLogsRef.current);
                 const incoming = new Set(deduped.map(l => l.id));
@@ -1366,27 +1390,18 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
                     log.caller || '',
                     log.type || '',
                     log.sourceMethod || '',
+                    log.stack || '',
                 ].join(' ').toLowerCase();
                 return queryTokens.every(token => {
-                    if (token.startsWith('level:') || token.startsWith('is:') || token.startsWith('type:')) {
-                        const flag = token.replace(/^(level:|is:|type:)/, '').trim();
-                        if (flag === 'error' || flag === 'err')
-                            return log.type === 'error';
-                        if (flag === 'warn' || flag === 'warning')
-                            return log.type === 'warn';
-                        if (flag === 'info')
-                            return log.type === 'info';
-                        if (flag === 'log')
-                            return log.sourceMethod === 'log';
-                        if (flag === 'analytics')
-                            return (log.message || '').toLowerCase().includes('[analytics');
-                    }
                     if (token === 'error' || token === 'err') {
                         return log.type === 'error' || searchTarget.includes(token);
                     }
                     if (token === 'warn' || token === 'warning') {
                         return log.type === 'warn' || searchTarget.includes(token);
                     }
+                    if (token === 'info') {
+                        return log.type === 'info' || searchTarget.includes(token);
+                    }
                     return searchTarget.includes(token);
                 });
             });
@@ -1431,8 +1446,20 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
                     log.caller || '',
                     log.type || '',
                     log.sourceMethod || '',
+                    log.stack || '',
                 ].join(' ').toLowerCase();
-                return queryTokens.every(token => searchTarget.includes(token));
+                return queryTokens.every(token => {
+                    if (token === 'error' || token === 'err') {
+                        return log.type === 'error' || searchTarget.includes(token);
+                    }
+                    if (token === 'warn' || token === 'warning') {
+                        return log.type === 'warn' || searchTarget.includes(token);
+                    }
+                    if (token === 'info') {
+                        return log.type === 'info' || searchTarget.includes(token);
+                    }
+                    return searchTarget.includes(token);
+                });
             });
         }
         const total = visibleConsoleLogs.length;
@@ -1446,14 +1473,15 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         };
     }, [visibleConsoleLogs, logSearch]);
     function closeModal() {
-        animateNextLayout();
         setVisible(false);
-        setSelected(null);
-        setSelectedEvent(null);
-        setSelectedLog(null);
-        setSelectedReduxSlice(null);
-        setSelectedReduxAction(null);
-        setSelectedCrash(null);
+        setTimeout(() => {
+            setSelected(null);
+            setSelectedEvent(null);
+            setSelectedLog(null);
+            setSelectedReduxSlice(null);
+            setSelectedReduxAction(null);
+            setSelectedCrash(null);
+        }, 300);
     }
     function handleClearAll() {
         clearNetworkLogs();
@@ -1463,13 +1491,17 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         setCollapsedSections(new Set());
         setStatusFilters(new Set());
         setMethodFilters(new Set());
+        setSearch('');
         prevLogIdsRef.current = new Set();
         logRouteMapRef.current = new Map();
         clearAnalyticsEvents();
         setAnalyticsEvents([]);
+        setAnalyticsSearch('');
         prevEventIdsRef.current = new Set();
         clearConsoleLogs();
         setConsoleLogs([]);
+        setLogFilters(new Set(['all']));
+        setLogSearch('');
     }
     function handleDelete() {
         if (activeTab === 'logs') {
@@ -1583,7 +1615,7 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
             return next;
         });
     }, []);
-    const contextValue = {
+    const contextValue = useMemo(() => ({
         visible,
         setVisible,
         closeModal,
@@ -1614,6 +1646,8 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         setShowHeaderInfo,
         settingsPage,
         setSettingsPage,
+        isFeedbackOpen,
+        setIsFeedbackOpen,
         updateAvailable,
         latestNpmVersion,
         clearAnim,
@@ -1750,7 +1784,114 @@ const NetworkInspector = ({ enabled = true, storage, navigationRef, appIcon, env
         setReduxAutoRefreshState,
         reduxExpandDepth,
         setReduxExpandDepth,
-    };
+    }), [
+        visible,
+        closeModal,
+        isReady,
+        enabled,
+        appIcon,
+        environment,
+        modalHeightPercent,
+        modalAnimationType,
+        hasNavigationContext,
+        setNavState,
+        activeTab,
+        switchActiveTab,
+        tabVisibility,
+        toggleTabVisibility,
+        lastReadApisCount,
+        lastReadLogsCount,
+        selected,
+        selectedEvent,
+        selectedLog,
+        showHeaderInfo,
+        settingsPage,
+        isFeedbackOpen,
+        updateAvailable,
+        latestNpmVersion,
+        clearAnim,
+        activePulseAnim,
+        unreadPulseAnim,
+        runClearAllWithAnimation,
+        useNativeFab,
+        fabPan,
+        fabPanResponder,
+        pulseAnim,
+        fabShineAnim,
+        logs,
+        filteredLogs,
+        groupedData,
+        search,
+        searchScope,
+        isRegexSearch,
+        isCaseSensitive,
+        quickFilter,
+        statusFilters,
+        methodFilters,
+        availableMethods,
+        sortOrder,
+        selectedLogs,
+        toggleSelect,
+        minStart,
+        totalRange,
+        newLogIds,
+        toggleSectionFilter,
+        toggleSectionCollapse,
+        handleDelete,
+        isNetworkPaused,
+        detailTitle,
+        detailDisplayUrl,
+        apiDetailActiveTab,
+        detailSearch,
+        reqExpanded,
+        resExpanded,
+        showReqDiff,
+        showResDiff,
+        prevRequestData,
+        prevResponseData,
+        consoleLogs,
+        visibleConsoleLogs,
+        filteredConsoleLogs,
+        logSearch,
+        logFilters,
+        logCounts,
+        logSortOrder,
+        isConsolePaused,
+        analyticsEvents,
+        filteredAnalyticsEvents,
+        analyticsSearch,
+        analyticsFilters,
+        isAnalyticsFilterApplied,
+        resetAnalyticsFilters,
+        newEventIds,
+        isAnalyticsLayoutReady,
+        analyticsHeaderExpanded,
+        isAnalyticsPaused,
+        reduxState,
+        reduxLastActionMap,
+        reduxSearch,
+        selectedReduxSlice,
+        selectedReduxAction,
+        reduxActiveSubTab,
+        crashRecords,
+        selectedCrash,
+        lastReadCrashesCount,
+        maxCrashLogs,
+        settingsActiveSubTab,
+        defaultTab,
+        isDark,
+        showDuplicateLogs,
+        showUpdateToast,
+        showConsoleLevels,
+        storage,
+        maxNetworkLogs,
+        maxConsoleLogs,
+        maxAnalyticsEventsLimit,
+        isAutoRamLimitEnabled,
+        deviceFreeRamMb,
+        reduxAutoRefresh,
+        reduxExpandDepth,
+    ]);
     return (<InspectorContext.Provider value={contextValue}>
       <MainScreen />
     </InspectorContext.Provider>);
@@ -1807,4 +1948,5 @@ export { ActiveTab, Method, StatusFilter, SortOrder, LocalFilter, ModalAnimation
 export { AppFonts, setAppFonts, } from './styles/AppFonts';
 export { AppColors, setAppColors, getThemeColors, updateAppColorsTheme, } from './styles/AppColors';
 export { t, i18n, useTranslation, setLanguage, addTranslations, setTranslations, I18nextProvider, } from './i18n';
+export { fetchRemoteConfigModuleStatus, isFirebaseRemoteConfigAvailable, } from './helpers/remoteConfig';
 export { LIB_VERSION } from './constants/version';

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

@@ -1,12 +1,14 @@
 export interface AppFontConfig {
     interRegular?: string;
     interMedium?: string;
+    interSemiBold?: string;
     interBold?: string;
     Sfprotext?: string;
 }
 export declare const AppFonts: {
     interRegular: string;
     interMedium: string;
+    interSemiBold: string;
     interBold: string;
     Sfprotext: string;
 };

package/dist/esm/styles/AppFonts.js

@@ -1,6 +1,7 @@
 export const AppFonts = {
     interRegular: 'Inter-Regular',
     interMedium: 'Inter-Medium',
+    interSemiBold: 'Inter-SemiBold',
     interBold: 'Inter-Bold',
     Sfprotext: 'Inter-Regular',
 };

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

@@ -149,6 +149,28 @@ export declare const getRawStyles: (colors: typeof AppColors) => {
     listContent: {
         paddingBottom: number;
     };
+    supportFab: {
+        position: string;
+        bottom: number;
+        right: number;
+        width: number;
+        height: number;
+        borderRadius: number;
+        backgroundColor: string;
+        alignItems: string;
+        justifyContent: string;
+        shadowColor: string;
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+        zIndex: number;
+        borderWidth: number;
+        borderColor: string;
+    };
     scrollTopBtn: {
         position: string;
         bottom: number;

package/dist/esm/styles/index.js

@@ -137,6 +137,25 @@ export const getRawStyles = (colors) => ({
         letterSpacing: 0.2,
     },
     listContent: { paddingBottom: Platform.OS === 'ios' ? 44 : 32 },
+    supportFab: {
+        position: 'absolute',
+        bottom: 22,
+        right: 16,
+        width: 42,
+        height: 42,
+        borderRadius: 21,
+        backgroundColor: colors.purple,
+        alignItems: 'center',
+        justifyContent: 'center',
+        shadowColor: colors.purple,
+        shadowOffset: { width: 0, height: 4 },
+        shadowOpacity: 0.45,
+        shadowRadius: 8,
+        elevation: 14,
+        zIndex: 999,
+        borderWidth: 1.5,
+        borderColor: 'rgba(255, 255, 255, 0.25)',
+    },
     scrollTopBtn: {
         position: 'absolute',
         bottom: 22,

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

@@ -67,6 +67,7 @@ export declare const SettingsSubTab: {
     readonly Module: "module";
     readonly Ui: "ui";
     readonly Limits: "limits";
+    readonly About: "about";
 };
 export type SettingsSubTab = (typeof SettingsSubTab)[keyof typeof SettingsSubTab];
 export declare const LogFilter: {

package/dist/esm/types/enums.js

@@ -60,6 +60,7 @@ export const SettingsSubTab = {
     Module: 'module',
     Ui: 'ui',
     Limits: 'limits',
+    About: 'about',
 };
 export const LogFilter = {
     All: 'all',

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

@@ -151,8 +151,17 @@ export interface PersistedSettings {
     reduxExpandDepth?: number;
     showDuplicateLogs?: boolean;
     showUpdateToast?: boolean;
+    useNativeFab?: boolean;
+    shakeToOpen?: boolean;
     telemetryClientId?: string;
+    telemetryDeviceId?: string;
+    deviceRegistered?: boolean;
+    deviceFirstSeen?: number;
     telemetryLastPing?: number;
+    telemetryLastActive?: number;
+    starPromptActioned?: boolean;
+    starPromptLastShown?: number;
+    starPromptFirstSeen?: number;
 }
 export interface NetworkInspectorProps {
     enabled?: boolean;
@@ -163,6 +172,7 @@ export interface NetworkInspectorProps {
     environment?: 'DEV' | 'UAT' | 'PrePROD' | 'PROD' | 'QA' | 'Staging' | string;
     initialVisible?: boolean;
     visible?: boolean;
+    remoteConfig?: boolean | any;
 }
 export interface NavigationTrackerProps {
     onStateChange: (state: any) => void;
@@ -198,6 +208,8 @@ export interface InspectorContextValue {
     setShowHeaderInfo: React.Dispatch<React.SetStateAction<boolean>>;
     settingsPage: SettingsPage;
     setSettingsPage: React.Dispatch<React.SetStateAction<SettingsPage>>;
+    isFeedbackOpen: boolean;
+    setIsFeedbackOpen: React.Dispatch<React.SetStateAction<boolean>>;
     updateAvailable: boolean;
     latestNpmVersion: string | null;
     clearAnim: Animated.Value;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-inapp-inspector",
-  "version": "2.3.14",
+  "version": "2.3.16",
   "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",

package/src/components/AnimatedEntrance.tsx

@@ -23,16 +23,16 @@ const AnimatedEntrance = React.memo(function AnimatedEntrance({
   }
 
   const progress = useRef(new Animated.Value(0)).current;
+  const initialIndex = useRef(index).current;
 
   useEffect(() => {
-    progress.setValue(0);
     Animated.timing(progress, {
       toValue: 1,
       duration,
-      delay: delay + Math.min(index, 12) * 18,
+      delay: delay + Math.min(initialIndex, 8) * 12,
       useNativeDriver: true,
     }).start();
-  }, [delay, duration, index, progress]);
+  }, []);
 
   return (
     <Animated.View