react-native-inapp-inspector 1.1.18 → 1.1.20

package/dist/commonjs/components/Inspector/InsightsDashboard.js

@@ -1,619 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_native_1 = require("react-native");
-const InspectorContext_1 = require("./InspectorContext");
-const TouchableScale_1 = __importDefault(require("../TouchableScale"));
-const styles_1 = __importDefault(require("../../styles"));
-const AppColors_1 = require("../../styles/AppColors");
-const AppFonts_1 = require("../../styles/AppFonts");
-const helpers_1 = require("../../helpers");
-const NetworkIcons_1 = require("../NetworkIcons");
-const InsightsDashboard = () => {
-    const { logs, visibleConsoleLogs, analyticsEvents, webViewNavHistory, tabVisibility, slowRequestThreshold, insightsActiveSubTab, setInsightsActiveSubTab, switchActiveTab, reduxState, } = (0, InspectorContext_1.useInspector)();
-    const apiTotal = logs.length;
-    const apiErrors = logs.filter(l => (l.status != null && l.status >= 400) ||
-        l.status === 0 ||
-        l.status == null).length;
-    const apiSuccess = apiTotal - apiErrors;
-    const apiSuccessRate = apiTotal > 0 ? Math.round((apiSuccess / apiTotal) * 100) : 100;
-    const durations = logs
-        .filter(l => l.duration != null)
-        .map(l => l.duration);
-    const avgTime = durations.length > 0
-        ? Math.round(durations.reduce((a, b) => a + b, 0) / durations.length)
-        : null;
-    const logTotal = visibleConsoleLogs.length;
-    const logErrors = visibleConsoleLogs.filter(l => l.type === 'error').length;
-    const logWarns = visibleConsoleLogs.filter(l => l.type === 'warn').length;
-    const logInfos = visibleConsoleLogs.filter(l => l.type === 'info').length;
-    const analyticsTotal = analyticsEvents.length;
-    const uniqueEvents = new Set(analyticsEvents.map(e => e.name)).size;
-    const screenViews = analyticsEvents.filter(e => e.name === 'screen_view' ||
-        e.name === 'page_view' ||
-        e.name === 'firebase_screen_class').length;
-    const webviewTotal = webViewNavHistory.length;
-    // --- Richer insights metrics ---
-    const slowestTime = durations.length > 0 ? Math.max(...durations) : null;
-    const fastestTime = durations.length > 0 ? Math.min(...durations) : null;
-    const slowCount = durations.filter(d => d >= slowRequestThreshold).length;
-    const status2xx = logs.filter(l => l.status != null && l.status >= 200 && l.status < 300).length;
-    const status3xx = logs.filter(l => l.status != null && l.status >= 300 && l.status < 400).length;
-    const status4xx = logs.filter(l => l.status != null && l.status >= 400 && l.status < 500).length;
-    const status5xx = logs.filter(l => l.status != null && l.status >= 500).length;
-    const totalSignals = apiTotal + logTotal + analyticsTotal + webviewTotal;
-    const totalIssues = apiErrors + logErrors;
-    const activeModules = [
-        tabVisibility?.apis,
-        tabVisibility?.logs,
-        tabVisibility?.analytics,
-        tabVisibility?.webview,
-        tabVisibility?.redux,
-    ].filter(Boolean).length;
-    // Composite health score: success rate penalised by error volume and slow requests.
-    const healthScore = totalSignals === 0
-        ? 100
-        : Math.max(0, Math.min(100, Math.round(apiSuccessRate -
-            (logErrors > 0 ? Math.min(15, logErrors * 3) : 0) -
-            (slowCount > 0 ? Math.min(10, slowCount * 2) : 0))));
-    const healthColor = healthScore >= 90
-        ? AppColors_1.AppColors.greenColor
-        : healthScore >= 70
-            ? AppColors_1.AppColors.warningIconGold
-            : AppColors_1.AppColors.errorColor;
-    const healthLabel = healthScore >= 90
-        ? 'Healthy'
-        : healthScore >= 70
-            ? 'Needs attention'
-            : 'Degraded';
-    return (<react_native_1.View style={styles_1.default.dashboardContainer}>
-      {/* Overview hero card */}
-      <react_native_1.View style={{
-            backgroundColor: AppColors_1.AppColors.primaryLight,
-            borderRadius: 14,
-            borderWidth: 1,
-            borderColor: AppColors_1.AppColors.grayBorderSecondary,
-            padding: 16,
-            marginBottom: 12,
-        }}>
-        <react_native_1.View style={{
-            flexDirection: 'row',
-            alignItems: 'center',
-            gap: 14,
-        }}>
-          {/* Health ring stand-in */}
-          <react_native_1.View style={{
-            width: 64,
-            height: 64,
-            borderRadius: 32,
-            borderWidth: 4,
-            borderColor: healthColor,
-            alignItems: 'center',
-            justifyContent: 'center',
-            backgroundColor: AppColors_1.AppColors.purpleShade50,
-        }}>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 18,
-            color: healthColor,
-        }}>
-              {healthScore}
-            </react_native_1.Text>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interMedium,
-            fontSize: 7.5,
-            color: AppColors_1.AppColors.grayTextWeak,
-            letterSpacing: 0.4,
-        }}>
-              HEALTH
-            </react_native_1.Text>
-          </react_native_1.View>
-          <react_native_1.View style={{ flex: 1 }}>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 15,
-            color: AppColors_1.AppColors.primaryBlack,
-        }}>
-              Session Overview
-            </react_native_1.Text>
-            <react_native_1.View style={{
-            flexDirection: 'row',
-            alignItems: 'center',
-            gap: 6,
-            marginTop: 3,
-        }}>
-              <react_native_1.View style={{
-            width: 7,
-            height: 7,
-            borderRadius: 3.5,
-            backgroundColor: healthColor,
-        }}/>
-              <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interMedium,
-            fontSize: 11.5,
-            color: healthColor,
-        }}>
-                {healthLabel}
-              </react_native_1.Text>
-              <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interRegular,
-            fontSize: 11.5,
-            color: AppColors_1.AppColors.grayTextWeak,
-        }}>
-                • {activeModules} modules active
-              </react_native_1.Text>
-            </react_native_1.View>
-          </react_native_1.View>
-        </react_native_1.View>
-
-        {/* Quick totals strip */}
-        <react_native_1.View style={{
-            flexDirection: 'row',
-            marginTop: 14,
-            borderTopWidth: 1,
-            borderTopColor: AppColors_1.AppColors.dividerColor,
-            paddingTop: 12,
-        }}>
-          <react_native_1.View style={{ flex: 1, alignItems: 'center' }}>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 16,
-            color: AppColors_1.AppColors.primaryBlack,
-        }}>
-              {totalSignals}
-            </react_native_1.Text>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interRegular,
-            fontSize: 10,
-            color: AppColors_1.AppColors.grayTextWeak,
-            marginTop: 1,
-        }}>
-              Signals
-            </react_native_1.Text>
-          </react_native_1.View>
-          <react_native_1.View style={{ width: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
-          <react_native_1.View style={{ flex: 1, alignItems: 'center' }}>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 16,
-            color: totalIssues > 0
-                ? AppColors_1.AppColors.errorColor
-                : AppColors_1.AppColors.primaryBlack,
-        }}>
-              {totalIssues}
-            </react_native_1.Text>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interRegular,
-            fontSize: 10,
-            color: AppColors_1.AppColors.grayTextWeak,
-            marginTop: 1,
-        }}>
-              Issues
-            </react_native_1.Text>
-          </react_native_1.View>
-          <react_native_1.View style={{ width: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
-          <react_native_1.View style={{ flex: 1, alignItems: 'center' }}>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interBold,
-            fontSize: 16,
-            color: slowCount > 0
-                ? AppColors_1.AppColors.warningIconGold
-                : AppColors_1.AppColors.primaryBlack,
-        }}>
-              {slowCount}
-            </react_native_1.Text>
-            <react_native_1.Text style={{
-            fontFamily: AppFonts_1.AppFonts.interRegular,
-            fontSize: 10,
-            color: AppColors_1.AppColors.grayTextWeak,
-            marginTop: 1,
-        }}>
-              Slow ({slowRequestThreshold}ms+)
-            </react_native_1.Text>
-          </react_native_1.View>
-        </react_native_1.View>
-      </react_native_1.View>
-
-      {/* ── Insights Sub-Tab Selector ── */}
-      {(() => {
-            const insightTabs = [
-                {
-                    key: 'apis',
-                    label: 'APIs',
-                    icon: (c, s) => <NetworkIcons_1.SignalIcon color={c} size={s}/>,
-                    color: AppColors_1.AppColors.purple,
-                    count: apiTotal,
-                    visible: !!tabVisibility?.apis,
-                },
-                {
-                    key: 'logs',
-                    label: 'Logs',
-                    icon: (c, s) => <NetworkIcons_1.TerminalIcon color={c} size={s}/>,
-                    color: '#0D9488',
-                    count: logTotal,
-                    visible: !!tabVisibility?.logs,
-                },
-                {
-                    key: 'analytics',
-                    label: 'Analytics',
-                    icon: (c, s) => <NetworkIcons_1.AnalyticsIcon color={c} size={s}/>,
-                    color: '#EA580C',
-                    count: analyticsTotal,
-                    visible: !!tabVisibility?.analytics,
-                },
-                {
-                    key: 'webview',
-                    label: 'WebView',
-                    icon: (c, s) => <NetworkIcons_1.GlobeIcon color={c} size={s}/>,
-                    color: '#2563EB',
-                    count: webviewTotal,
-                    visible: !!tabVisibility?.webview,
-                },
-                {
-                    key: 'redux',
-                    label: 'Redux',
-                    icon: (c, s) => <NetworkIcons_1.TerminalIcon color={c} size={s}/>,
-                    color: AppColors_1.AppColors.purple,
-                    count: reduxState ? Object.keys(reduxState).length : 0,
-                    visible: !!tabVisibility?.redux,
-                },
-            ];
-            const visibleTabs = insightTabs.filter(t => t.visible);
-            if (visibleTabs.length === 0)
-                return null;
-            return (<>
-            <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{
-                    paddingHorizontal: 2,
-                    paddingVertical: 2,
-                    gap: 8,
-                }} style={{
-                    marginBottom: 12,
-                    flexGrow: 0,
-                }}>
-              {visibleTabs.map(tab => {
-                    const isActive = insightsActiveSubTab === tab.key;
-                    return (<react_native_1.TouchableOpacity key={tab.key} onPress={() => {
-                            (0, InspectorContext_1.animateNextLayout)();
-                            setInsightsActiveSubTab(tab.key);
-                        }} activeOpacity={0.7} style={{
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            gap: 6,
-                            paddingHorizontal: 14,
-                            paddingVertical: 8,
-                            borderRadius: 20,
-                            backgroundColor: isActive
-                                ? tab.color
-                                : AppColors_1.AppColors.primaryLight,
-                            borderWidth: 1,
-                            borderColor: isActive
-                                ? tab.color
-                                : AppColors_1.AppColors.grayBorderSecondary,
-                        }}>
-                    {tab.icon(isActive ? '#FFFFFF' : tab.color, 14)}
-                    <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 11.5,
-                            color: isActive ? '#FFFFFF' : AppColors_1.AppColors.grayTextStrong,
-                        }}>
-                      {tab.label}
-                    </react_native_1.Text>
-                    <react_native_1.View style={{
-                            minWidth: 20,
-                            height: 18,
-                            borderRadius: 9,
-                            paddingHorizontal: 5,
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            backgroundColor: isActive
-                                ? 'rgba(255,255,255,0.25)'
-                                : AppColors_1.AppColors.grayBackground,
-                        }}>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 9.5,
-                            color: isActive ? '#FFFFFF' : AppColors_1.AppColors.grayTextWeak,
-                        }}>
-                        {tab.count}
-                      </react_native_1.Text>
-                    </react_native_1.View>
-                  </react_native_1.TouchableOpacity>);
-                })}
-            </react_native_1.ScrollView>
-
-            {/* ── Active Module Card ── */}
-            {insightsActiveSubTab === 'apis' && tabVisibility?.apis && (<TouchableScale_1.default style={styles_1.default.dashboardModuleCard} onPress={() => switchActiveTab('apis')}>
-                <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
-                    <NetworkIcons_1.SignalIcon color={AppColors_1.AppColors.purple} size={18}/>
-                    <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>APIs & Network</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
-                </react_native_1.View>
-                <react_native_1.View style={styles_1.default.dashboardModuleGrid}>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>{apiTotal}</react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Requests</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[
-                        styles_1.default.dashboardGridVal,
-                        apiSuccessRate < 90 && { color: AppColors_1.AppColors.warningIconGold },
-                    ]}>
-                      {apiSuccessRate}%
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Success Rate</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[
-                        styles_1.default.dashboardGridVal,
-                        apiErrors > 0 && { color: AppColors_1.AppColors.errorColor },
-                    ]}>
-                      {apiErrors}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Errors</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>
-                      {avgTime != null ? `${avgTime}ms` : '—'}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Avg Latency</react_native_1.Text>
-                  </react_native_1.View>
-                </react_native_1.View>
-
-                {/* Status-class breakdown + latency range */}
-                <react_native_1.View style={{
-                        marginTop: 10,
-                        paddingTop: 10,
-                        borderTopWidth: 1,
-                        borderTopColor: AppColors_1.AppColors.dividerColor,
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        flexWrap: 'wrap',
-                        gap: 6,
-                    }}>
-                  {[
-                        { label: '2xx', value: status2xx, color: AppColors_1.AppColors.greenColor },
-                        { label: '3xx', value: status3xx, color: AppColors_1.AppColors.skyBlue },
-                        {
-                            label: '4xx',
-                            value: status4xx,
-                            color: AppColors_1.AppColors.warningIconGold,
-                        },
-                        { label: '5xx', value: status5xx, color: AppColors_1.AppColors.errorColor },
-                    ].map(s => (<react_native_1.View key={s.label} style={{
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            gap: 4,
-                            backgroundColor: AppColors_1.AppColors.grayBackground,
-                            borderRadius: 6,
-                            borderWidth: 1,
-                            borderColor: AppColors_1.AppColors.dividerColor,
-                            paddingHorizontal: 7,
-                            paddingVertical: 3,
-                        }}>
-                      <react_native_1.View style={{
-                            width: 6,
-                            height: 6,
-                            borderRadius: 3,
-                            backgroundColor: s.color,
-                        }}/>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 10,
-                            color: AppColors_1.AppColors.grayTextStrong,
-                        }}>
-                        {s.label} {s.value}
-                      </react_native_1.Text>
-                    </react_native_1.View>))}
-                  {slowestTime != null && (<react_native_1.View style={{
-                            marginLeft: 'auto',
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            gap: 4,
-                        }}>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interRegular,
-                            fontSize: 10,
-                            color: AppColors_1.AppColors.grayTextWeak,
-                        }}>
-                        Range
-                      </react_native_1.Text>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 10,
-                            color: AppColors_1.AppColors.grayTextStrong,
-                        }}>
-                        {fastestTime}–{slowestTime}ms
-                      </react_native_1.Text>
-                    </react_native_1.View>)}
-                </react_native_1.View>
-              </TouchableScale_1.default>)}
-
-            {insightsActiveSubTab === 'logs' && tabVisibility?.logs && (<TouchableScale_1.default style={styles_1.default.dashboardModuleCard} onPress={() => switchActiveTab('logs')}>
-                <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
-                    <NetworkIcons_1.TerminalIcon color="#0D9488" size={18}/>
-                    <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>Console Logs</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
-                </react_native_1.View>
-                <react_native_1.View style={styles_1.default.dashboardModuleGrid}>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>{logTotal}</react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Total Logs</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#0D9488' }]}>
-                      {logInfos}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Info</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[
-                        styles_1.default.dashboardGridVal,
-                        logWarns > 0 && { color: AppColors_1.AppColors.warningIconGold },
-                    ]}>
-                      {logWarns}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Warnings</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[
-                        styles_1.default.dashboardGridVal,
-                        logErrors > 0 && { color: AppColors_1.AppColors.errorColor },
-                    ]}>
-                      {logErrors}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Errors</react_native_1.Text>
-                  </react_native_1.View>
-                </react_native_1.View>
-              </TouchableScale_1.default>)}
-
-            {insightsActiveSubTab === 'analytics' && tabVisibility?.analytics && (<TouchableScale_1.default style={styles_1.default.dashboardModuleCard} onPress={() => switchActiveTab('analytics')}>
-                <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
-                    <NetworkIcons_1.AnalyticsIcon color="#EA580C" size={18}/>
-                    <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
-                      Analytics Events
-                    </react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
-                </react_native_1.View>
-                <react_native_1.View style={styles_1.default.dashboardModuleGrid}>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>{analyticsTotal}</react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Total Events</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#EA580C' }]}>
-                      {uniqueEvents}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Unique Names</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>{screenViews}</react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Screen Views</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>
-                      {analyticsTotal > 0
-                        ? Math.round(analyticsTotal / Math.max(1, logs.length / 5))
-                        : 0}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Events Ratio</react_native_1.Text>
-                  </react_native_1.View>
-                </react_native_1.View>
-              </TouchableScale_1.default>)}
-
-            {insightsActiveSubTab === 'webview' && tabVisibility?.webview && (<TouchableScale_1.default style={styles_1.default.dashboardModuleCard} onPress={() => switchActiveTab('webview')}>
-                <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
-                    <NetworkIcons_1.GlobeIcon color="#2563EB" size={18}/>
-                    <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
-                      WebView Captures
-                    </react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
-                </react_native_1.View>
-                <react_native_1.View style={styles_1.default.dashboardModuleGrid}>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={styles_1.default.dashboardGridVal}>{webviewTotal}</react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>History Size</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#16A34A' }]}>
-                      Active
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Status</react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.View style={styles_1.default.dashboardGridItem}>
-                    <react_native_1.Text numberOfLines={1} style={styles_1.default.dashboardGridVal}>
-                      {webviewTotal > 0
-                        ? `${webViewNavHistory[0]?.title?.substring(0, 10) ?? ''}...`
-                        : '—'}
-                    </react_native_1.Text>
-                    <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Last URL</react_native_1.Text>
-                  </react_native_1.View>
-                </react_native_1.View>
-              </TouchableScale_1.default>)}
-
-            {insightsActiveSubTab === 'redux' && tabVisibility?.redux && (<TouchableScale_1.default style={styles_1.default.dashboardModuleCard} onPress={() => switchActiveTab('redux')}>
-                <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
-                    <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={18}/>
-                    <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
-                      Redux Store State
-                    </react_native_1.Text>
-                  </react_native_1.View>
-                  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
-                </react_native_1.View>
-                {reduxState ? (<react_native_1.View style={{ paddingHorizontal: 12, paddingBottom: 12, gap: 6 }}>
-                    <react_native_1.View style={{
-                            flexDirection: 'row',
-                            justifyContent: 'space-between',
-                            marginBottom: 4,
-                        }}>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 10,
-                            color: AppColors_1.AppColors.grayTextWeak,
-                            letterSpacing: 0.5,
-                        }}>
-                        REDUCER NAME
-                      </react_native_1.Text>
-                      <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 10,
-                            color: AppColors_1.AppColors.grayTextWeak,
-                            letterSpacing: 0.5,
-                        }}>
-                        SIZE / FIELDS
-                      </react_native_1.Text>
-                    </react_native_1.View>
-                    {Object.keys(reduxState).map(key => {
-                            const val = reduxState[key];
-                            const fieldsCount = typeof val === 'object' && val !== null
-                                ? Object.keys(val).length
-                                : 0;
-                            const sizeStr = (0, helpers_1.getSize)(val);
-                            return (<react_native_1.View key={key} style={{
-                                    flexDirection: 'row',
-                                    justifyContent: 'space-between',
-                                    alignItems: 'center',
-                                    paddingVertical: 2,
-                                }}>
-                          <react_native_1.Text style={{
-                                    fontFamily: AppFonts_1.AppFonts.interMedium,
-                                    fontSize: 12,
-                                    color: AppColors_1.AppColors.grayTextStrong,
-                                }}>
-                            {key}
-                          </react_native_1.Text>
-                          <react_native_1.Text style={{
-                                    fontFamily: AppFonts_1.AppFonts.interRegular,
-                                    fontSize: 11,
-                                    color: AppColors_1.AppColors.grayTextWeak,
-                                }}>
-                            {sizeStr} ({fieldsCount} fields)
-                          </react_native_1.Text>
-                        </react_native_1.View>);
-                        })}
-                  </react_native_1.View>) : (<react_native_1.View style={{ padding: 12, alignItems: 'center' }}>
-                    <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interRegular,
-                            fontSize: 12,
-                            color: AppColors_1.AppColors.grayTextWeak,
-                        }}>
-                      No connected Redux store.
-                    </react_native_1.Text>
-                  </react_native_1.View>)}
-              </TouchableScale_1.default>)}
-          </>);
-        })()}
-    </react_native_1.View>);
-};
-exports.default = InsightsDashboard;

package/dist/commonjs/components/Inspector/WebViewTab.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-declare const WebViewTab: () => React.JSX.Element;
-export default WebViewTab;