react-native-inapp-inspector 1.1.28 → 1.1.29

package/android/src/main/java/com/inappinspector/NetworkInspectorModule.java

@@ -1,8 +1,5 @@
 package com.inappinspector;
 
-import android.content.ClipData;
-import android.content.ClipboardManager;
-import android.content.Context;
 import android.os.Handler;
 import android.os.Looper;
 import android.util.Log;
@@ -31,7 +28,6 @@ public class NetworkInspectorModule extends ReactContextBaseJavaModule {
     public NetworkInspectorModule(ReactApplicationContext reactContext) {
         super(reactContext);
         this.reactContext = reactContext;
-        setupNativeCrashProtection();
     }
 
     @NonNull
@@ -41,55 +37,39 @@ public class NetworkInspectorModule extends ReactContextBaseJavaModule {
     }
 
     private void setupNativeCrashProtection() {
-        if (isProtectionEnabled) return;
-        isProtectionEnabled = true;
-
-        try {
-            defaultHandler = Thread.getDefaultUncaughtExceptionHandler();
-            Thread.setDefaultUncaughtExceptionHandler(new Thread.UncaughtExceptionHandler() {
-                @Override
-                public void uncaughtException(@NonNull Thread thread, @NonNull Throwable throwable) {
-                    try {
-                        StringWriter sw = new StringWriter();
-                        PrintWriter pw = new PrintWriter(sw);
-                        throwable.printStackTrace(pw);
-                        String stackTrace = sw.toString();
-                        String message = throwable.getMessage() != null ? throwable.getMessage() : throwable.toString();
-
-                        Log.e(TAG, "Intercepted Android Native Crash: " + message, throwable);
-
-                        sendCrashEventToJS(message, stackTrace, thread.getName());
-                    } catch (Exception e) {
-                        Log.e(TAG, "Failed to dispatch native crash event", e);
-                    }
-
-                    // Keep main looper processing to prevent instant process exit
-                    if (Looper.myLooper() != null) {
-                        while (true) {
-                            try {
-                                Looper.loop();
-                            } catch (Throwable inner) {
-                                Log.e(TAG, "Caught inner loop exception", inner);
-                            }
-                        }
-                    }
-                }
-            });
-        } catch (Exception e) {
-            Log.e(TAG, "Error installing uncaught exception handler", e);
+        if (isProtectionEnabled) {
+            return;
         }
+        defaultHandler = Thread.getDefaultUncaughtExceptionHandler();
+        Thread.setDefaultUncaughtExceptionHandler((thread, throwable) -> {
+            try {
+                handleNativeCrash(thread, throwable);
+            } catch (Exception e) {
+                Log.e(TAG, "Error in native crash handler", e);
+            } finally {
+                if (defaultHandler != null) {
+                    defaultHandler.uncaughtException(thread, throwable);
+                }
+            }
+        });
+        isProtectionEnabled = true;
+        Log.i(TAG, "Native crash protection enabled");
     }
 
-    private void sendCrashEventToJS(String message, String stackTrace, String threadName) {
+    private void handleNativeCrash(Thread thread, Throwable throwable) {
         try {
-            if (reactContext != null && reactContext.hasActiveReactInstance()) {
-                WritableMap params = Arguments.createMap();
-                params.putString("platform", "android");
-                params.putString("message", message);
-                params.putString("stack", stackTrace);
-                params.putString("thread", threadName);
-                params.putDouble("timestamp", System.currentTimeMillis());
-
+            StringWriter sw = new StringWriter();
+            PrintWriter pw = new PrintWriter(sw);
+            throwable.printStackTrace(pw);
+            String stackTrace = sw.toString();
+
+            WritableMap params = Arguments.createMap();
+            params.putString("error", throwable.getMessage() != null ? throwable.getMessage() : "Unknown native crash");
+            params.putString("name", throwable.getClass().getName());
+            params.putString("stack", stackTrace);
+            params.putDouble("timestamp", System.currentTimeMillis());
+
+            if (reactContext.hasActiveReactInstance()) {
                 reactContext
                         .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
                         .emit("onNativeCrash", params);
@@ -105,37 +85,6 @@ public class NetworkInspectorModule extends ReactContextBaseJavaModule {
         promise.resolve(true);
     }
 
-    @ReactMethod
-    public void copyToClipboard(String text, Promise promise) {
-        try {
-            Handler mainHandler = new Handler(Looper.getMainLooper());
-            mainHandler.post(() -> {
-                try {
-                    ClipboardManager clipboard = (ClipboardManager) reactContext.getSystemService(Context.CLIPBOARD_SERVICE);
-                    if (clipboard != null) {
-                        ClipData clip = ClipData.newPlainText("NetworkInspector", text != null ? text : "");
-                        clipboard.setPrimaryClip(clip);
-                        if (promise != null) {
-                            promise.resolve(true);
-                        }
-                        return;
-                    }
-                    if (promise != null) {
-                        promise.resolve(false);
-                    }
-                } catch (Exception e) {
-                    if (promise != null) {
-                        promise.reject("CLIPBOARD_ERROR", e.getMessage(), e);
-                    }
-                }
-            });
-        } catch (Exception e) {
-            if (promise != null) {
-                promise.reject("CLIPBOARD_ERROR", e.getMessage(), e);
-            }
-        }
-    }
-
     @ReactMethod
     public void addListener(String eventName) {
         // Required for RN built-in Event Emitter

package/dist/commonjs/components/AppHeaderLogo.js

@@ -40,13 +40,12 @@ exports.AppHeaderLogo = void 0;
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const BrandSquareIcon_1 = __importDefault(require("./BrandSquareIcon"));
-const AppColors_1 = require("../styles/AppColors");
 const AppHeaderLogo = ({ size = 46, customIcon, }) => {
     const [loadError, setLoadError] = (0, react_1.useState)(false);
-    // 1. If customIcon is explicitly provided, render it directly
+    // 1. If customIcon is explicitly provided, render it directly edge-to-edge
     if (customIcon) {
         return (<react_native_1.View style={[logoStyles.container, { width: size, height: size }]}>
-        <react_native_1.Image source={customIcon} style={{ width: size - 4, height: size - 4, borderRadius: 10 }} resizeMode="cover"/>
+        <react_native_1.Image source={customIcon} style={logoStyles.image} resizeMode="cover"/>
       </react_native_1.View>);
     }
     // 2. Dynamically query installed native app icon (AppIcon on iOS, ic_launcher on Android)
@@ -57,29 +56,27 @@ const AppHeaderLogo = ({ size = 46, customIcon, }) => {
             default: { uri: 'AppIcon' },
         });
         return (<react_native_1.View style={[logoStyles.container, { width: size, height: size }]}>
-        <react_native_1.Image source={nativeSource} style={{ width: size - 4, height: size - 4, borderRadius: 10 }} resizeMode="cover" onError={() => setLoadError(true)}/>
+        <react_native_1.Image source={nativeSource} style={logoStyles.image} resizeMode="cover" onError={() => setLoadError(true)}/>
       </react_native_1.View>);
     }
     // 3. Fallback: Inspector's Signature Owl Brand Logo
     return (<react_native_1.View style={[logoStyles.container, { width: size, height: size }]}>
-      <BrandSquareIcon_1.default size={size - 4}/>
+      <BrandSquareIcon_1.default size={size}/>
     </react_native_1.View>);
 };
 exports.AppHeaderLogo = AppHeaderLogo;
 const logoStyles = react_native_1.StyleSheet.create({
     container: {
+        borderRadius: 10,
+        overflow: 'hidden',
+        backgroundColor: 'transparent',
         alignItems: 'center',
         justifyContent: 'center',
-        borderRadius: 12,
-        backgroundColor: `${AppColors_1.AppColors.white}24`,
-        borderWidth: 1.5,
-        borderColor: `${AppColors_1.AppColors.white}4D`,
-        overflow: 'hidden',
-        shadowColor: AppColors_1.AppColors.primaryBlack,
-        shadowOffset: { width: 0, height: 2 },
-        shadowOpacity: 0.15,
-        shadowRadius: 4,
-        elevation: 3,
+    },
+    image: {
+        width: '100%',
+        height: '100%',
+        borderRadius: 10,
     },
 });
 exports.default = exports.AppHeaderLogo;

package/dist/commonjs/components/ConsoleLogCard.js

@@ -232,18 +232,34 @@ exports.ConsoleLogCard = react_1.default.memo(function ConsoleLogCard({ item, se
             <react_native_1.Text style={styles.footerText}>{(0, helpers_1.formatTime)(item.timestamp)}</react_native_1.Text>
             {parsedCaller && (<>
                 <react_native_1.View style={styles.footerDot}/>
-                <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4, maxWidth: 170 }}>
+                <react_native_1.Pressable onPress={e => {
+                e.stopPropagation?.();
+                (0, helpers_1.openInVSCode)(parsedCaller.rawFilePath ||
+                    parsedCaller.fullPath ||
+                    parsedCaller.fileName, parsedCaller.lineNumber, parsedCaller.columnNumber);
+            }} hitSlop={8} style={{
+                flexDirection: 'row',
+                alignItems: 'center',
+                gap: 4,
+                maxWidth: 185,
+                backgroundColor: `${AppColors_1.AppColors.sky600}10`,
+                borderColor: `${AppColors_1.AppColors.sky600}2B`,
+                borderWidth: 1,
+                borderRadius: 5,
+                paddingHorizontal: 5,
+                paddingVertical: 1.5,
+            }}>
                   {parsedCaller.fileExt && parsedCaller.fileExt !== 'other' && (<react_native_1.View style={{
                     backgroundColor: parsedCaller.fileExt === 'tsx' || parsedCaller.fileExt === 'ts'
-                        ? `${AppColors_1.AppColors.brandPurple}18`
-                        : `${AppColors_1.AppColors.teal600}18`,
+                        ? `${AppColors_1.AppColors.brandPurple}22`
+                        : `${AppColors_1.AppColors.teal600}22`,
                     borderRadius: 3,
                     paddingHorizontal: 3.5,
-                    paddingVertical: 1,
+                    paddingVertical: 0.5,
                 }}>
                       <react_native_1.Text style={{
                     fontFamily: AppFonts_1.AppFonts.interBold,
-                    fontSize: 8.5,
+                    fontSize: 8,
                     color: parsedCaller.fileExt === 'tsx' || parsedCaller.fileExt === 'ts'
                         ? AppColors_1.AppColors.brandPurple
                         : AppColors_1.AppColors.teal600,
@@ -251,11 +267,19 @@ exports.ConsoleLogCard = react_1.default.memo(function ConsoleLogCard({ item, se
                         {parsedCaller.fileExt.toUpperCase()}
                       </react_native_1.Text>
                     </react_native_1.View>)}
-                  <react_native_1.Text style={[styles.footerText, styles.footerCaller]} numberOfLines={1} ellipsizeMode="middle">
+                  <react_native_1.Text style={[
+                styles.footerText,
+                {
+                    fontFamily: AppFonts_1.AppFonts.interBold,
+                    color: AppColors_1.AppColors.sky600,
+                    fontSize: 9.5,
+                },
+            ]} numberOfLines={1} ellipsizeMode="middle">
                     {parsedCaller.fileName}
                     {parsedCaller.lineNumber ? `:${parsedCaller.lineNumber}` : ''}
                   </react_native_1.Text>
-                </react_native_1.View>
+                  <NetworkIcons_1.ExternalLinkIcon color={AppColors_1.AppColors.sky600} size={8.5}/>
+                </react_native_1.Pressable>
               </>)}
           </react_native_1.View>
 

package/dist/commonjs/components/CopyButton.js

@@ -37,6 +37,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
 // Components
 const TouchableScale_1 = __importDefault(require("./TouchableScale"));
 // Helpers
@@ -54,6 +55,19 @@ const CopyButton = react_1.default.memo(({ value, label, iconType = 'copy' }) =>
         setCopied(true);
         setTimeout(() => setCopied(false), 1200);
     }, [value, label]);
+    const handleLongPress = (0, react_1.useCallback)(() => {
+        try {
+            const resolvedValue = typeof value === 'function' ? value() : value;
+            const textToShare = typeof resolvedValue === 'string'
+                ? resolvedValue
+                : JSON.stringify(resolvedValue, null, 2);
+            react_native_1.Share.share({
+                message: textToShare,
+                title: label,
+            });
+        }
+        catch { }
+    }, [value, label]);
     const containerStyle = [
         styles_1.default.iconSquareBtn,
         copied && styles_1.default.iconSquareBtnSuccess,
@@ -63,7 +77,7 @@ const CopyButton = react_1.default.memo(({ value, label, iconType = 'copy' }) =>
         : iconType === 'fetch'
             ? NetworkIcons_1.FetchIcon
             : NetworkIcons_1.CopyIcon;
-    return (<TouchableScale_1.default onPress={handlePress} hitSlop={12} style={containerStyle}>
+    return (<TouchableScale_1.default onPress={handlePress} onLongPress={handleLongPress} hitSlop={12} style={containerStyle}>
       {copied ? (<NetworkIcons_1.CheckIcon color={AppColors_1.AppColors.greenColor} size={14}/>) : (<IconComponent color={AppColors_1.AppColors.grayTextWeak} size={14}/>)}
     </TouchableScale_1.default>);
 });

package/dist/commonjs/components/DomainHeader.js

@@ -40,6 +40,7 @@ const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 // Stylesheet
 const AppColors_1 = require("../styles/AppColors");
+const AppFonts_1 = require("../styles/AppFonts");
 // Helpers
 const helpers_1 = require("../helpers");
 // Assets
@@ -73,10 +74,61 @@ const DomainHeader = ({ pageName, color, stats, activeFilters, onToggleFilter, i
           <react_native_1.View style={[styles_1.default.domainIconWrap, { backgroundColor: `${color}18` }]}>
             <NetworkIcons_1.ScreenIcon color={color} size={14}/>
           </react_native_1.View>
-          <react_native_1.View style={{ flex: 1, justifyContent: 'center' }}>
-            <react_native_1.Text style={styles_1.default.domainTitleText} numberOfLines={1}>
-              {pageName}
-            </react_native_1.Text>
+          <react_native_1.View style={{ flex: 1, justifyContent: 'center', minWidth: 0 }}>
+            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
+              <react_native_1.Text style={[styles_1.default.domainTitleText, { flexShrink: 1 }]} numberOfLines={1}>
+                {pageName}
+              </react_native_1.Text>
+              {total > 0 && (<react_native_1.View style={{
+                flexDirection: 'row',
+                alignItems: 'center',
+                gap: 4,
+                backgroundColor: stats.failed > 0
+                    ? '#FEE2E2'
+                    : stats.loading > 0
+                        ? '#FEF3C7'
+                        : '#D1FAE5',
+                paddingHorizontal: 5,
+                paddingVertical: 1.5,
+                borderRadius: 4,
+            }}>
+                  <react_native_1.View style={{
+                width: 24,
+                height: 3.5,
+                borderRadius: 2,
+                backgroundColor: '#E5E7EB',
+                flexDirection: 'row',
+                overflow: 'hidden',
+            }}>
+                    {pctSuccess > 0 && (<react_native_1.View style={{
+                    width: `${pctSuccess}%`,
+                    height: '100%',
+                    backgroundColor: '#10B981',
+                }}/>)}
+                    {pctFailed > 0 && (<react_native_1.View style={{
+                    width: `${pctFailed}%`,
+                    height: '100%',
+                    backgroundColor: '#EF4444',
+                }}/>)}
+                    {pctLoading > 0 && (<react_native_1.View style={{
+                    width: `${pctLoading}%`,
+                    height: '100%',
+                    backgroundColor: '#F59E0B',
+                }}/>)}
+                  </react_native_1.View>
+                  <react_native_1.Text style={{
+                fontFamily: AppFonts_1.AppFonts.interBold,
+                fontSize: 8.5,
+                color: stats.failed > 0
+                    ? '#991B1B'
+                    : stats.loading > 0
+                        ? '#92400E'
+                        : '#065F46',
+            }}>
+                    {pctSuccess}%
+                  </react_native_1.Text>
+                </react_native_1.View>)}
+            </react_native_1.View>
             <react_native_1.Text style={styles_1.default.domainSummaryText} numberOfLines={1}>
               {(0, helpers_1.formatDateTime)(timestamp)}
             </react_native_1.Text>
@@ -132,30 +184,6 @@ const DomainHeader = ({ pageName, color, stats, activeFilters, onToggleFilter, i
         })}
         </react_native_1.View>
       </react_native_1.View>
-
-      {total > 0 && (<react_native_1.View style={styles_1.default.domainProgressTrack}>
-          {pctSuccess > 0 && (<react_native_1.View style={[
-                    styles_1.default.domainProgressSegment,
-                    {
-                        width: `${pctSuccess}%`,
-                        backgroundColor: AppColors_1.AppColors.greenColor,
-                    },
-                ]}/>)}
-          {pctFailed > 0 && (<react_native_1.View style={[
-                    styles_1.default.domainProgressSegment,
-                    {
-                        width: `${pctFailed}%`,
-                        backgroundColor: AppColors_1.AppColors.errorColor,
-                    },
-                ]}/>)}
-          {pctLoading > 0 && (<react_native_1.View style={[
-                    styles_1.default.domainProgressSegment,
-                    {
-                        width: `${pctLoading}%`,
-                        backgroundColor: AppColors_1.AppColors.darkOrange,
-                    },
-                ]}/>)}
-        </react_native_1.View>)}
     </react_native_1.Pressable>);
 };
 exports.default = DomainHeader;

package/dist/commonjs/components/HighlightText.js

@@ -8,6 +8,12 @@ const react_native_1 = require("react-native");
 // Helpers
 const helpers_1 = require("../helpers");
 const HighlightText = react_1.default.memo(function HighlightText({ text, search, style, highlightStyle, detectLinks, numberOfLines, ...rest }) {
+    // Optimization: For huge strings (> 20KB) with no active search, bypass all splitting/regex overhead
+    if (!text || (text.length > 20000 && !search && !detectLinks)) {
+        return (<react_native_1.Text style={style} numberOfLines={numberOfLines} {...rest}>
+        {text}
+      </react_native_1.Text>);
+    }
     // Regex to detect absolute URLs
     const URL_REGEX = /(https?:\/\/[^\s]+)/g;
     const renderNormalOrHighlighted = (subText, keyPrefix) => {
@@ -22,7 +28,7 @@ const HighlightText = react_1.default.memo(function HighlightText({ text, search
             </react_native_1.Text>) : (<react_native_1.Text key={i}>{part}</react_native_1.Text>))}
       </react_native_1.Text>);
     };
-    if (detectLinks && text) {
+    if (detectLinks && text && text.length < 20000) {
         const parts = text.split(URL_REGEX);
         return (<react_native_1.Text style={style} numberOfLines={numberOfLines} {...rest}>
         {parts.map((part, i) => {

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

@@ -337,41 +337,55 @@ const AnalyticsHeader = react_1.default.memo(() => {
           </react_native_1.View>
         </react_native_1.View>
 
-        {/* ── High Precision SVG Spline Area Graph ── */}
+        {/* ── Crashlytics-Style Multi-Bar Histogram with Trendline Overlay ── */}
         <react_native_1.View style={{ height: chartHeight, position: 'relative' }}>
           <react_native_svg_1.default width="100%" height={chartHeight} viewBox={`0 0 ${svgWidth} ${chartHeight}`}>
             <react_native_svg_1.Defs>
-              <react_native_svg_1.LinearGradient id="telemetryAreaGrad" x1="0" y1="0" x2="0" y2="1">
-                <react_native_svg_1.Stop offset="0%" stopColor={AppColors_1.AppColors.brandPurple} stopOpacity="0.4"/>
-                <react_native_svg_1.Stop offset="80%" stopColor={AppColors_1.AppColors.brandPurple} stopOpacity="0.05"/>
-                <react_native_svg_1.Stop offset="100%" stopColor={AppColors_1.AppColors.brandPurple} stopOpacity="0.0"/>
+              <react_native_svg_1.LinearGradient id="crashlyticsBarGrad" x1="0" y1="0" x2="0" y2="1">
+                <react_native_svg_1.Stop offset="0%" stopColor="#8B5CF6" stopOpacity="0.9"/>
+                <react_native_svg_1.Stop offset="100%" stopColor="#6366F1" stopOpacity="0.6"/>
+              </react_native_svg_1.LinearGradient>
+              <react_native_svg_1.LinearGradient id="crashlyticsAreaGrad" x1="0" y1="0" x2="0" y2="1">
+                <react_native_svg_1.Stop offset="0%" stopColor="#8B5CF6" stopOpacity="0.25"/>
+                <react_native_svg_1.Stop offset="80%" stopColor="#8B5CF6" stopOpacity="0.04"/>
+                <react_native_svg_1.Stop offset="100%" stopColor="#8B5CF6" stopOpacity="0.0"/>
               </react_native_svg_1.LinearGradient>
             </react_native_svg_1.Defs>
 
-            {/* Baseline & Grid lines */}
-            <react_native_svg_1.Line x1="8" y1={chartHeight - 6} x2={svgWidth - 8} y2={chartHeight - 6} stroke={AppColors_1.AppColors.dividerColor} strokeWidth="1"/>
-            <react_native_svg_1.Line x1="8" y1={chartHeight / 2} x2={svgWidth - 8} y2={chartHeight / 2} stroke={AppColors_1.AppColors.dividerColor} strokeWidth="0.8" strokeDasharray="3,3"/>
-
-            {/* Glowing Area Fill */}
-            <react_native_svg_1.Path d={histogramData.areaPath} fill="url(#telemetryAreaGrad)"/>
+            {/* Subtle Grid Guidelines */}
+            <react_native_svg_1.Line x1="6" y1={chartHeight - 6} x2={svgWidth - 6} y2={chartHeight - 6} stroke="#E2E8F0" strokeWidth="1"/>
+            <react_native_svg_1.Line x1="6" y1={chartHeight / 2} x2={svgWidth - 6} y2={chartHeight / 2} stroke="#F1F5F9" strokeWidth="1" strokeDasharray="4,4"/>
 
-            {/* Smooth Spline Wave Stroke */}
-            <react_native_svg_1.Path d={histogramData.linePath} fill="none" stroke={AppColors_1.AppColors.brandPurple} strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round"/>
+            {/* Glowing Area Underlay */}
+            <react_native_svg_1.Path d={histogramData.areaPath} fill="url(#crashlyticsAreaGrad)"/>
 
-            {/* Data Points & Active Bucket Indicators */}
+            {/* Vertical Crashlytics Histogram Bars */}
             {histogramData.buckets.map((b, idx) => {
             const isSelected = selectedBucketIdx === idx;
-            return (<react_native_svg_1.G key={b.index}>
-                  {isSelected && (<react_native_svg_1.Line x1={b.x} y1={4} x2={b.x} y2={chartHeight - 6} stroke={AppColors_1.AppColors.brandPurple} strokeWidth="1.2" strokeDasharray="2,2"/>)}
+            const barWidth = 10;
+            const barX = b.x - barWidth / 2;
+            const barHeight = Math.max(3, chartHeight - 8 - b.y);
+            const barY = chartHeight - 8 - barHeight;
+            return (<react_native_svg_1.G key={`bar-${b.index}`}>
+                  {/* Background slot */}
+                  <react_native_svg_1.Rect x={barX} y={6} width={barWidth} height={chartHeight - 14} rx={3} fill={isSelected ? '#EDE9FE' : '#F8FAFC'}/>
 
-                  {b.total > 0 && (<react_native_svg_1.Circle cx={b.x} cy={b.y} r={isSelected ? 4.5 : 2.8} fill={isSelected ? AppColors_1.AppColors.brandPurple : AppColors_1.AppColors.white} stroke={AppColors_1.AppColors.brandPurple} strokeWidth={isSelected ? 2 : 1.5}/>)}
+                  {/* Active Event Bar */}
+                  {b.total > 0 && (<react_native_svg_1.Rect x={barX} y={barY} width={barWidth} height={barHeight} rx={3} fill="url(#crashlyticsBarGrad)"/>)}
 
-                  {b.isLatest && (<react_native_svg_1.G>
-                      <react_native_svg_1.Circle cx={b.x} cy={b.y} r="6.5" fill={AppColors_1.AppColors.brandPurple} opacity="0.22"/>
-                      <react_native_svg_1.Circle cx={b.x} cy={b.y} r="3" fill={AppColors_1.AppColors.brandPurple}/>
-                    </react_native_svg_1.G>)}
+                  {/* Selected Cursor Line */}
+                  {isSelected && (<react_native_svg_1.Line x1={b.x} y1={4} x2={b.x} y2={chartHeight - 6} stroke="#8B5CF6" strokeWidth="1.5" strokeDasharray="2,2"/>)}
                 </react_native_svg_1.G>);
         })}
+
+            {/* Crashlytics Apex Trendline */}
+            <react_native_svg_1.Path d={histogramData.linePath} fill="none" stroke="#8B5CF6" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+
+            {/* Pulsing Dot on Current Active Time Bucket */}
+            {histogramData.buckets.length > 0 && (<react_native_svg_1.G>
+                <react_native_svg_1.Circle cx={histogramData.buckets[histogramData.buckets.length - 1].x} cy={histogramData.buckets[histogramData.buckets.length - 1].y} r="5.5" fill="#8B5CF6" opacity="0.25"/>
+                <react_native_svg_1.Circle cx={histogramData.buckets[histogramData.buckets.length - 1].x} cy={histogramData.buckets[histogramData.buckets.length - 1].y} r="3" fill="#7C3AED"/>
+              </react_native_svg_1.G>)}
           </react_native_svg_1.default>
 
           {/* Invisible Touch Columns for Interactive Bucket Selection */}

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

@@ -146,9 +146,9 @@ const InspectorHeader = react_1.default.memo(() => {
                 flex: 1,
             }}>
                 <AppHeaderLogo_1.default size={46} customIcon={appIcon}/>
-                <react_native_1.View style={{ gap: 2, flex: 1 }}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, flexWrap: 'wrap' }}>
-                    <react_native_1.Text style={[styles_1.default.headerTitle]} numberOfLines={1}>
+                <react_native_1.View style={{ gap: 2, flex: 1, minWidth: 0 }}>
+                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6, flexWrap: 'nowrap', minWidth: 0 }}>
+                    <react_native_1.Text style={[styles_1.default.headerTitle, { flexShrink: 1 }]} numberOfLines={1}>
                       {(0, helpers_1.getAppName)()}
                     </react_native_1.Text>
                     <react_native_1.View style={[
@@ -372,6 +372,20 @@ const InspectorHeader = react_1.default.memo(() => {
                     : '—'}
                       </react_native_1.Text>
                     </react_native_1.View>
+                    {selected.response != null && (<react_native_1.View style={{
+                        flexDirection: 'row',
+                        alignItems: 'center',
+                        gap: 4,
+                        paddingHorizontal: 8,
+                        paddingVertical: 3,
+                        borderRadius: 20,
+                        backgroundColor: `${AppColors_1.AppColors.white}29`,
+                    }}>
+                        <NetworkIcons_1.SizeIcon color={AppColors_1.AppColors.white} size={11}/>
+                        <react_native_1.Text style={styles_1.default.headerSubTitle}>
+                          {(0, helpers_1.getSize)(selected.response)}
+                        </react_native_1.Text>
+                      </react_native_1.View>)}
                   </react_native_1.View>
                 </react_native_1.View>) : activeTab === 'analytics' && selectedEvent != null ? (<react_native_1.View style={styles_1.default.headerDetailCenter}>
                   <react_native_1.View style={styles_1.default.headerDetailRow}>

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

@@ -307,16 +307,18 @@ const LogDetail = react_1.default.memo(() => {
             : originFrame?.fileName || t('console.consoleLog')}
               </react_native_1.Text>
 
-              {originFrame?.fileName && (<react_native_1.View style={[
+              {originFrame?.fileName && (<react_native_1.Pressable onPress={() => (0, helpers_1.openInVSCode)(originFrame.rawFilePath ||
+                originFrame.fullPath ||
+                originFrame.fileName, originFrame.lineNumber, originFrame.columnNumber)} hitSlop={8} style={[
                 styles_1.default.metaChip,
                 {
-                    backgroundColor: `${AppColors_1.AppColors.brandPurple}12`,
-                    borderColor: `${AppColors_1.AppColors.brandPurple}30`,
+                    backgroundColor: `${AppColors_1.AppColors.brandPurple}15`,
+                    borderColor: `${AppColors_1.AppColors.brandPurple}40`,
                     paddingHorizontal: 7,
                     paddingVertical: 2,
                 },
             ]}>
-                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 3, flexWrap: 'wrap', flexShrink: 1 }}>
+                  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4, flexShrink: 1 }}>
                     <NetworkIcons_1.DocIcon color={AppColors_1.AppColors.brandPurple} size={10}/>
                     <react_native_1.Text style={[
                 styles_1.default.metaChipText,
@@ -326,8 +328,9 @@ const LogDetail = react_1.default.memo(() => {
                       {originFrame.lineNumber ? `:${originFrame.lineNumber}` : ''}
                       {originFrame.columnNumber ? `:${originFrame.columnNumber}` : ''}
                     </react_native_1.Text>
+                    <NetworkIcons_1.ExternalLinkIcon color={AppColors_1.AppColors.brandPurple} size={9}/>
                   </react_native_1.View>
-                </react_native_1.View>)}
+                </react_native_1.Pressable>)}
             </react_native_1.View>
 
             {/* Enhanced metadata metrics row */}

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

@@ -56,6 +56,7 @@ const PerformanceTab_1 = __importDefault(require("./PerformanceTab"));
 const CrashTab_1 = __importDefault(require("./CrashTab"));
 const CrashDetail_1 = __importDefault(require("./CrashDetail"));
 const SettingsPanel_1 = __importDefault(require("./SettingsPanel"));
+const Toast_1 = __importDefault(require("../Toast"));
 const styles_1 = __importDefault(require("../../styles"));
 const AppColors_1 = require("../../styles/AppColors");
 const NavigationTracker_1 = __importDefault(require("./NavigationTracker"));
@@ -153,6 +154,9 @@ const MainScreen = () => {
                 ]}>
                   <SettingsPanel_1.default />
                 </react_native_1.View>)}
+
+              {/* Bottom floating toast notification */}
+              <Toast_1.default />
             </react_native_1.View>
           </react_native_1.View>
         </ErrorBoundary_1.default>)}