react-native-inapp-inspector 2.3.19 → 2.3.21

package/dist/commonjs/components/LogCard.js

@@ -1,622 +1,112 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const react_native_svg_1 = __importStar(require("react-native-svg"));
-const AppColors_1 = require("../styles/AppColors");
-const constants_1 = require("../constants");
-const helpers_1 = require("../helpers");
-const NetworkIcons_1 = require("./NetworkIcons");
-const AppFonts_1 = require("../styles/AppFonts");
-const HighlightText_1 = __importDefault(require("./HighlightText"));
-const TouchableScale_1 = __importDefault(require("./TouchableScale"));
-const i18n_1 = require("../i18n");
-const LogCard = react_1.default.memo(function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, }) {
-    const { t } = (0, i18n_1.useTranslation)();
-    const methodColor = constants_1.METHOD_COLORS[item.method] ?? constants_1.METHOD_COLORS.ALL;
-    const urlParsed = (0, react_1.useMemo)(() => {
-        try {
-            const u = new URL(item.url);
-            const host = u.host;
-            const path = u.pathname + (u.search ? u.search : '');
-            const isHttps = u.protocol === 'https:';
-            return { host, path: path || '/', isHttps };
-        }
-        catch {
-            const isHttps = item.url.toLowerCase().startsWith('https:');
-            const path = (0, helpers_1.getPath)(item.url);
-            const host = (0, helpers_1.getBaseUrl)(item.url).replace(/^https?:\/\//, '');
-            return { host, path: path || item.url, isHttps };
-        }
-    }, [item.url]);
-    const handleOpenUrl = (e) => {
-        e?.stopPropagation?.();
-        react_native_1.Alert.alert(t('common.openInBrowser') || 'Open in Browser', `${t('common.openInBrowserPrompt') || 'Are you sure you want to open this URL in your external browser?'}\n\n${item.url}`, [
-            { text: t('common.cancel') || 'Cancel', style: 'cancel' },
-            {
-                text: t('common.open') || 'Open',
-                onPress: () => {
-                    react_native_1.Linking.canOpenURL(item.url)
-                        .then(supported => {
-                        if (supported) {
-                            react_native_1.Linking.openURL(item.url);
-                        }
-                        else {
-                            react_native_1.Linking.openURL(item.url).catch(() => { });
-                        }
-                    })
-                        .catch(() => { });
-                },
-            },
-        ]);
-    };
-    const isFailed = item.status === 0 || (item.status != null && item.status >= 400);
-    const isLoading = item.status == null;
-    const statusColor = (0, helpers_1.getStatusColor)(item.status);
-    const durationColor = (0, helpers_1.getDurationColor)(item.duration);
-    const cardStatusColor = isLoading
-        ? AppColors_1.AppColors.darkOrange
-        : isFailed
-            ? AppColors_1.AppColors.errorColor
-            : AppColors_1.AppColors.greenColor;
-    const shimmerOpacity = (0, react_1.useRef)(new react_native_1.Animated.Value(isNew ? 0.35 : 0)).current;
-    (0, react_1.useEffect)(() => {
-        if (isNew) {
-            react_native_1.Animated.timing(shimmerOpacity, {
-                toValue: 0,
-                duration: 1200,
-                useNativeDriver: false,
-            }).start();
-        }
-    }, [isNew]);
-    const getStatusText = () => {
-        if (isLoading)
-            return '...';
-        if (item.status === 0 || item.status == null) {
-            return t('network.statusFailed') || 'FAILED';
-        }
-        const num = typeof item.status === 'number' ? item.status : parseInt(String(item.status || 0), 10);
-        if (num === 200)
-            return '200 OK';
-        if (num === 201)
-            return '201 Created';
-        if (num === 204)
-            return '204 No Content';
-        if (num === 304)
-            return '304 Not Modified';
-        if (num === 400)
-            return '400 Bad Req';
-        if (num === 401)
-            return '401 Unauth';
-        if (num === 403)
-            return '403 Forbidden';
-        if (num === 404)
-            return '404 Not Found';
-        if (num === 500)
-            return '500 Error';
-        return String(item.status);
-    };
-    const renderStatusIcon = () => {
-        if (isLoading) {
-            return <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.darkOrange} size={10}/>;
-        }
-        const num = typeof item.status === 'number' ? item.status : parseInt(String(item.status || 0), 10);
-        if (num >= 200 && num < 300) {
-            return <NetworkIcons_1.CircleCheckIcon color={AppColors_1.AppColors.greenColor} size={10}/>;
-        }
-        if (num >= 300 && num < 400) {
-            return <NetworkIcons_1.RepeatIcon color={AppColors_1.AppColors.amber700} size={10}/>;
-        }
-        if (num >= 400 && num < 500) {
-            return <NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.darkOrange} size={10}/>;
-        }
-        return <NetworkIcons_1.CircleXIcon color={AppColors_1.AppColors.errorColor} size={10}/>;
-    };
-    const triggeredAt = (0, helpers_1.formatDateTime)(item.startTime);
-    const isJson = item.url.split('?')[0].toLowerCase().endsWith('.json');
-    return (<react_native_1.View style={styles.container}>
-      <TouchableScale_1.default onPress={onPress} style={[
-            styles.card,
-            {
-                borderLeftWidth: 3.5,
-                borderLeftColor: cardStatusColor,
-                backgroundColor: isFailed ? '#FFF8F8' : AppColors_1.AppColors.white,
-            },
-        ]}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(t,e,a,o){o===void 0&&(o=a);var l=Object.getOwnPropertyDescriptor(e,a);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[a]}}),Object.defineProperty(t,o,l)}):(function(t,e,a,o){o===void 0&&(o=a),t[o]=e[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}):function(t,e){t.default=e}),__importStar=this&&this.__importStar||(function(){var t=function(e){return t=Object.getOwnPropertyNames||function(a){var o=[];for(var l in a)Object.prototype.hasOwnProperty.call(a,l)&&(o[o.length]=l);return o},t(e)};return function(e){if(e&&e.__esModule)return e;var a={};if(e!=null)for(var o=t(e),l=0;l<o.length;l++)o[l]!=="default"&&__createBinding(a,e,o[l]);return __setModuleDefault(a,e),a}})(),__importDefault=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),react_native_svg_1=__importStar(require("react-native-svg")),AppColors_1=require("../styles/AppColors"),constants_1=require("../constants"),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),AppFonts_1=require("../styles/AppFonts"),HighlightText_1=__importDefault(require("./HighlightText")),TouchableScale_1=__importDefault(require("./TouchableScale")),i18n_1=require("../i18n"),LogCard=react_1.default.memo(function({item:e,onPress:a,timelineMinStart:o,timelineTotalRange:l,isNew:u,isSelected:C,onToggleSelect:b,searchStr:x}){const{t:c}=(0,i18n_1.useTranslation)(),h=constants_1.METHOD_COLORS[e.method]??constants_1.METHOD_COLORS.ALL,n=(0,react_1.useMemo)(()=>{try{const r=new URL(e.url),p=r.host,w=r.pathname+(r.search?r.search:""),B=r.protocol==="https:";return{host:p,path:w||"/",isHttps:B}}catch{const r=e.url.toLowerCase().startsWith("https:"),p=(0,helpers_1.getPath)(e.url);return{host:(0,helpers_1.getBaseUrl)(e.url).replace(/^https?:\/\//,""),path:p||e.url,isHttps:r}}},[e.url]),f=(0,react_1.useMemo)(()=>{if(!e.caller||e.caller==="Unknown")return null;const r=e.caller.split(/[\/\\]/);return(r[r.length-1]||e.caller).replace(/\?.*$/,"").replace(/^[a-zA-Z0-9_$]+@/,"")},[e.caller]),y=r=>{r?.stopPropagation?.(),react_native_1.Alert.alert(c("common.openInBrowser")||"Open in Browser",`${c("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
+
+${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.open")||"Open",onPress:()=>{react_native_1.Linking.canOpenURL(e.url).then(p=>{p?react_native_1.Linking.openURL(e.url):react_native_1.Linking.openURL(e.url).catch(()=>{})}).catch(()=>{})}}])},i=e.status===0||e.status!=null&&e.status>=400,s=e.status==null,g=(0,helpers_1.getStatusColor)(e.status),d=(0,helpers_1.getDurationColor)(e.duration),A=s?AppColors_1.AppColors.darkOrange:i?AppColors_1.AppColors.errorColor:AppColors_1.AppColors.greenColor,_=(0,react_1.useRef)(new react_native_1.Animated.Value(u?.35:0)).current;(0,react_1.useEffect)(()=>{u&&react_native_1.Animated.timing(_,{toValue:0,duration:1200,useNativeDriver:!1}).start()},[u]);const T=()=>{if(s)return"...";if(e.status===0||e.status==null)return c("network.statusFailed")||"FAILED";const r=typeof e.status=="number"?e.status:parseInt(String(e.status||0),10);return r===200?"200 OK":r===201?"201 Created":r===204?"204 No Content":r===304?"304 Not Modified":r===400?"400 Bad Req":r===401?"401 Unauth":r===403?"403 Forbidden":r===404?"404 Not Found":r===500?"500 Error":String(e.status)},v=()=>{if(s)return<NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.darkOrange}size={10}/>;const r=typeof e.status=="number"?e.status:parseInt(String(e.status||0),10);return r>=200&&r<300?<NetworkIcons_1.CircleCheckIcon color={AppColors_1.AppColors.greenColor}size={10}/>:r>=300&&r<400?<NetworkIcons_1.RepeatIcon color={AppColors_1.AppColors.amber700}size={10}/>:r>=400&&r<500?<NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.darkOrange}size={10}/>:<NetworkIcons_1.CircleXIcon color={AppColors_1.AppColors.errorColor}size={10}/>},k=(0,helpers_1.formatDateTime)(e.startTime),V=e.url.split("?")[0].toLowerCase().endsWith(".json");return<react_native_1.View style={styles.container}>
+      <TouchableScale_1.default onPress={a}style={[styles.card,{borderLeftWidth:3.5,borderLeftColor:A,backgroundColor:i?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white}]}>
         <react_native_1.View style={styles.cardBody}>
           
           <react_native_1.View style={styles.cardHeaderRow}>
             <react_native_1.View style={styles.cardHeaderLeft}>
-              <react_native_1.Pressable onPress={() => onToggleSelect(item.id)} hitSlop={12} style={[
-            styles.smallCheckbox,
-            isSelected && styles.smallCheckboxChecked,
-        ]}>
-                {isSelected && (<react_native_svg_1.default width={9} height={9} viewBox="0 0 24 24" fill="none">
-                    <react_native_svg_1.Path d="M20 6L9 17l-5-5" stroke={AppColors_1.AppColors.white} strokeWidth="4" strokeLinecap="round" strokeLinejoin="round"/>
-                  </react_native_svg_1.default>)}
+              <react_native_1.Pressable onPress={()=>b(e.id)}hitSlop={12}style={[styles.smallCheckbox,C&&styles.smallCheckboxChecked]}>
+                {C&&<react_native_svg_1.default width={9}height={9}viewBox="0 0 24 24"fill="none">
+                    <react_native_svg_1.Path d="M20 6L9 17l-5-5"stroke={AppColors_1.AppColors.white}strokeWidth="4"strokeLinecap="round"strokeLinejoin="round"/>
+                  </react_native_svg_1.default>}
               </react_native_1.Pressable>
 
-              <react_native_1.Text style={styles.serialNumber}>#{item.id + 1}</react_native_1.Text>
+              <react_native_1.Text style={styles.serialNumber}>#{e.id+1}</react_native_1.Text>
 
-              <react_native_1.View style={[styles.methodBadge, { backgroundColor: methodColor }]}>
+              <react_native_1.View style={[styles.methodBadge,{backgroundColor:h}]}>
                 <react_native_1.Text style={styles.methodBadgeText}>
-                  {item.method}
+                  {e.method}
                 </react_native_1.Text>
               </react_native_1.View>
 
-              {item.client && (<react_native_1.View style={[
-                styles.chip,
-                {
-                    backgroundColor: item.client === 'axios'
-                        ? `${AppColors_1.AppColors.purple}14`
-                        : item.client === 'apollo' || item.client === 'graphql'
-                            ? `${AppColors_1.AppColors.pink500}14`
-                            : item.client === 'xhr'
-                                ? `${AppColors_1.AppColors.amber500}14`
-                                : `${AppColors_1.AppColors.sky500}14`,
-                    borderColor: item.client === 'axios'
-                        ? `${AppColors_1.AppColors.purple}30`
-                        : item.client === 'apollo' || item.client === 'graphql'
-                            ? `${AppColors_1.AppColors.pink500}30`
-                            : item.client === 'xhr'
-                                ? `${AppColors_1.AppColors.amber500}30`
-                                : `${AppColors_1.AppColors.sky500}30`,
-                },
-            ]}>
-                  <react_native_1.Text style={[
-                styles.chipText,
-                {
-                    color: item.client === 'axios'
-                        ? AppColors_1.AppColors.purple
-                        : item.client === 'apollo' || item.client === 'graphql'
-                            ? AppColors_1.AppColors.pink500
-                            : item.client === 'xhr'
-                                ? AppColors_1.AppColors.amber700
-                                : AppColors_1.AppColors.sky600,
-                },
-            ]}>
-                    {item.client.toUpperCase()}
+              {e.client&&<react_native_1.View style={[styles.chip,{backgroundColor:e.client==="axios"?`${AppColors_1.AppColors.purple}14`:e.client==="apollo"||e.client==="graphql"?`${AppColors_1.AppColors.pink500}14`:e.client==="xhr"?`${AppColors_1.AppColors.amber500}14`:`${AppColors_1.AppColors.sky500}14`,borderColor:e.client==="axios"?`${AppColors_1.AppColors.purple}30`:e.client==="apollo"||e.client==="graphql"?`${AppColors_1.AppColors.pink500}30`:e.client==="xhr"?`${AppColors_1.AppColors.amber500}30`:`${AppColors_1.AppColors.sky500}30`}]}>
+                  <react_native_1.Text style={[styles.chipText,{color:e.client==="axios"?AppColors_1.AppColors.purple:e.client==="apollo"||e.client==="graphql"?AppColors_1.AppColors.pink500:e.client==="xhr"?AppColors_1.AppColors.amber700:AppColors_1.AppColors.sky600}]}>
+                    {e.client.toUpperCase()}
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
 
               
-              {(item.url.toLowerCase().includes('graphql') ||
-            item.client === 'apollo' ||
-            item.client === 'graphql') && (<react_native_1.View style={[
-                styles.chip,
-                {
-                    backgroundColor: AppColors_1.AppColors.roseBg,
-                    borderColor: AppColors_1.AppColors.roseBorder,
-                },
-            ]}>
-                  <react_native_1.Text style={[
-                styles.chipText,
-                { color: AppColors_1.AppColors.pink600 },
-            ]}>
+              {(e.url.toLowerCase().includes("graphql")||e.client==="apollo"||e.client==="graphql")&&<react_native_1.View style={[styles.chip,{backgroundColor:AppColors_1.AppColors.roseBg,borderColor:AppColors_1.AppColors.roseBorder}]}>
+                  <react_native_1.Text style={[styles.chipText,{color:AppColors_1.AppColors.pink600}]}>
                     GQL
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
             </react_native_1.View>
 
-            <react_native_1.View style={[
-            styles.statusPill,
-            {
-                backgroundColor: isFailed
-                    ? `${AppColors_1.AppColors.errorColor}14`
-                    : isLoading
-                        ? `${AppColors_1.AppColors.darkOrange}14`
-                        : `${statusColor}14`,
-                borderColor: isFailed
-                    ? `${AppColors_1.AppColors.errorColor}33`
-                    : isLoading
-                        ? `${AppColors_1.AppColors.darkOrange}33`
-                        : `${statusColor}33`,
-            },
-        ]}>
-              {renderStatusIcon()}
-              <react_native_1.Text style={[
-            styles.statusPillText,
-            {
-                color: isFailed
-                    ? AppColors_1.AppColors.errorColor
-                    : isLoading
-                        ? AppColors_1.AppColors.darkOrange
-                        : statusColor,
-            },
-        ]}>
-                {getStatusText()}
+            <react_native_1.View style={[styles.statusPill,{backgroundColor:i?`${AppColors_1.AppColors.errorColor}14`:s?`${AppColors_1.AppColors.darkOrange}14`:`${g}14`,borderColor:i?`${AppColors_1.AppColors.errorColor}33`:s?`${AppColors_1.AppColors.darkOrange}33`:`${g}33`}]}>
+              {v()}
+              <react_native_1.Text style={[styles.statusPillText,{color:i?AppColors_1.AppColors.errorColor:s?AppColors_1.AppColors.darkOrange:g}]}>
+                {T()}
               </react_native_1.Text>
             </react_native_1.View>
           </react_native_1.View>
 
           
-          <react_native_1.Pressable onPress={handleOpenUrl} hitSlop={6} style={styles.urlBox}>
+          <react_native_1.Pressable onPress={y}hitSlop={6}style={styles.urlBox}>
             <react_native_1.View style={styles.urlMainRow}>
-              <HighlightText_1.default text={urlParsed.path} search={searchStr} style={styles.pathText} highlightStyle={styles.highlight} numberOfLines={2} ellipsizeMode="middle"/>
+              <HighlightText_1.default text={n.path}search={x}style={styles.pathText}highlightStyle={styles.highlight}numberOfLines={2}ellipsizeMode="middle"/>
               <react_native_1.View style={styles.urlBadgeRow}>
-                {isJson && (<react_native_1.View style={styles.jsonBadge}>
+                {V&&<react_native_1.View style={styles.jsonBadge}>
                     <react_native_1.Text style={styles.jsonBadgeText}>.json</react_native_1.Text>
-                  </react_native_1.View>)}
-                {item.duplicateCount != null && item.duplicateCount > 1 && (<react_native_1.View style={styles.dupBadge}>
-                    <react_native_1.Text style={styles.dupBadgeText}>×{item.duplicateCount}</react_native_1.Text>
-                  </react_native_1.View>)}
+                  </react_native_1.View>}
+                {e.duplicateCount!=null&&e.duplicateCount>1&&<react_native_1.View style={styles.dupBadge}>
+                    <react_native_1.Text style={styles.dupBadgeText}>×{e.duplicateCount}</react_native_1.Text>
+                  </react_native_1.View>}
               </react_native_1.View>
             </react_native_1.View>
 
-            {urlParsed.host ? (<react_native_1.View style={styles.hostRow}>
-                <react_native_1.View style={[
-                styles.protoBadge,
-                {
-                    backgroundColor: urlParsed.isHttps
-                        ? `${AppColors_1.AppColors.emerald600}12`
-                        : `${AppColors_1.AppColors.amber600}12`,
-                    borderColor: urlParsed.isHttps
-                        ? `${AppColors_1.AppColors.emerald600}2B`
-                        : `${AppColors_1.AppColors.amber600}2B`,
-                },
-            ]}>
-                  <react_native_1.Text style={[
-                styles.protoBadgeText,
-                {
-                    color: urlParsed.isHttps
-                        ? AppColors_1.AppColors.emerald600
-                        : AppColors_1.AppColors.amber700,
-                },
-            ]}>
-                    {urlParsed.isHttps ? 'HTTPS' : 'HTTP'}
+            {n.host?<react_native_1.View style={styles.hostRow}>
+                <react_native_1.View style={[styles.protoBadge,{backgroundColor:n.isHttps?`${AppColors_1.AppColors.emerald600}12`:`${AppColors_1.AppColors.amber600}12`,borderColor:n.isHttps?`${AppColors_1.AppColors.emerald600}2B`:`${AppColors_1.AppColors.amber600}2B`}]}>
+                  <react_native_1.Text style={[styles.protoBadgeText,{color:n.isHttps?AppColors_1.AppColors.emerald600:AppColors_1.AppColors.amber700}]}>
+                    {n.isHttps?"HTTPS":"HTTP"}
                   </react_native_1.Text>
                 </react_native_1.View>
-                <react_native_1.Text style={styles.hostText} numberOfLines={1} ellipsizeMode="tail">
-                  {urlParsed.host}
+                <react_native_1.Text style={styles.hostText}numberOfLines={1}ellipsizeMode="tail">
+                  {n.host}
                 </react_native_1.Text>
-              </react_native_1.View>) : null}
+              </react_native_1.View>:null}
           </react_native_1.Pressable>
 
           
           <react_native_1.View style={styles.cardFooterRow}>
             <react_native_1.View style={styles.footerLeft}>
               <react_native_1.View style={styles.cardDateRow}>
-                <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak} size={10}/>
-                <react_native_1.Text style={styles.cardDateText}>{triggeredAt}</react_native_1.Text>
+                <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak}size={10}/>
+                <react_native_1.Text style={styles.cardDateText}>{k}</react_native_1.Text>
               </react_native_1.View>
 
-              {item.caller && item.caller !== 'Unknown' && (<react_native_1.View style={styles.callerChip}>
-                  <NetworkIcons_1.PinIcon color={AppColors_1.AppColors.sky600} size={8.5}/>
-                  <react_native_1.Text style={styles.callerChipText} numberOfLines={1} ellipsizeMode="middle">
-                    {item.caller}
+              {f&&<react_native_1.View style={styles.callerChip}>
+                  <NetworkIcons_1.PinIcon color={AppColors_1.AppColors.sky600}size={8.5}/>
+                  <react_native_1.Text style={styles.callerChipText}numberOfLines={1}ellipsizeMode="middle">
+                    {f}
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
             </react_native_1.View>
 
             <react_native_1.View style={styles.footerRight}>
-              {item.response != null && (<react_native_1.View style={styles.metaStatChip}>
-                  <NetworkIcons_1.SizeIcon color={AppColors_1.AppColors.purple} size={9}/>
+              {e.response!=null&&<react_native_1.View style={styles.metaStatChip}>
+                  <NetworkIcons_1.SizeIcon color={AppColors_1.AppColors.purple}size={9}/>
                   <react_native_1.Text style={styles.metaStatText}>
-                    {(0, helpers_1.getSize)(item.response)}
+                    {(0,helpers_1.getSize)(e.response)}
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
 
-              {item.duration != null && !isFailed && (<react_native_1.View style={[
-                styles.metaStatChip,
-                {
-                    backgroundColor: `${durationColor}12`,
-                    borderColor: `${durationColor}2E`,
-                },
-            ]}>
-                  <NetworkIcons_1.ClockIcon color={durationColor} size={9}/>
-                  <react_native_1.Text style={[styles.metaStatText, { color: durationColor }]}>
-                    {item.duration}ms
+              {e.duration!=null&&!i&&<react_native_1.View style={[styles.metaStatChip,{backgroundColor:`${d}12`,borderColor:`${d}2E`}]}>
+                  <NetworkIcons_1.ClockIcon color={d}size={9}/>
+                  <react_native_1.Text style={[styles.metaStatText,{color:d}]}>
+                    {e.duration}ms
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
             </react_native_1.View>
           </react_native_1.View>
 
           
-          {typeof item.duration === 'number' && item.duration > 0 && !isFailed && (<react_native_1.View style={styles.waterfallContainer}>
-              <react_native_1.View style={[
-                styles.waterfallBar,
-                {
-                    width: `${Math.min(100, Math.max(6, (item.duration / 1200) * 100))}%`,
-                    backgroundColor: durationColor,
-                },
-            ]}/>
-            </react_native_1.View>)}
+          {typeof e.duration=="number"&&e.duration>0&&!i&&<react_native_1.View style={styles.waterfallContainer}>
+              <react_native_1.View style={[styles.waterfallBar,{width:`${Math.min(100,Math.max(6,e.duration/1200*100))}%`,backgroundColor:d}]}/>
+            </react_native_1.View>}
         </react_native_1.View>
 
-        {isNew && (<react_native_1.Animated.View pointerEvents="none" style={[
-                react_native_1.StyleSheet.absoluteFill,
-                { backgroundColor: methodColor, opacity: shimmerOpacity },
-            ]}/>)}
+        {u&&<react_native_1.Animated.View pointerEvents="none"style={[react_native_1.StyleSheet.absoluteFill,{backgroundColor:h,opacity:_}]}/>}
       </TouchableScale_1.default>
-    </react_native_1.View>);
-});
-const styles = react_native_1.StyleSheet.create({
-    container: {
-        paddingHorizontal: 10,
-        paddingVertical: 3.5,
-    },
-    card: {
-        alignSelf: 'stretch',
-        borderRadius: 11,
-        overflow: 'hidden',
-        shadowColor: AppColors_1.AppColors.black,
-        shadowOffset: { width: 0, height: 1.5 },
-        shadowOpacity: 0.04,
-        shadowRadius: 3,
-        elevation: 1.5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.grayBorderSecondary,
-        backgroundColor: AppColors_1.AppColors.white,
-    },
-    cardBody: {
-        paddingHorizontal: 12,
-        paddingTop: 9,
-        paddingBottom: 8,
-    },
-    cardHeaderRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        marginBottom: 6,
-        minHeight: 22,
-    },
-    cardHeaderLeft: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        flex: 1,
-        marginRight: 6,
-        gap: 5.5,
-        minWidth: 0,
-        flexWrap: 'wrap',
-    },
-    smallCheckbox: {
-        width: 15,
-        height: 15,
-        borderRadius: 4,
-        borderWidth: 1.6,
-        borderColor: AppColors_1.AppColors.grayTextWeak,
-        alignItems: 'center',
-        justifyContent: 'center',
-        backgroundColor: AppColors_1.AppColors.white,
-    },
-    smallCheckboxChecked: {
-        backgroundColor: AppColors_1.AppColors.purple,
-        borderColor: AppColors_1.AppColors.purple,
-    },
-    serialNumber: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        color: AppColors_1.AppColors.grayTextWeak,
-        fontSize: 10,
-    },
-    methodBadge: {
-        paddingHorizontal: 6.5,
-        paddingVertical: 2,
-        borderRadius: 5,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    methodBadgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9.5,
-        letterSpacing: 0.5,
-        color: AppColors_1.AppColors.white,
-    },
-    chip: {
-        paddingHorizontal: 5,
-        paddingVertical: 1.5,
-        borderRadius: 4,
-        borderWidth: 1,
-    },
-    chipText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 8.5,
-    },
-    statusPill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        paddingHorizontal: 7,
-        paddingVertical: 2.5,
-        borderRadius: 6,
-        borderWidth: 1,
-        flexShrink: 0,
-    },
-    statusPillText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9.5,
-    },
-    urlBox: {
-        backgroundColor: AppColors_1.AppColors.grayBackground,
-        borderRadius: 8,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-        paddingHorizontal: 9,
-        paddingVertical: 6,
-        marginVertical: 4,
-        gap: 4,
-    },
-    urlMainRow: {
-        flexDirection: 'row',
-        alignItems: 'flex-start',
-        justifyContent: 'space-between',
-        gap: 6,
-    },
-    pathText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 12,
-        lineHeight: 16.5,
-        color: AppColors_1.AppColors.primaryBlack,
-        flex: 1,
-    },
-    urlBadgeRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        flexShrink: 0,
-    },
-    jsonBadge: {
-        backgroundColor: `${AppColors_1.AppColors.darkOrange}14`,
-        borderColor: `${AppColors_1.AppColors.darkOrange}2E`,
-        borderWidth: 1,
-        paddingHorizontal: 4,
-        paddingVertical: 1,
-        borderRadius: 3,
-    },
-    jsonBadgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 8.5,
-        color: AppColors_1.AppColors.darkOrange,
-    },
-    dupBadge: {
-        backgroundColor: `${AppColors_1.AppColors.purple}14`,
-        borderColor: `${AppColors_1.AppColors.purple}2E`,
-        borderWidth: 1,
-        paddingHorizontal: 4,
-        paddingVertical: 1,
-        borderRadius: 3,
-    },
-    dupBadgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 8.5,
-        color: AppColors_1.AppColors.purple,
-    },
-    hostRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 5,
-    },
-    protoBadge: {
-        paddingHorizontal: 4,
-        paddingVertical: 1,
-        borderRadius: 3,
-        borderWidth: 1,
-    },
-    protoBadgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 7.5,
-    },
-    hostText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.grayText,
-        flex: 1,
-    },
-    highlight: {
-        backgroundColor: AppColors_1.AppColors.yellowHighlight,
-        color: AppColors_1.AppColors.primaryBlack,
-        borderRadius: 2,
-    },
-    cardFooterRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        marginTop: 4,
-        gap: 6,
-    },
-    footerLeft: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 6,
-        flex: 1,
-        minWidth: 0,
-    },
-    footerRight: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 5,
-        flexShrink: 0,
-    },
-    cardDateRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 3.5,
-    },
-    cardDateText: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    callerChip: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 3,
-        backgroundColor: `${AppColors_1.AppColors.sky600}10`,
-        borderColor: `${AppColors_1.AppColors.sky600}2B`,
-        borderWidth: 1,
-        paddingHorizontal: 5,
-        paddingVertical: 1,
-        borderRadius: 4,
-        flexShrink: 1,
-        minWidth: 0,
-    },
-    callerChipText: {
-        color: AppColors_1.AppColors.sky600,
-        fontSize: 8.5,
-        fontFamily: AppFonts_1.AppFonts.interBold,
-    },
-    metaStatChip: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 3,
-        backgroundColor: `${AppColors_1.AppColors.purple}10`,
-        borderColor: `${AppColors_1.AppColors.purple}28`,
-        borderWidth: 1,
-        paddingHorizontal: 5,
-        paddingVertical: 1.5,
-        borderRadius: 4,
-    },
-    metaStatText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        color: AppColors_1.AppColors.purple,
-        fontSize: 9,
-    },
-    waterfallContainer: {
-        height: 2.5,
-        width: '100%',
-        backgroundColor: AppColors_1.AppColors.grayBorderSecondary,
-        borderRadius: 1.5,
-        overflow: 'hidden',
-        marginTop: 6,
-    },
-    waterfallBar: {
-        height: '100%',
-        borderRadius: 1.5,
-    },
-});
-exports.default = LogCard;
+    </react_native_1.View>}),styles=react_native_1.StyleSheet.create({container:{paddingHorizontal:8,paddingVertical:3},card:{alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.shadowColorString},cardBody:{paddingHorizontal:11,paddingTop:8,paddingBottom:7},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:5,minHeight:20},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:6,gap:5,minWidth:0,flexWrap:"wrap"},smallCheckbox:{width:14,height:14,borderRadius:3.5,borderWidth:1.5,borderColor:AppColors_1.AppColors.grayTextWeak,alignItems:"center",justifyContent:"center",backgroundColor:AppColors_1.AppColors.white},smallCheckboxChecked:{backgroundColor:AppColors_1.AppColors.purple,borderColor:AppColors_1.AppColors.purple},serialNumber:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.grayTextWeak,fontSize:9.5},methodBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,lineHeight:11,letterSpacing:.5,color:AppColors_1.AppColors.white},chip:{paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,lineHeight:11},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6.5,paddingVertical:2,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12},urlBox:{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:7,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,paddingHorizontal:8,paddingVertical:5,marginVertical:3,gap:3},urlMainRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",gap:6},pathText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12,lineHeight:16,color:AppColors_1.AppColors.primaryBlack,flex:1},urlBadgeRow:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},jsonBadge:{backgroundColor:`${AppColors_1.AppColors.darkOrange}14`,borderColor:`${AppColors_1.AppColors.darkOrange}2E`,borderWidth:1,paddingHorizontal:4,paddingVertical:1,borderRadius:3},jsonBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.darkOrange},dupBadge:{backgroundColor:`${AppColors_1.AppColors.purple}14`,borderColor:`${AppColors_1.AppColors.purple}2E`,borderWidth:1,paddingHorizontal:4,paddingVertical:1,borderRadius:3},dupBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.purple},hostRow:{flexDirection:"row",alignItems:"center",gap:4.5},protoBadge:{paddingHorizontal:4,paddingVertical:1,borderRadius:3,borderWidth:1},protoBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:7.5,lineHeight:9},hostText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10,lineHeight:13,color:AppColors_1.AppColors.grayTextWeak,flex:1},highlight:{backgroundColor:AppColors_1.AppColors.yellowHighlight,color:AppColors_1.AppColors.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:3,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0},footerRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3},cardDateText:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:9.5,lineHeight:12,color:AppColors_1.AppColors.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:AppColors_1.AppColors.skySoftBg,borderColor:AppColors_1.AppColors.skySoftBorder,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:AppColors_1.AppColors.skySoftText,fontSize:8.5,lineHeight:11,fontFamily:AppFonts_1.AppFonts.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:AppColors_1.AppColors.violetSoftBg,borderColor:AppColors_1.AppColors.violetSoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.violetSoftText,fontSize:9,lineHeight:11},waterfallContainer:{height:2,width:"100%",backgroundColor:AppColors_1.AppColors.graySurface,borderRadius:1,overflow:"hidden",marginTop:5},waterfallBar:{height:"100%",borderRadius:1}});exports.default=LogCard;