react-native-inapp-inspector 2.5.7 → 2.5.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -0
- package/dist/commonjs/components/ConsoleLogCard.js +13 -13
- package/dist/commonjs/components/Inspector/ConsoleTab.js +5 -5
- package/dist/commonjs/components/Inspector/FabLauncher.js +1 -1
- package/dist/commonjs/components/Inspector/InspectorHeader.js +6 -6
- package/dist/commonjs/components/Inspector/NetworkTab.js +48 -48
- package/dist/commonjs/components/Inspector/TabBar.js +5 -5
- package/dist/commonjs/components/LogCard.d.ts +1 -1
- package/dist/commonjs/components/LogCard.js +16 -16
- package/dist/commonjs/constants/version.d.ts +1 -1
- package/dist/commonjs/constants/version.js +1 -1
- package/dist/commonjs/types/interfaces.d.ts +2 -0
- package/dist/esm/components/ConsoleLogCard.js +13 -13
- package/dist/esm/components/Inspector/ConsoleTab.js +9 -9
- package/dist/esm/components/Inspector/FabLauncher.js +1 -1
- package/dist/esm/components/Inspector/InspectorHeader.js +15 -15
- package/dist/esm/components/Inspector/NetworkTab.js +132 -132
- package/dist/esm/components/Inspector/TabBar.js +23 -23
- package/dist/esm/components/LogCard.d.ts +1 -1
- package/dist/esm/components/LogCard.js +24 -24
- package/dist/esm/constants/version.d.ts +1 -1
- package/dist/esm/constants/version.js +1 -1
- package/dist/esm/types/interfaces.d.ts +2 -0
- package/package.json +8 -3
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { LogCardProps } from '../types';
|
|
3
|
-
declare function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, }: LogCardProps): React.JSX.Element;
|
|
3
|
+
declare function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, testID, }: LogCardProps): React.JSX.Element;
|
|
4
4
|
declare const _default: React.MemoExoticComponent<typeof LogCard>;
|
|
5
5
|
export default _default;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,a,n){n===void 0&&(n=a);var o=Object.getOwnPropertyDescriptor(t,a);(!o||("get"in o?!t.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(e,n,o)}):(function(e,t,a,n){n===void 0&&(n=a),e[n]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(a){var n=[];for(var o in a)Object.prototype.hasOwnProperty.call(a,o)&&(n[n.length]=o);return n},e(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var n=e(t),o=0;o<n.length;o++)n[o]!=="default"&&__createBinding(a,t,n[o]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};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");function LogCard({item:e,onPress:t,timelineMinStart:a,timelineTotalRange:n,isNew:o,isSelected:h,onToggleSelect:_,searchStr:C}){const{t:
|
|
1
|
+
"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,a,n){n===void 0&&(n=a);var o=Object.getOwnPropertyDescriptor(t,a);(!o||("get"in o?!t.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(e,n,o)}):(function(e,t,a,n){n===void 0&&(n=a),e[n]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(a){var n=[];for(var o in a)Object.prototype.hasOwnProperty.call(a,o)&&(n[n.length]=o);return n},e(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var n=e(t),o=0;o<n.length;o++)n[o]!=="default"&&__createBinding(a,t,n[o]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};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");function LogCard({item:e,onPress:t,timelineMinStart:a,timelineTotalRange:n,isNew:o,isSelected:h,onToggleSelect:_,searchStr:C,testID:b}){const{t:l}=(0,i18n_1.useTranslation)(),f=constants_1.METHOD_COLORS[e.method]??constants_1.METHOD_COLORS.ALL,s=(0,react_1.useMemo)(()=>{try{const r=new URL(e.url),g=r.host,w=r.pathname+(r.search?r.search:""),S=r.protocol==="https:";return{host:g,path:w||"/",isHttps:S}}catch{const r=e.url.toLowerCase().startsWith("https:"),g=(0,helpers_1.getPath)(e.url);return{host:(0,helpers_1.getBaseUrl)(e.url).replace(/^https?:\/\//,""),path:g||e.url,isHttps:r}}},[e.url]),y=r=>{r?.stopPropagation?.(),react_native_1.Alert.alert(l("common.openInBrowser")||"Open in Browser",`${l("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
|
|
2
2
|
|
|
3
|
-
${e.url}`,[{text:
|
|
4
|
-
<TouchableScale_1.default onPress={t}style={[styles.card,{borderLeftWidth:3.5,borderLeftColor:
|
|
3
|
+
${e.url}`,[{text:l("common.cancel")||"Cancel",style:"cancel"},{text:l("common.open")||"Open",onPress:()=>{react_native_1.Linking.openURL(e.url).catch(()=>{react_native_1.Alert.alert(l("common.error")||"Error",l("common.cannotOpenUrl")||"Could not open URL")})}}])},i=e.status===0||e.status!=null&&e.status>=400,p=e.status==null,d=(0,helpers_1.getStatusColor)(e.status),c=(0,helpers_1.getDurationColor)(e.duration),x=p?AppColors_1.AppColors.darkOrange:i?AppColors_1.AppColors.errorColor:AppColors_1.AppColors.greenColor,u=(0,react_1.useRef)(new react_native_1.Animated.Value(o?.35:0)).current;(0,react_1.useEffect)(()=>{o&&react_native_1.Animated.timing(u,{toValue:0,duration:1200,useNativeDriver:!0}).start()},[o,u]);const A=()=>{if(p)return"...";if(e.status===0||e.status==null)return l("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)},T=()=>{if(p)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}/>},v=(0,helpers_1.formatDateTime)(e.startTime),V=e.url.split("?")[0].toLowerCase().endsWith(".json");return<react_native_1.View style={styles.container}>
|
|
4
|
+
<TouchableScale_1.default testID={b}onPress={t}style={[styles.card,{borderLeftWidth:3.5,borderLeftColor:x,backgroundColor:i?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white}]}>
|
|
5
5
|
<react_native_1.View style={styles.cardBody}>
|
|
6
6
|
|
|
7
7
|
<react_native_1.View style={styles.cardHeaderRow}>
|
|
@@ -35,13 +35,13 @@ ${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.op
|
|
|
35
35
|
</react_native_1.View>
|
|
36
36
|
|
|
37
37
|
<react_native_1.View style={styles.cardHeaderRight}>
|
|
38
|
-
<react_native_1.View style={[styles.statusPill,{backgroundColor:i?`${AppColors_1.AppColors.errorColor}14`:
|
|
39
|
-
{
|
|
40
|
-
<react_native_1.Text style={[styles.statusPillText,{color:i?AppColors_1.AppColors.errorColor:
|
|
41
|
-
{
|
|
38
|
+
<react_native_1.View style={[styles.statusPill,{backgroundColor:i?`${AppColors_1.AppColors.errorColor}14`:p?`${AppColors_1.AppColors.darkOrange}14`:`${d}14`,borderColor:i?`${AppColors_1.AppColors.errorColor}33`:p?`${AppColors_1.AppColors.darkOrange}33`:`${d}33`}]}>
|
|
39
|
+
{T()}
|
|
40
|
+
<react_native_1.Text style={[styles.statusPillText,{color:i?AppColors_1.AppColors.errorColor:p?AppColors_1.AppColors.darkOrange:d}]}>
|
|
41
|
+
{A()}
|
|
42
42
|
</react_native_1.Text>
|
|
43
43
|
</react_native_1.View>
|
|
44
|
-
<react_native_1.Pressable onPress={
|
|
44
|
+
<react_native_1.Pressable onPress={y}hitSlop={8}style={styles.globeBtn}accessibilityRole="button"accessibilityLabel="Open in Browser">
|
|
45
45
|
<NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.grayTextWeak}size={12}/>
|
|
46
46
|
</react_native_1.Pressable>
|
|
47
47
|
<NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.grayTextWeak}size={13}/>
|
|
@@ -53,15 +53,15 @@ ${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.op
|
|
|
53
53
|
|
|
54
54
|
<react_native_1.View style={styles.urlMainRow}>
|
|
55
55
|
<react_native_1.View style={styles.hostRow}>
|
|
56
|
-
<react_native_1.View style={[styles.protoBadge,{backgroundColor:
|
|
57
|
-
<react_native_1.Text style={[styles.protoBadgeText,{color:
|
|
58
|
-
{
|
|
56
|
+
<react_native_1.View style={[styles.protoBadge,{backgroundColor:s.isHttps?`${AppColors_1.AppColors.emerald600}12`:`${AppColors_1.AppColors.amber600}12`,borderColor:s.isHttps?`${AppColors_1.AppColors.emerald600}2B`:`${AppColors_1.AppColors.amber600}2B`}]}>
|
|
57
|
+
<react_native_1.Text style={[styles.protoBadgeText,{color:s.isHttps?AppColors_1.AppColors.emerald600:AppColors_1.AppColors.amber700}]}>
|
|
58
|
+
{s.isHttps?"HTTPS":"HTTP"}
|
|
59
59
|
</react_native_1.Text>
|
|
60
60
|
</react_native_1.View>
|
|
61
|
-
<HighlightText_1.default text={
|
|
61
|
+
<HighlightText_1.default text={s.host||e.url}search={C}style={styles.hostText}highlightStyle={styles.highlight}numberOfLines={1}ellipsizeMode="tail"/>
|
|
62
62
|
</react_native_1.View>
|
|
63
63
|
<react_native_1.View style={styles.urlBadgeRow}>
|
|
64
|
-
{
|
|
64
|
+
{V&&<react_native_1.View style={styles.jsonBadge}>
|
|
65
65
|
<react_native_1.Text style={styles.jsonBadgeText}>.json</react_native_1.Text>
|
|
66
66
|
</react_native_1.View>}
|
|
67
67
|
{e.duplicateCount!=null&&e.duplicateCount>1&&<react_native_1.View style={styles.dupBadge}>
|
|
@@ -72,7 +72,7 @@ ${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.op
|
|
|
72
72
|
|
|
73
73
|
|
|
74
74
|
<react_native_1.View style={styles.slugRow}>
|
|
75
|
-
<HighlightText_1.default text={
|
|
75
|
+
<HighlightText_1.default text={s.path}search={C}style={styles.pathText}highlightStyle={styles.highlight}numberOfLines={1}ellipsizeMode="middle"/>
|
|
76
76
|
</react_native_1.View>
|
|
77
77
|
</react_native_1.View>
|
|
78
78
|
|
|
@@ -81,7 +81,7 @@ ${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.op
|
|
|
81
81
|
<react_native_1.View style={styles.footerLeft}>
|
|
82
82
|
<react_native_1.View style={styles.cardDateRow}>
|
|
83
83
|
<NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak}size={10}/>
|
|
84
|
-
<react_native_1.Text style={styles.cardDateText}numberOfLines={1}>{
|
|
84
|
+
<react_native_1.Text style={styles.cardDateText}numberOfLines={1}>{v}</react_native_1.Text>
|
|
85
85
|
</react_native_1.View>
|
|
86
86
|
</react_native_1.View>
|
|
87
87
|
|
|
@@ -108,6 +108,6 @@ ${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.op
|
|
|
108
108
|
</react_native_1.View>
|
|
109
109
|
</react_native_1.View>
|
|
110
110
|
|
|
111
|
-
{o&&<react_native_1.Animated.View pointerEvents="none"style={[react_native_1.StyleSheet.absoluteFill,{backgroundColor:f,opacity:
|
|
111
|
+
{o&&<react_native_1.Animated.View pointerEvents="none"style={[react_native_1.StyleSheet.absoluteFill,{backgroundColor:f,opacity:u}]}/>}
|
|
112
112
|
</TouchableScale_1.default>
|
|
113
113
|
</react_native_1.View>}const styles=react_native_1.StyleSheet.create({container:{paddingHorizontal:8,paddingVertical:4,height:126,justifyContent:"center"},card:{height:118,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.shadowColorString},cardBody:{height:"100%",paddingHorizontal:8,paddingTop:8,paddingBottom:6,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:4,gap:4.5,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},smallCheckbox:{width:15,height:15,borderRadius:4,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:10},methodBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:AppColors_1.AppColors.white},chip:{paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,lineHeight:12},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12},globeBtn:{padding:3,borderRadius:4,backgroundColor:`${AppColors_1.AppColors.grayTextWeak}12`,alignItems:"center",justifyContent:"center"},urlBox:{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:7,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,paddingHorizontal:7,paddingVertical:4.5,height:48,minHeight:48,maxHeight:48,justifyContent:"center",gap:2.5,overflow:"hidden"},urlMainRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:4,minHeight:16},hostRow:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0},protoBadge:{paddingHorizontal:4,paddingVertical:1,borderRadius:3.5,borderWidth:1},protoBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8,lineHeight:10},hostText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11.5,lineHeight:15,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.5,paddingVertical:1,borderRadius:3.5},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.5,paddingVertical:1,borderRadius:3.5},dupBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.purple},slugRow:{flexDirection:"row",alignItems:"center",minHeight:15},pathText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,lineHeight:14,color:AppColors_1.AppColors.slate600||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",height:18,minHeight:18,maxHeight:18,gap:4},footerLeft:{flexDirection:"row",alignItems:"center",gap:4.5,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3.5},cardDateText:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:10,lineHeight:13,color:AppColors_1.AppColors.slate400},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:AppColors_1.AppColors.violetSoftBg,borderColor:AppColors_1.AppColors.violetSoftBorder,borderWidth:1,paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:AppColors_1.AppColors.graySurface,borderRadius:1.5,overflow:"hidden",marginTop:2},waterfallBar:{height:"100%",borderRadius:1.5}});function areLogCardPropsEqual(e,t){return e.item===t.item&&e.isSelected===t.isSelected&&e.isNew===t.isNew&&e.searchStr===t.searchStr&&e.timelineMinStart===t.timelineMinStart&&e.timelineTotalRange===t.timelineTotalRange&&e.onPress===t.onPress&&e.onToggleSelect===t.onToggleSelect}exports.default=react_1.default.memo(LogCard,areLogCardPropsEqual);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const LIB_VERSION = "2.5.
|
|
1
|
+
export declare const LIB_VERSION = "2.5.8";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LIB_VERSION=void 0,exports.LIB_VERSION="2.5.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LIB_VERSION=void 0,exports.LIB_VERSION="2.5.8";
|
|
@@ -482,6 +482,7 @@ export interface LogCardProps {
|
|
|
482
482
|
isSelected: boolean;
|
|
483
483
|
onToggleSelect: (id: number) => void;
|
|
484
484
|
searchStr?: string;
|
|
485
|
+
testID?: string;
|
|
485
486
|
}
|
|
486
487
|
export interface MetaAccordionProps {
|
|
487
488
|
status: number | null | undefined;
|
|
@@ -538,6 +539,7 @@ export interface ConsoleLogCardProps {
|
|
|
538
539
|
item: ConsoleLog;
|
|
539
540
|
searchStr?: string;
|
|
540
541
|
onPress?: (item: ConsoleLog) => void;
|
|
542
|
+
testID?: string;
|
|
541
543
|
}
|
|
542
544
|
export interface JsonContent {
|
|
543
545
|
header: string;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import F from"react";import{useTranslation as v}from"../i18n";import{Pressable as K,StyleSheet as Y,Text as E,View as I}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as S}from"../styles/AppFonts";import{formatTime as X,getJsonContent as J,getJsonPreviewText as Q,parseStackLine as Z,openInVSCode as q,getSize as _,getCleanCallerDisplay as ee}from"../helpers";import Ie from"./TouchableScale";import L from"./LogSyntaxHighlighter";import{ForwardChevronIcon as Te,ExternalLinkIcon as Ce,FlaskIcon as he,ZapIcon as
|
|
1
|
+
import F from"react";import{useTranslation as v}from"../i18n";import{Pressable as K,StyleSheet as Y,Text as E,View as I}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as S}from"../styles/AppFonts";import{formatTime as X,getJsonContent as J,getJsonPreviewText as Q,parseStackLine as Z,openInVSCode as q,getSize as _,getCleanCallerDisplay as ee}from"../helpers";import Ie from"./TouchableScale";import L from"./LogSyntaxHighlighter";import{ForwardChevronIcon as Te,ExternalLinkIcon as Ce,FlaskIcon as he,ZapIcon as z,GlobeIcon as Se,DiceIcon as me,AtomIcon as U,BarChartIcon as xe,KeyIcon as ye,SmartphoneIcon as Ee,AlertTriangleIcon as Re,BugIcon as Be,TagIcon as Ae,MapPinIcon as $,StorageIcon as Oe,SignalIcon as Pe,FlameIcon as we,MoneyIcon as Ne,CircleCheckIcon as W,CircleAlertIcon as Le,CircleXIcon as ke,RefreshCcwIcon as He,PerformanceIcon as Ve,ChipIcon as De,SettingsIcon as Fe,TerminalIcon as ze,InfoCircleIcon as G,ShieldAlertIcon as Me,LayoutIcon as Ue,ClockIcon as $e,SizeIcon as We}from"./NetworkIcons";import{useInspector as Ge}from"./Inspector/InspectorContext";const ve=(R,t,P,k,H)=>{if(!R)return null;const V=/^((?:\[[^\]]+\]\s*)+)/,w=R.match(V);if(w){const C=w[1],N=R.substring(C.length),T=C.match(/\[[^\]]+\]/g)||[],M=B=>{const e=B.replace(/[\[\]]/g,"").trim().toUpperCase();return e==="AXIOS"?{color:r.emerald600,Icon:z,label:"AXIOS"}:e==="API"||e==="FETCH"||e==="HTTP"||e==="REST"||e==="NETWORK"?{color:r.sky600,Icon:Se,label:e}:e==="GRAPHQL"||e==="GQL"||e==="APOLLO"||e==="MUTATION"||e==="QUERY"?{color:r.pink500,Icon:U,label:e}:e==="WS"||e==="WEBSOCKET"||e==="SOCKET"||e==="SOCKET.IO"||e==="REALTIME"?{color:r.cyan600,Icon:Pe,label:e}:e==="REDUX"||e==="STORE"||e==="STATE"||e==="ZUSTAND"||e==="MOBX"||e==="RECOIL"||e==="ACTION"||e==="DISPATCH"?{color:r.violet600,Icon:U,label:e}:e==="ANALYTICS"||e==="FIREBASE"||e==="GA4"||e==="GA"||e==="SEGMENT"||e==="MIXPANEL"||e==="POSTHOG"||e==="TRACK"||e==="EVENT"?{color:r.teal600,Icon:xe,label:e}:e==="AUTH"||e==="TOKEN"||e==="SESSION"||e==="JWT"||e==="LOGIN"||e==="LOGOUT"||e==="USER"?{color:r.amber600,Icon:ye,label:e}:e==="SECURITY"||e==="SHIELD"||e==="PERMISSION"||e==="PERMISSIONS"?{color:r.indigo600Alt,Icon:Me,label:e}:e==="NAV"||e==="NAVIGATION"||e==="ROUTE"||e==="SCREEN"||e==="ROUTER"||e==="DEEPLINK"?{color:r.indigo600Alt,Icon:$,label:e}:e==="STORAGE"||e==="ASYNCSTORAGE"||e==="MMKV"||e==="SQLITE"||e==="DB"||e==="DATABASE"||e==="REALM"||e==="CACHE"?{color:r.purple500,Icon:Oe,label:e}:e==="PERF"||e==="RENDER"||e==="PERFORMANCE"||e==="FPS"||e==="MEMORY"?{color:r.violet500,Icon:Ve,label:e}:e==="INIT"||e==="BOOT"||e==="STARTUP"||e==="LIFECYCLE"||e==="MOUNT"||e==="UNMOUNT"?{color:r.blue600,Icon:z,label:e}:e==="SYNC"||e==="REFRESH"||e==="BACKGROUND"||e==="JOB"||e==="WORKER"?{color:r.sky600,Icon:He,label:e}:e==="PUSH"||e==="NOTIF"||e==="NOTIFICATION"||e==="FCM"||e==="APNS"?{color:r.darkOrange,Icon:we,label:e}:e==="PAY"||e==="PAYMENT"||e==="STRIPE"||e==="IAP"||e==="BILLING"||e==="CHECKOUT"||e==="CART"?{color:r.emerald600,Icon:Ne,label:e}:e==="DEVICE"||e==="HARDWARE"||e==="BLE"||e==="BLUETOOTH"||e==="NFC"||e==="SENSOR"?{color:r.slate600,Icon:De,label:e}:e==="LOCATION"||e==="GPS"||e==="GEO"?{color:r.emerald600,Icon:$,label:e}:e==="APP"?{color:r.indigo600Alt,Icon:Ee,label:"APP"}:e==="UI"||e==="VIEW"||e==="THEME"||e==="STYLE"||e==="LAYOUT"?{color:r.pink600,Icon:Ue,label:e}:e==="TEST"||e==="MOCK"||e==="SPEC"?{color:r.emerald500,Icon:he,label:"TEST"}:e==="SAMPLE"||e==="BATCH"?{color:r.indigo600Alt,Icon:me,label:e}:e==="CONFIG"||e==="ENV"||e==="SETTINGS"?{color:r.slate700,Icon:Fe,label:e}:e==="DEBUG"||e==="TRACE"?{color:r.purpleText,Icon:ze,label:e}:e==="INFO"?{color:r.sky600,Icon:G,label:"INFO"}:e==="SUCCESS"||e==="OK"||e==="DONE"||e==="PASSED"?{color:r.green600,Icon:W,label:e}:e==="WARN"||e==="WARNING"?{color:r.amber600,Icon:Re,label:"WARN"}:e==="ERROR"||e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?{color:r.red600,Icon:Be,label:e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?e:"ERROR"}:{color:r.slate600,Icon:Ae,label:e}};return<I style={{flexDirection:"column",gap:2}}>
|
|
2
2
|
<I style={{flexDirection:"row",gap:4,overflow:"hidden"}}>
|
|
3
|
-
{
|
|
4
|
-
<
|
|
5
|
-
<E style={[o.prefixTagText,{color:
|
|
6
|
-
{
|
|
3
|
+
{T.slice(0,2).map((B,e)=>{const A=M(B),D=A.Icon;return<I key={e}style={[o.prefixTag,{backgroundColor:`${A.color}12`,borderColor:`${A.color}30`}]}>
|
|
4
|
+
<D color={A.color}size={8.5}/>
|
|
5
|
+
<E style={[o.prefixTagText,{color:A.color}]}>
|
|
6
|
+
{A.label}
|
|
7
7
|
</E>
|
|
8
8
|
</I>})}
|
|
9
9
|
</I>
|
|
10
|
-
<L text={
|
|
11
|
-
</I>}return<L text={R}search={t}style={P}numberOfLines={H||2}detectLinks={!1}/>};export const ConsoleLogCard=F.memo(function({item:t,searchStr:P="",onPress:k}){const{setSelectedLog:
|
|
12
|
-
<Ie onPress={
|
|
10
|
+
<L text={N}search={t}style={P}numberOfLines={1}detectLinks={!1}/>
|
|
11
|
+
</I>}return<L text={R}search={t}style={P}numberOfLines={H||2}detectLinks={!1}/>};export const ConsoleLogCard=F.memo(function({item:t,searchStr:P="",onPress:k,testID:H}){const{setSelectedLog:V}=Ge(),{t:w}=v(),C=J(t.message),N=t.message.toLowerCase().includes("[analytics error]"),T=F.useMemo(()=>{const h=ee(t.caller);if(!h)return null;const O=Z(t.caller,!0);return{...O,display:h.display,fileName:h.fileName,lineNumber:h.lineNumber||O.lineNumber}},[t.caller]),B=(()=>{const h=(t.type||"log").toLowerCase(),O=(t.sourceMethod||h).toLowerCase();return N||h==="error"||O==="error"?{badgeColor:r.errorColor,border:r.errorColor,badgeBg:`${r.errorColor}18`,badgeText:r.errorColor,label:"ERROR",cardBg:r.errorCardBg,statusPillBg:`${r.errorColor}14`,statusPillBorder:`${r.errorColor}33`,statusPillText:r.errorColor,StatusIcon:ke}:h==="warn"||O==="warn"?{badgeColor:r.darkOrange,border:r.darkOrange,badgeBg:`${r.darkOrange}18`,badgeText:r.darkOrange,label:"WARN",cardBg:r.warnCardBg,statusPillBg:`${r.darkOrange}14`,statusPillBorder:`${r.darkOrange}33`,statusPillText:r.darkOrange,StatusIcon:Le}:h==="debug"||O==="debug"?{badgeColor:r.purple,border:r.purple,badgeBg:`${r.purple}18`,badgeText:r.purple,label:"DEBUG",cardBg:r.purpleTintBg,statusPillBg:`${r.purple}14`,statusPillBorder:`${r.purple}33`,statusPillText:r.purple,StatusIcon:z}:O==="info"||h==="info"&&O!=="log"?{badgeColor:r.sky600,border:r.sky600,badgeBg:`${r.sky600}18`,badgeText:r.sky600,label:"INFO",cardBg:r.blueTintBg,statusPillBg:`${r.sky600}14`,statusPillBorder:`${r.sky600}33`,statusPillText:r.sky600,StatusIcon:G}:{badgeColor:r.brandPurple,border:r.brandPurple,badgeBg:`${r.brandPurple}15`,badgeText:r.brandPurple,label:"LOG",cardBg:r.white,statusPillBg:`${r.brandPurple}12`,statusPillBorder:`${r.brandPurple}2E`,statusPillText:r.brandPurple,StatusIcon:W}})(),e=B.StatusIcon,A=C?Q(C.data):null,D=()=>{k?k(t):V(t)},Ke=("sourceMethod"in t?t.sourceMethod:void 0)||t.type||"log";return<I style={o.container}>
|
|
12
|
+
<Ie testID={H}onPress={D}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:B.border,backgroundColor:B.cardBg}]}>
|
|
13
13
|
<I style={o.cardBody}>
|
|
14
14
|
|
|
15
15
|
<I style={o.cardHeaderRow}>
|
|
@@ -19,8 +19,8 @@ import F from"react";import{useTranslation as v}from"../i18n";import{Pressable a
|
|
|
19
19
|
</E>
|
|
20
20
|
|
|
21
21
|
|
|
22
|
-
<I style={[o.methodBadge,{backgroundColor:
|
|
23
|
-
<E style={o.methodBadgeText}>{
|
|
22
|
+
<I style={[o.methodBadge,{backgroundColor:B.badgeColor}]}>
|
|
23
|
+
<E style={o.methodBadgeText}>{B.label}</E>
|
|
24
24
|
</I>
|
|
25
25
|
|
|
26
26
|
|
|
@@ -48,7 +48,7 @@ import F from"react";import{useTranslation as v}from"../i18n";import{Pressable a
|
|
|
48
48
|
<I style={o.messageBox}>
|
|
49
49
|
{C?<I style={o.jsonPreviewRow}>
|
|
50
50
|
{C.header?<L text={C.header}search={P}style={o.messageText}detectLinks={!1}numberOfLines={1}/>:null}
|
|
51
|
-
{
|
|
51
|
+
{A&&<L text={A.text.replace(/\s+/g," ")}search={P}style={o.jsonPreviewText}detectLinks={!1}numberOfLines={C.header?2:3}/>}
|
|
52
52
|
</I>:ve(t.message,P,o.messageText,o.highlight,3)}
|
|
53
53
|
</I>
|
|
54
54
|
|
|
@@ -83,9 +83,9 @@ import F from"react";import{useTranslation as v}from"../i18n";import{Pressable a
|
|
|
83
83
|
</E>
|
|
84
84
|
</I>}
|
|
85
85
|
|
|
86
|
-
{
|
|
86
|
+
{N&&<I style={[o.chip,{backgroundColor:`${r.skyBlue}15`,borderColor:`${r.skyBlue}30`}]}>
|
|
87
87
|
<E style={[o.chipText,{color:r.skyBlue}]}>
|
|
88
|
-
{
|
|
88
|
+
{w("console.analyticsBadge")||"ANALYTICS"}
|
|
89
89
|
</E>
|
|
90
90
|
</I>}
|
|
91
91
|
</I>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList as Se,Pressable as Ce,ScrollView as Q,Text as A,TextInput as Ie,View as S}from"react-native";import{useInspector as Te}from"./InspectorContext";import{useTranslation as xe}from"../../i18n";import H from"../TouchableScale";import Le from"../AnimatedEntrance";import{ConsoleLogCard as Ae}from"../ConsoleLogCard";import Ve from"../EmptyState";import Ee from"../EndOfListFooter";import T from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as z}from"../../styles/AppFonts";import{LogFilter as V}from"../../types";import{SearchIcon as Be,ClearIcon as Fe,SortArrowIcon as Pe,TrashIcon as He,LayersIcon as Re,UserIcon as
|
|
2
|
-
<Ae item={e}searchStr={y}onPress={v}/>
|
|
3
|
-
</Le>,[y,v]),Z=k((e,t)=>({length:148,offset:148*t,index:t}),[]),ee=k((e,t)=>e?.id?.toString()??t.toString(),[]),oe=P(()=>{const e=
|
|
1
|
+
import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList as Se,Pressable as Ce,ScrollView as Q,Text as A,TextInput as Ie,View as S}from"react-native";import{useInspector as Te}from"./InspectorContext";import{useTranslation as xe}from"../../i18n";import H from"../TouchableScale";import Le from"../AnimatedEntrance";import{ConsoleLogCard as Ae}from"../ConsoleLogCard";import Ve from"../EmptyState";import Ee from"../EndOfListFooter";import T from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as z}from"../../styles/AppFonts";import{LogFilter as V}from"../../types";import{SearchIcon as Be,ClearIcon as Fe,SortArrowIcon as Pe,TrashIcon as He,LayersIcon as Re,UserIcon as $e,InfoCircleIcon as We,WarningTriangleIcon as De,ErrorCircleIcon as Oe,AnalyticsIcon as Ne}from"../NetworkIcons";const Y=10,Ue=F.memo(()=>{const{t:C}=xe(),{logSearch:y,setLogSearch:E,logSortOrder:K,setLogSortOrder:X,handleDelete:j,logFilters:h,setLogFilters:R,logCounts:x,filteredConsoleLogs:w,visibleConsoleLogs:O,maxConsoleLogs:$,setSelectedLog:N}=Te(),q=$||100,U=ne(null),[G,M]=F.useState(q);F.useEffect(()=>{M($||100),U.current?.scrollToOffset({offset:0,animated:!1})},[y,h,$]);const W=P(()=>w.slice(0,G),[w,G]),v=k(e=>{N(e)},[N]),J=k(({item:e,index:t})=><Le index={t}distance={8}>
|
|
2
|
+
<Ae testID={`inspector.console.item.${t}`}item={e}searchStr={y}onPress={v}/>
|
|
3
|
+
</Le>,[y,v]),Z=k((e,t)=>({length:148,offset:148*t,index:t}),[]),ee=k((e,t)=>e?.id?.toString()??t.toString(),[]),oe=P(()=>{const e=O.length,t=w.length;if(h.has("all")||!Array.from(h).some(B=>B!=="all"))return<S style={{paddingHorizontal:8,paddingTop:8,paddingBottom:3}}>
|
|
4
4
|
<A style={{fontFamily:z.interMedium,fontSize:11,color:o.grayTextWeak,letterSpacing:.2}}>
|
|
5
5
|
{t===e?`Showing ${e} logs`:`Showing ${t} of ${e} logs`}
|
|
6
6
|
</A>
|
|
@@ -8,11 +8,11 @@ import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList
|
|
|
8
8
|
<A style={{fontFamily:z.interMedium,fontSize:11,color:o.grayTextWeak,letterSpacing:.2}}>
|
|
9
9
|
Filtered by {B.join(", ")} ({t} of {e} logs)
|
|
10
10
|
</A>
|
|
11
|
-
</S>}},[
|
|
11
|
+
</S>}},[O.length,w.length,h]),[D,_]=F.useState(!1),te=P(()=>["[AXIOS]","[API]","[GRAPHQL]","[REDUX]","[ANALYTICS]","[AUTH]","[NAV]","[STORAGE]","[PERF]","[WS]","[PUSH]","[PAYMENT]","[SYNC]","[BLE]","[LOCATION]","[TEST]","[DEBUG]"],[]),re=P(()=>[{id:V.All,label:C("common.all","All"),count:x.all?.split("/")?.[0]??"0",color:o.purple,Icon:Re},{id:V.UserLog,label:C("console.log","Log"),count:x["user-log"]?.split("/")?.[0]??"0",color:o.teal600,Icon:$e},{id:V.Info,label:C("console.info","Info"),count:x.info?.split("/")?.[0]??"0",color:o.sky600,Icon:We},{id:V.Warn,label:C("console.warning","Warn"),count:x.warn?.split("/")?.[0]??"0",color:o.amber600,Icon:De},{id:V.Error,label:C("console.error","Error"),count:x.error?.split("/")?.[0]??"0",color:o.errorColor,Icon:Oe},{id:V.Analytics,label:C("console.analytics","Analytics"),count:x.analytics?.split("/")?.[0]??"0",color:o.violet600,Icon:Ne}],[x,C]);return<S style={{flex:1}}>
|
|
12
12
|
<S style={{backgroundColor:o.white,borderBottomWidth:1,borderBottomColor:o.dividerColor,paddingBottom:6}}>
|
|
13
13
|
<S style={[T.toolbarRow,{marginTop:12,marginBottom:8}]}>
|
|
14
|
-
<S style={[T.searchContainer,
|
|
15
|
-
<Be color={
|
|
14
|
+
<S style={[T.searchContainer,D&&{borderColor:o.purple,borderWidth:1.5}]}>
|
|
15
|
+
<Be color={D?o.purple:o.grayTextWeak}size={16}/>
|
|
16
16
|
<Ie placeholder={C("console.searchPlaceholder")}placeholderTextColor={o.grayTextWeak}value={y}onChangeText={E}onFocus={()=>_(!0)}onBlur={()=>_(!1)}style={T.searchInput}autoCorrect={!1}autoCapitalize="none"/>
|
|
17
17
|
{y.length>0&&<S style={{flexDirection:"row",alignItems:"center",gap:4}}>
|
|
18
18
|
<S style={{backgroundColor:`${o.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:2}}>
|
|
@@ -37,7 +37,7 @@ import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList
|
|
|
37
37
|
</S>
|
|
38
38
|
|
|
39
39
|
|
|
40
|
-
{(
|
|
40
|
+
{(D||y.length>0)&&<Q horizontal showsHorizontalScrollIndicator={!1}style={{marginBottom:6,maxHeight:30}}contentContainerStyle={{paddingHorizontal:8,flexDirection:"row",alignItems:"center",gap:6}}>
|
|
41
41
|
{te.map(e=>{const t=y.includes(e);return<H key={e}onPress={()=>{E(t?r=>r.replace(e,"").trim():r=>r?`${r} ${e}`.trim():e)}}>
|
|
42
42
|
<S style={{paddingHorizontal:8,paddingVertical:3,borderRadius:6,backgroundColor:t?o.purple:`${o.purple}14`,borderWidth:1,borderColor:t?o.purple:`${o.purple}30`}}>
|
|
43
43
|
<A style={{fontFamily:z.interBold,fontSize:10,color:t?o.white:o.purple}}>
|
|
@@ -50,7 +50,7 @@ import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList
|
|
|
50
50
|
|
|
51
51
|
<S style={{flexDirection:"row",alignItems:"center",marginBottom:8,paddingHorizontal:8,gap:6}}>
|
|
52
52
|
<Q horizontal showsHorizontalScrollIndicator={!1}style={{flex:1}}contentContainerStyle={{flexDirection:"row",alignItems:"center",gap:6,paddingRight:6}}>
|
|
53
|
-
{re.map(e=>{const t=e.id==="all"?h.has("all"):h.has(e.id)&&!h.has("all"),r=e.color||o.purple,B=t?o.white:r,I=e.Icon;return<H key={e.id}onPress={()=>{e.id==="all"?R(new Set(["all"])):R(le=>{const L=new Set(le);return L.delete("all"),L.has(e.id)?L.delete(e.id):L.add(e.id),L.size===0&&L.add("all"),L})}}>
|
|
53
|
+
{re.map(e=>{const t=e.id==="all"?h.has("all"):h.has(e.id)&&!h.has("all"),r=e.color||o.purple,B=t?o.white:r,I=e.Icon;return<H testID={`inspector.console.filter.${e.id}`}key={e.id}onPress={()=>{e.id==="all"?R(new Set(["all"])):R(le=>{const L=new Set(le);return L.delete("all"),L.has(e.id)?L.delete(e.id):L.add(e.id),L.size===0&&L.add("all"),L})}}>
|
|
54
54
|
<S style={{flexDirection:"row",alignItems:"center",paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:t?r:`${r}12`,borderWidth:1,borderColor:t?r:`${r}30`,gap:5}}>
|
|
55
55
|
<I size={11}color={B}/>
|
|
56
56
|
<A style={{fontFamily:z.interBold,fontSize:10.5,color:t?o.white:o.primaryBlack}}>
|
|
@@ -67,5 +67,5 @@ import F,{useCallback as k,useMemo as P,useRef as ne}from"react";import{FlatList
|
|
|
67
67
|
</S>
|
|
68
68
|
</S>
|
|
69
69
|
|
|
70
|
-
<Se ref={U}data={
|
|
70
|
+
<Se ref={U}data={W}keyExtractor={ee}ListHeaderComponent={oe}renderItem={J}getItemLayout={Z}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}nestedScrollEnabled={!0}ListEmptyComponent={<Ve isSearch={y.length>0||!h.has("all")}searchQuery={y}customTitle={y.length>0?"No matching console logs":"No console logs"}onClearSearch={()=>{E(""),R(new Set(["all"]))}}/>}ListFooterComponent={w.length>0?<Ee count={W.length}totalCount={w.length}label="logs"loadMoreStep={Y}hasMore={W.length<w.length}onLoadMore={()=>M(e=>e+Y)}/>:null}style={{flex:1}}contentContainerStyle={[T.listContent,{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
|
|
71
71
|
</S>});export default Ue;
|
|
@@ -60,7 +60,7 @@ import{useCallback as L,useEffect as X,useRef as d,useState as E}from"react";imp
|
|
|
60
60
|
</F>
|
|
61
61
|
</S>
|
|
62
62
|
</s.View>:<s.View style={[Ce.fabWrapper,{transform:a.getTranslateTransform()}]}{...ze.panHandlers}>
|
|
63
|
-
<F style={{alignItems:"center",justifyContent:"center"}}onPress={()=>{N.current||(u("light"),P(!0))}}hitSlop={10}>
|
|
63
|
+
<F testID="inspector.fab.launcher"style={{alignItems:"center",justifyContent:"center"}}onPress={()=>{N.current||(u("light"),P(!0))}}hitSlop={10}>
|
|
64
64
|
<s.View style={[Ce.fabPulseRing,{transform:[{scale:Ve}]}]}/>
|
|
65
65
|
<Se size={68}customIcon={Q}shape="circle"/>
|
|
66
66
|
</F>
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import
|
|
1
|
+
import B,{useMemo as Z}from"react";import{Alert as Ke,Animated as Xe,Linking as Ye,Platform as se,Pressable as Se,StatusBar as Ze,Text as C,TouchableOpacity as Te,useWindowDimensions as et,View as S}from"react-native";import St from"react-native-linear-gradient";import{useInspector as Tt}from"./InspectorContext";import G from"../TouchableScale";import{BrandCircleIcon as Ct}from"../BrandCircleIcon";import i from"../../styles";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as D}from"../../styles/AppFonts";import{METHOD_COLORS as xt}from"../../constants";import{LIB_VERSION as de}from"../../constants";import{getStatusColor as ce,formatTime as zt,formatTimeShort as Ce,getSize as xe,formatByteSize as Vt,getAppVersionAndBuild as Dt,showToast as H}from"../../helpers";import{triggerNativeHaptic as O}from"../../native/NativeInspector";import{ScreenCapture as W,generateCaptureId as ue}from"../../capture";import{UpdateAvailableModal as Rt}from"./UpdateAvailableModal";import{MediaPreviewModal as It}from"./MediaPreviewModal";import{LanguageSelectorModal as Mt}from"./LanguageSelectorModal";import Bt from"../CountryFlag";import{WhiteBackNavigation as $t,SettingsIcon as Lt,CloseWhite as At,ChevronDownIcon as Ve,ClockIcon as _,SizeIcon as De,AppleIcon as Ht,AndroidIcon as Ot,NpmIcon as Pt,ResetIcon as Et,BoltIcon as Wt,EyeIcon as Ft}from"../NetworkIcons";import{useTranslation as Ut,SUPPORTED_LANGUAGES as ke,getLanguage as Nt}from"../../i18n";const jt=B.memo(()=>{const{t:I,language:ge}=Ut(),{modalHeightPercent:ee,appIcon:Gt,selected:R,setSelected:Re,selectedEvent:$,setSelectedEvent:Ie,selectedLog:L,setSelectedLog:Me,selectedReduxSlice:F,setSelectedReduxSlice:Be,selectedReduxAction:q,setSelectedReduxAction:$e,reduxState:Le,reduxLastActionMap:ve,updateAvailable:te,latestNpmVersion:Ae,clearAnim:_t,activePulseAnim:He,unreadPulseAnim:Oe,runClearAllWithAnimation:qt,settingsPage:P,setSettingsPage:ie,isAboutOpen:re,setIsAboutOpen:Pe,resetToDefaults:Ee,closeModal:he,minimizeInspector:We,detailTitle:Fe,activeTab:V,environment:pe,selectedCrash:M,setSelectedCrash:Ue,selectedPush:k,setSelectedPush:Ne,selectedSocket:z,setSelectedSocket:je,refreshMediaCount:U,peekMode:oe,setPeekMode:Ge,previewMediaItem:me,setPreviewMediaItem:N}=Tt(),{width:Q}=et(),e=Q<360,j=Q<400,[_e,ae]=B.useState(!1),[Qt,Jt]=B.useState(!1),[qe,fe]=B.useState(!1),[Qe]=B.useState(()=>Dt().formatted),be=Z(()=>{const T=ge||Nt();return ke.find(x=>x.code===T)||ke[0]},[ge]),[J,K]=B.useState(!1),[Kt,le]=B.useState(0),E=B.useRef(null);B.useEffect(()=>{W.isRecording().then(T=>{K(T)}).catch(()=>{})},[]),B.useEffect(()=>(J?(le(0),E.current=setInterval(()=>{le(T=>T+1)},1e3)):(E.current&&(clearInterval(E.current),E.current=null),le(0)),()=>{E.current&&clearInterval(E.current)}),[J]);const Xt=B.useCallback(async()=>{try{O("light");const T=await W.takeScreenshot({format:"png",quality:.9,hideInspector:!0});if(T){O("success");const x=ue("screenshot",T.format||"png"),A={id:x,type:"image",format:T.format,uri:T.uri,filename:T.uri.split("/").pop()||x,sizeBytes:T.sizeBytes,timestamp:T.timestamp,width:T.width,height:T.height};N(A),U?.().catch(()=>{}),H(I("header.screenshotCaptured"))}else H(I("header.screenshotFailed"))}catch{H(I("header.screenshotError"))}},[U,I]),Yt=B.useCallback(async()=>{try{if(J){O("medium");const T=await W.stopRecording();if(K(!1),T){O("success");const x=ue("video",T.format),A={id:x,type:T.format==="gif"?"gif":"video",format:T.format,uri:T.uri,filename:T.uri.split("/").pop()||x,sizeBytes:T.sizeBytes,timestamp:T.timestamp,durationMs:T.durationMs,width:T.width,height:T.height,hasAudio:T.hasAudio};N(A),U?.().catch(()=>{}),H(I("header.recordingSaved",{duration:(T.durationMs/1e3).toFixed(1)}))}}else O("medium"),await W.startRecording({fps:24,audioSource:"none"})?(K(!0),H(I("header.recordingStarted"))):H(I("header.recordingStartFailed"))}catch{H(I("header.recordingError")),K(!1)}},[J,I]),Zt=T=>{const x=Math.floor(T/60),A=T%60;return`${x.toString().padStart(2,"0")}:${A.toString().padStart(2,"0")}`},ei=Z(()=>{const T=(pe||(__DEV__?"DEV":"PROD")).trim(),x=T.toUpperCase();return x==="DEV"||x.includes("DEV")||x==="LOCAL"?{label:T,bg:`${t.emerald500}40`,border:`${t.emerald400}8C`,text:t.mintGreenBorder}:x==="UAT"||x==="QA"||x==="TEST"?{label:T,bg:`${t.amber500}47`,border:`${t.amber400}99`,text:t.amberWarmBorder}:x==="PREPROD"||x==="STAGE"||x==="STAGING"?{label:T,bg:`${t.purple500}47`,border:`${t.purple400}99`,text:t.violetSoftBorder}:{label:T,bg:`${t.rose500}40`,border:`${t.roseBorder}8C`,text:t.errorBorder}},[pe]),X=V==="apis"&&R!=null||V==="analytics"&&$!=null||V==="logs"&&L!=null||V==="redux"&&(F!=null||q!=null)||V==="crash"&&M!=null||V==="push"&&k!=null||V==="socket"&&z!=null,Y=P!==null,ne=X||Y||re,Je=Z(()=>{switch(P){case"apis":return"APIs (Network)";case"logs":return"Console Logs";case"crash":return"Crash Protection";case"analytics":return"Analytics Logger";case"redux":return"Redux Inspector";case"media":return"Screencast (Media)";case"push":return"Push Notifications";default:return"Settings & Modules"}},[P]),ye=Z(()=>se.OS==="ios"?ee>=98?Q>=390?50:44:0:se.OS==="android"&&ee>=98?Ze.currentHeight||24:0,[ee,Q]),v=e?25:j?26.5:27,ti=e?36:j?38:40;return<>
|
|
2
2
|
<S style={[i.headerGradient,{minHeight:(e?44:48)+ye}]}>
|
|
3
3
|
|
|
4
4
|
<St colors={[t.indigo600,t.violet600]}start={{x:0,y:0}}end={{x:1,y:1}}style={{position:"absolute",top:0,left:0,right:0,bottom:0,borderTopLeftRadius:20,borderTopRightRadius:20}}pointerEvents="none"/>
|
|
5
5
|
<S style={{paddingTop:ye,width:"100%"}}>
|
|
6
6
|
<S style={[i.header,{width:"100%",justifyContent:"space-between",paddingHorizontal:e?10:12,paddingVertical:5.5,minHeight:e?44:48}]}>
|
|
7
7
|
<S style={{flexDirection:"row",alignItems:"center",gap:e?7:8,flex:X?void 0:1,flexShrink:X?0:1,minWidth:0}}>
|
|
8
|
-
{ne&&<G onPress={()=>{if(re){Pe(!1);return}if(Y){ie(P==="main"?null:"main");return}Re(null),Ie(null),Me(null)
|
|
8
|
+
{ne&&<G onPress={()=>{if(re){Pe(!1);return}if(Y){ie(P==="main"?null:"main");return}Re(null),Ie(null),Me(null),Be(null),$e(null),Ue(null),Ne(null),je(null)}}hitSlop={15}style={{width:e?32:36,height:e?32:36,borderRadius:e?16:18,alignItems:"center",justifyContent:"center",backgroundColor:`${t.white}2E`,borderWidth:1,borderColor:`${t.white}4D`}}>
|
|
9
9
|
<S style={{position:"absolute",width:e?40:44,height:e?40:44,borderRadius:22,backgroundColor:`${t.white}1A`}}/>
|
|
10
|
-
|
|
10
|
+
<$t/>
|
|
11
11
|
</G>}
|
|
12
12
|
|
|
13
13
|
{re?<S style={{gap:3,flex:1,minWidth:0,justifyContent:"center"}}>
|
|
@@ -50,7 +50,7 @@ import $,{useMemo as Z}from"react";import{Alert as Ke,Animated as Xe,Linking as
|
|
|
50
50
|
<S style={{flexDirection:"row",alignItems:"center",gap:4.5,minWidth:0,marginTop:1.5}}>
|
|
51
51
|
|
|
52
52
|
<G onPress={()=>{O("light"),fe(!0)}}hitSlop={6}accessible={!0}accessibilityRole="button"accessibilityLabel={I("settings.general.selectLanguage","Select Language")}style={{flexDirection:"row",alignItems:"center",backgroundColor:`${t.white}24`,borderRadius:5,paddingHorizontal:5.5,paddingVertical:2,gap:3.5,borderWidth:1,borderColor:`${t.white}38`,flexShrink:0}}>
|
|
53
|
-
|
|
53
|
+
<Bt code={be?.code||"en"}size={9.5}borderRadius={2}/>
|
|
54
54
|
<C style={{fontFamily:D.interBold,fontSize:8.5,lineHeight:11,color:t.white,letterSpacing:.2}}numberOfLines={1}>
|
|
55
55
|
{be?.code?.toUpperCase()||"EN"}
|
|
56
56
|
</C>
|
|
@@ -121,25 +121,25 @@ import $,{useMemo as Z}from"react";import{Alert as Ke,Animated as Xe,Linking as
|
|
|
121
121
|
</C>
|
|
122
122
|
</S>}
|
|
123
123
|
</S>
|
|
124
|
-
</S>:V==="analytics"
|
|
124
|
+
</S>:V==="analytics"&&$!=null?<S style={i.headerDetailCenter}>
|
|
125
125
|
<S style={i.headerDetailRow}>
|
|
126
|
-
<S style={[i.headerMethodBadge,{backgroundColor
|
|
126
|
+
<S style={[i.headerMethodBadge,{backgroundColor:$.source==="firebase"?`${t.firebaseOrange}4D`:`${t.purple}4D`,paddingHorizontal:e?5:6,paddingVertical:e?2:3}]}>
|
|
127
127
|
<C style={[i.headerMethodText,{fontSize:e?9:10}]}>
|
|
128
|
-
{
|
|
128
|
+
{$.source==="firebase"?"FB":"MAN"}
|
|
129
129
|
</C>
|
|
130
130
|
</S>
|
|
131
131
|
<C style={[i.headerDetailTitle,{fontSize:e?13.5:15}]}numberOfLines={1}ellipsizeMode="middle">
|
|
132
|
-
#{
|
|
133
|
-
{
|
|
132
|
+
#{$.id!=null?$.id+1:1}{" "}
|
|
133
|
+
{$.name}
|
|
134
134
|
</C>
|
|
135
135
|
</S>
|
|
136
136
|
<S style={{flexDirection:"row",alignItems:"center",gap:e?4:6,marginTop:3,paddingVertical:1}}>
|
|
137
|
-
<S style={[i.headerStatusDot,{backgroundColor
|
|
137
|
+
<S style={[i.headerStatusDot,{backgroundColor:$.source==="firebase"?t.firebaseOrange:t.purple,width:e?6:7,height:e?6:7}]}/>
|
|
138
138
|
<C style={[i.headerSubTitle,{fontSize:e?10:11}]}>
|
|
139
|
-
{Object.keys(
|
|
140
|
-
{Object.keys(
|
|
139
|
+
{Object.keys($.params).length} param
|
|
140
|
+
{Object.keys($.params).length!==1?"s":""}
|
|
141
141
|
{" \xB7 "}
|
|
142
|
-
{
|
|
142
|
+
{$.source}
|
|
143
143
|
</C>
|
|
144
144
|
</S>
|
|
145
145
|
</S>:V==="logs"&&L!=null?<S style={i.headerDetailCenter}>
|
|
@@ -321,12 +321,12 @@ import $,{useMemo as Z}from"react";import{Alert as Ke,Animated as Xe,Linking as
|
|
|
321
321
|
</>}
|
|
322
322
|
|
|
323
323
|
|
|
324
|
-
<Te onPress={We||he}hitSlop={{top:12,bottom:12,left:12,right:12}}activeOpacity={.7}accessibilityRole="button"accessibilityLabel={I("common.minimize","Minimize")}style={[i.closeButtonSquare,{width:v,height:v,borderRadius:e?6:7,backgroundColor:"rgba(56, 189, 248, 0.22)",borderColor:"rgba(125, 211, 252, 0.40)",borderWidth:1}]}>
|
|
324
|
+
<Te testID="inspector.header.minimizeBtn"onPress={We||he}hitSlop={{top:12,bottom:12,left:12,right:12}}activeOpacity={.7}accessibilityRole="button"accessibilityLabel={I("common.minimize","Minimize")}style={[i.closeButtonSquare,{width:v,height:v,borderRadius:e?6:7,backgroundColor:"rgba(56, 189, 248, 0.22)",borderColor:"rgba(125, 211, 252, 0.40)",borderWidth:1}]}>
|
|
325
325
|
<Ve size={e?14:16}color={t.white}/>
|
|
326
326
|
</Te>
|
|
327
327
|
|
|
328
328
|
|
|
329
|
-
<Te onPress={he}hitSlop={{top:12,bottom:12,left:12,right:12}}activeOpacity={.7}accessibilityRole="button"accessibilityLabel={I("common.close","Close")}style={[i.closeButtonSquare,{width:v,height:v,borderRadius:e?6:7,backgroundColor:"rgba(244, 63, 94, 0.28)",borderColor:"rgba(251, 113, 133, 0.48)",borderWidth:1}]}>
|
|
329
|
+
<Te testID="inspector.header.closeBtn"onPress={he}hitSlop={{top:12,bottom:12,left:12,right:12}}activeOpacity={.7}accessibilityRole="button"accessibilityLabel={I("common.close","Close")}style={[i.closeButtonSquare,{width:v,height:v,borderRadius:e?6:7,backgroundColor:"rgba(244, 63, 94, 0.28)",borderColor:"rgba(251, 113, 133, 0.48)",borderWidth:1}]}>
|
|
330
330
|
<At size={e?12:14}/>
|
|
331
331
|
</Te>
|
|
332
332
|
</S>
|