react-native-inapp-inspector 1.0.14 → 1.0.15

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.
@@ -146,7 +146,7 @@ const NavigationTracker = ({ onStateChange }) => {
146
146
  }, [navState, onStateChange]);
147
147
  return null;
148
148
  };
149
- const NetworkInspector = ({ enabled = true }) => {
149
+ const NetworkInspector = ({ enabled = true, }) => {
150
150
  const [isDark, setIsDark] = (0, react_1.useState)(false);
151
151
  const [reduxState, setReduxState] = (0, react_1.useState)(null);
152
152
  const [expandedReducers, setExpandedReducers] = (0, react_1.useState)({});
@@ -161,16 +161,11 @@ const NetworkInspector = ({ enabled = true }) => {
161
161
  const [reduxActiveSubTab, setReduxActiveSubTab] = (0, react_1.useState)('timeline');
162
162
  const [apiDetailActiveTab, setApiDetailActiveTab] = (0, react_1.useState)('response');
163
163
  (0, react_1.useEffect)(() => {
164
- if (enabled && visible) {
165
- react_native_1.LogBox.ignoreAllLogs(true);
166
- }
167
- else {
168
- react_native_1.LogBox.ignoreAllLogs(false);
169
- }
164
+ react_native_1.LogBox.ignoreAllLogs(enabled);
170
165
  return () => {
171
166
  react_native_1.LogBox.ignoreAllLogs(false);
172
167
  };
173
- }, [enabled, visible]);
168
+ }, [enabled]);
174
169
  (0, react_1.useEffect)(() => {
175
170
  if (selected) {
176
171
  setApiDetailActiveTab('response');
@@ -432,7 +427,7 @@ const NetworkInspector = ({ enabled = true }) => {
432
427
  (0, networkLogger_1.setupNetworkLogger)();
433
428
  (0, networkLogger_1.clearNetworkLogs)();
434
429
  (0, consoleLogger_1.setupConsoleLogger)();
435
- // Note: setupAnalyticsLogger(analytics()) is called by the consumer at app startup
430
+ (0, analyticsLogger_1.autoSetupAnalyticsLogger)();
436
431
  let timeoutId;
437
432
  const unsubscribe = (0, networkLogger_1.subscribeNetworkLogs)((raw) => {
438
433
  clearTimeout(timeoutId);
@@ -988,8 +983,21 @@ const NetworkInspector = ({ enabled = true }) => {
988
983
  <NetworkIcons_1.WhiteBackNavigation color="#FFFFFF" size={16}/>
989
984
  </TouchableScale_1.default>
990
985
  <react_native_1.View style={{ flex: 1 }}>
991
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 17, color: '#FFFFFF' }}>Settings</react_native_1.Text>
992
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 11, color: 'rgba(255,255,255,0.75)', marginTop: 1 }}>Manage modules and preferences</react_native_1.Text>
986
+ <react_native_1.Text style={{
987
+ fontFamily: AppFonts_1.AppFonts.interBold,
988
+ fontSize: 17,
989
+ color: '#FFFFFF',
990
+ }}>
991
+ Settings
992
+ </react_native_1.Text>
993
+ <react_native_1.Text style={{
994
+ fontFamily: AppFonts_1.AppFonts.interRegular,
995
+ fontSize: 11,
996
+ color: 'rgba(255,255,255,0.75)',
997
+ marginTop: 1,
998
+ }}>
999
+ Manage modules and preferences
1000
+ </react_native_1.Text>
993
1001
  </react_native_1.View>
994
1002
  <react_native_1.View style={{
995
1003
  backgroundColor: 'rgba(255, 255, 255, 0.15)',
@@ -997,17 +1005,28 @@ const NetworkInspector = ({ enabled = true }) => {
997
1005
  paddingVertical: 4,
998
1006
  borderRadius: 8,
999
1007
  borderWidth: 1,
1000
- borderColor: 'rgba(255, 255, 255, 0.1)'
1008
+ borderColor: 'rgba(255, 255, 255, 0.1)',
1009
+ }}>
1010
+ <react_native_1.Text style={{
1011
+ fontFamily: AppFonts_1.AppFonts.interBold,
1012
+ fontSize: 10.5,
1013
+ color: '#FFFFFF',
1001
1014
  }}>
1002
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10.5, color: '#FFFFFF' }}>v1.0.13</react_native_1.Text>
1015
+ v1.0.13
1016
+ </react_native_1.Text>
1003
1017
  </react_native_1.View>
1004
1018
  </react_native_1.View>
1005
1019
  </react_native_linear_gradient_1.default>
1006
1020
 
1007
1021
  <react_native_1.ScrollView style={{ flex: 1 }} contentContainerStyle={{ padding: 16, gap: 12 }}>
1008
-
1009
1022
  {/* Tab list */}
1010
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, overflow: 'hidden' }}>
1023
+ <react_native_1.View style={{
1024
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1025
+ borderRadius: 12,
1026
+ borderWidth: 1,
1027
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1028
+ overflow: 'hidden',
1029
+ }}>
1011
1030
  {/* Table Header */}
1012
1031
  <react_native_1.View style={{
1013
1032
  flexDirection: 'row',
@@ -1019,8 +1038,26 @@ const NetworkInspector = ({ enabled = true }) => {
1019
1038
  borderBottomColor: AppColors_1.AppColors.dividerColor,
1020
1039
  gap: 12,
1021
1040
  }}>
1022
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, letterSpacing: 0.6, flex: 1 }}>MODULE</react_native_1.Text>
1023
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, letterSpacing: 0.6, width: 90, textAlign: 'right', paddingRight: 4 }}>VISIBILITY</react_native_1.Text>
1041
+ <react_native_1.Text style={{
1042
+ fontFamily: AppFonts_1.AppFonts.interBold,
1043
+ fontSize: 10,
1044
+ color: AppColors_1.AppColors.grayTextWeak,
1045
+ letterSpacing: 0.6,
1046
+ flex: 1,
1047
+ }}>
1048
+ MODULE
1049
+ </react_native_1.Text>
1050
+ <react_native_1.Text style={{
1051
+ fontFamily: AppFonts_1.AppFonts.interBold,
1052
+ fontSize: 10,
1053
+ color: AppColors_1.AppColors.grayTextWeak,
1054
+ letterSpacing: 0.6,
1055
+ width: 90,
1056
+ textAlign: 'right',
1057
+ paddingRight: 4,
1058
+ }}>
1059
+ VISIBILITY
1060
+ </react_native_1.Text>
1024
1061
  </react_native_1.View>
1025
1062
 
1026
1063
  {settingsTabs.map((tab, idx) => {
@@ -1037,27 +1074,53 @@ const NetworkInspector = ({ enabled = true }) => {
1037
1074
  gap: 12,
1038
1075
  }}>
1039
1076
  {/* Icon + Label — fills remaining space */}
1040
- <react_native_1.View style={{ flex: 1, flexDirection: 'row', alignItems: 'center', gap: 8 }}>
1077
+ <react_native_1.View style={{
1078
+ flex: 1,
1079
+ flexDirection: 'row',
1080
+ alignItems: 'center',
1081
+ gap: 8,
1082
+ }}>
1041
1083
  {/* Small icon tile */}
1042
1084
  <react_native_1.View style={{
1043
- width: 20, height: 20, borderRadius: 6,
1044
- backgroundColor: isLocked ? AppColors_1.AppColors.grayBorderSecondary : AppColors_1.AppColors.purpleShade50,
1085
+ width: 20,
1086
+ height: 20,
1087
+ borderRadius: 6,
1088
+ backgroundColor: isLocked
1089
+ ? AppColors_1.AppColors.grayBorderSecondary
1090
+ : AppColors_1.AppColors.purpleShade50,
1045
1091
  borderWidth: 1,
1046
- borderColor: isLocked ? AppColors_1.AppColors.dividerColor : 'rgba(104,75,155,0.2)',
1047
- alignItems: 'center', justifyContent: 'center',
1092
+ borderColor: isLocked
1093
+ ? AppColors_1.AppColors.dividerColor
1094
+ : 'rgba(104,75,155,0.2)',
1095
+ alignItems: 'center',
1096
+ justifyContent: 'center',
1048
1097
  }}>
1049
- {tab.icon === 'insights' && <NetworkIcons_1.InsightsIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1050
- {tab.icon === 'apis' && <NetworkIcons_1.SignalIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1051
- {tab.icon === 'logs' && <NetworkIcons_1.TerminalIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1052
- {tab.icon === 'analytics' && <NetworkIcons_1.AnalyticsIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1053
- {tab.icon === 'webview' && <NetworkIcons_1.GlobeIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1054
- {tab.icon === 'redux' && <NetworkIcons_1.TerminalIcon color={isLocked ? AppColors_1.AppColors.grayTextWeak : AppColors_1.AppColors.purple} size={11}/>}
1098
+ {tab.icon === 'insights' && (<NetworkIcons_1.InsightsIcon color={isLocked
1099
+ ? AppColors_1.AppColors.grayTextWeak
1100
+ : AppColors_1.AppColors.purple} size={11}/>)}
1101
+ {tab.icon === 'apis' && (<NetworkIcons_1.SignalIcon color={isLocked
1102
+ ? AppColors_1.AppColors.grayTextWeak
1103
+ : AppColors_1.AppColors.purple} size={11}/>)}
1104
+ {tab.icon === 'logs' && (<NetworkIcons_1.TerminalIcon color={isLocked
1105
+ ? AppColors_1.AppColors.grayTextWeak
1106
+ : AppColors_1.AppColors.purple} size={11}/>)}
1107
+ {tab.icon === 'analytics' && (<NetworkIcons_1.AnalyticsIcon color={isLocked
1108
+ ? AppColors_1.AppColors.grayTextWeak
1109
+ : AppColors_1.AppColors.purple} size={11}/>)}
1110
+ {tab.icon === 'webview' && (<NetworkIcons_1.GlobeIcon color={isLocked
1111
+ ? AppColors_1.AppColors.grayTextWeak
1112
+ : AppColors_1.AppColors.purple} size={11}/>)}
1113
+ {tab.icon === 'redux' && (<NetworkIcons_1.TerminalIcon color={isLocked
1114
+ ? AppColors_1.AppColors.grayTextWeak
1115
+ : AppColors_1.AppColors.purple} size={11}/>)}
1055
1116
  </react_native_1.View>
1056
1117
  {/* Label + Required badge */}
1057
1118
  <react_native_1.Text style={{
1058
1119
  fontFamily: AppFonts_1.AppFonts.interBold,
1059
1120
  fontSize: 13,
1060
- color: isLocked ? AppColors_1.AppColors.grayText : AppColors_1.AppColors.primaryBlack,
1121
+ color: isLocked
1122
+ ? AppColors_1.AppColors.grayText
1123
+ : AppColors_1.AppColors.primaryBlack,
1061
1124
  }}>
1062
1125
  {tab.label}
1063
1126
  </react_native_1.Text>
@@ -1072,8 +1135,19 @@ const NetworkInspector = ({ enabled = true }) => {
1072
1135
  borderColor: 'rgba(104,75,155,0.18)',
1073
1136
  gap: 3,
1074
1137
  }}>
1075
- <react_native_1.View style={{ width: 4, height: 4, borderRadius: 2, backgroundColor: AppColors_1.AppColors.purple, opacity: 0.7 }}/>
1076
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 8.5, color: AppColors_1.AppColors.purple, letterSpacing: 0.4 }}>
1138
+ <react_native_1.View style={{
1139
+ width: 4,
1140
+ height: 4,
1141
+ borderRadius: 2,
1142
+ backgroundColor: AppColors_1.AppColors.purple,
1143
+ opacity: 0.7,
1144
+ }}/>
1145
+ <react_native_1.Text style={{
1146
+ fontFamily: AppFonts_1.AppFonts.interBold,
1147
+ fontSize: 8.5,
1148
+ color: AppColors_1.AppColors.purple,
1149
+ letterSpacing: 0.4,
1150
+ }}>
1077
1151
  DEFAULT
1078
1152
  </react_native_1.Text>
1079
1153
  </react_native_1.View>)}
@@ -1094,12 +1168,18 @@ const NetworkInspector = ({ enabled = true }) => {
1094
1168
  </react_native_1.View>
1095
1169
 
1096
1170
  {/* Visibility Switch in VISIBILITY column */}
1097
- <react_native_1.View style={{ width: 90, alignItems: 'flex-end', justifyContent: 'center' }}>
1171
+ <react_native_1.View style={{
1172
+ width: 90,
1173
+ alignItems: 'flex-end',
1174
+ justifyContent: 'center',
1175
+ }}>
1098
1176
  <TouchableScale_1.default disabled={isLocked} onPress={() => toggleTabVisibility(tab.key)} style={{
1099
1177
  width: 38,
1100
1178
  height: 22,
1101
1179
  borderRadius: 11,
1102
- backgroundColor: isVisible ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayBorderSecondary,
1180
+ backgroundColor: isVisible
1181
+ ? AppColors_1.AppColors.purple
1182
+ : AppColors_1.AppColors.grayBorderSecondary,
1103
1183
  padding: 2,
1104
1184
  justifyContent: 'center',
1105
1185
  alignItems: isVisible ? 'flex-end' : 'flex-start',
@@ -1122,8 +1202,22 @@ const NetworkInspector = ({ enabled = true }) => {
1122
1202
 
1123
1203
  {/* Preferences Section */}
1124
1204
  <react_native_1.View style={{ marginTop: 8 }}>
1125
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, letterSpacing: 0.6, marginBottom: 8 }}>PREFERENCES</react_native_1.Text>
1126
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, overflow: 'hidden' }}>
1205
+ <react_native_1.Text style={{
1206
+ fontFamily: AppFonts_1.AppFonts.interBold,
1207
+ fontSize: 10,
1208
+ color: AppColors_1.AppColors.grayTextWeak,
1209
+ letterSpacing: 0.6,
1210
+ marginBottom: 8,
1211
+ }}>
1212
+ PREFERENCES
1213
+ </react_native_1.Text>
1214
+ <react_native_1.View style={{
1215
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1216
+ borderRadius: 12,
1217
+ borderWidth: 1,
1218
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1219
+ overflow: 'hidden',
1220
+ }}>
1127
1221
  <react_native_1.View style={{
1128
1222
  flexDirection: 'row',
1129
1223
  alignItems: 'center',
@@ -1132,13 +1226,21 @@ const NetworkInspector = ({ enabled = true }) => {
1132
1226
  gap: 12,
1133
1227
  }}>
1134
1228
  {/* Icon + Label */}
1135
- <react_native_1.View style={{ flex: 1, flexDirection: 'row', alignItems: 'center', gap: 8 }}>
1229
+ <react_native_1.View style={{
1230
+ flex: 1,
1231
+ flexDirection: 'row',
1232
+ alignItems: 'center',
1233
+ gap: 8,
1234
+ }}>
1136
1235
  <react_native_1.View style={{
1137
- width: 20, height: 20, borderRadius: 6,
1236
+ width: 20,
1237
+ height: 20,
1238
+ borderRadius: 6,
1138
1239
  backgroundColor: AppColors_1.AppColors.purpleShade50,
1139
1240
  borderWidth: 1,
1140
1241
  borderColor: 'rgba(104,75,155,0.2)',
1141
- alignItems: 'center', justifyContent: 'center',
1242
+ alignItems: 'center',
1243
+ justifyContent: 'center',
1142
1244
  }}>
1143
1245
  {isDark ? (<NetworkIcons_1.SunIcon color={AppColors_1.AppColors.purple} size={11}/>) : (<NetworkIcons_1.MoonIcon color={AppColors_1.AppColors.purple} size={11}/>)}
1144
1246
  </react_native_1.View>
@@ -1162,7 +1264,9 @@ const NetworkInspector = ({ enabled = true }) => {
1162
1264
  width: 38,
1163
1265
  height: 22,
1164
1266
  borderRadius: 11,
1165
- backgroundColor: isDark ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayBorderSecondary,
1267
+ backgroundColor: isDark
1268
+ ? AppColors_1.AppColors.purple
1269
+ : AppColors_1.AppColors.grayBorderSecondary,
1166
1270
  padding: 2,
1167
1271
  justifyContent: 'center',
1168
1272
  alignItems: isDark ? 'flex-end' : 'flex-start',
@@ -1207,14 +1311,23 @@ const NetworkInspector = ({ enabled = true }) => {
1207
1311
  <NetworkIcons_1.WhiteBackNavigation color={AppColors_1.AppColors.purple} size={16}/>
1208
1312
  </TouchableScale_1.default>
1209
1313
  {icon && (<react_native_1.View style={{
1210
- width: 36, height: 36, borderRadius: 10,
1314
+ width: 36,
1315
+ height: 36,
1316
+ borderRadius: 10,
1211
1317
  backgroundColor: AppColors_1.AppColors.purpleShade50,
1212
- borderWidth: 1, borderColor: 'rgba(104,75,155,0.2)',
1213
- alignItems: 'center', justifyContent: 'center',
1318
+ borderWidth: 1,
1319
+ borderColor: 'rgba(104,75,155,0.2)',
1320
+ alignItems: 'center',
1321
+ justifyContent: 'center',
1214
1322
  }}>
1215
1323
  {icon}
1216
1324
  </react_native_1.View>)}
1217
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 18, color: AppColors_1.AppColors.primaryBlack, flex: 1 }}>
1325
+ <react_native_1.Text style={{
1326
+ fontFamily: AppFonts_1.AppFonts.interBold,
1327
+ fontSize: 18,
1328
+ color: AppColors_1.AppColors.primaryBlack,
1329
+ flex: 1,
1330
+ }}>
1218
1331
  {title}
1219
1332
  </react_native_1.Text>
1220
1333
  {rightInfo ? (<react_native_1.View style={{
@@ -1225,7 +1338,11 @@ const NetworkInspector = ({ enabled = true }) => {
1225
1338
  borderWidth: 1,
1226
1339
  borderColor: 'rgba(104,75,155,0.15)',
1227
1340
  }}>
1228
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.purple }}>
1341
+ <react_native_1.Text style={{
1342
+ fontFamily: AppFonts_1.AppFonts.interBold,
1343
+ fontSize: 11,
1344
+ color: AppColors_1.AppColors.purple,
1345
+ }}>
1229
1346
  {rightInfo}
1230
1347
  </react_native_1.Text>
1231
1348
  </react_native_1.View>) : null}
@@ -1242,18 +1359,31 @@ const NetworkInspector = ({ enabled = true }) => {
1242
1359
  gap: 12,
1243
1360
  }}>
1244
1361
  <react_native_1.View style={{
1245
- width: 36, height: 36, borderRadius: 10,
1362
+ width: 36,
1363
+ height: 36,
1364
+ borderRadius: 10,
1246
1365
  backgroundColor: AppColors_1.AppColors.purpleShade50,
1247
- borderWidth: 1, borderColor: 'rgba(104,75,155,0.18)',
1248
- alignItems: 'center', justifyContent: 'center',
1366
+ borderWidth: 1,
1367
+ borderColor: 'rgba(104,75,155,0.18)',
1368
+ alignItems: 'center',
1369
+ justifyContent: 'center',
1249
1370
  }}>
1250
1371
  {opts.icon}
1251
1372
  </react_native_1.View>
1252
1373
  <react_native_1.View style={{ flex: 1 }}>
1253
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 14, color: AppColors_1.AppColors.primaryBlack }}>
1374
+ <react_native_1.Text style={{
1375
+ fontFamily: AppFonts_1.AppFonts.interBold,
1376
+ fontSize: 14,
1377
+ color: AppColors_1.AppColors.primaryBlack,
1378
+ }}>
1254
1379
  {opts.label}
1255
1380
  </react_native_1.Text>
1256
- {opts.description ? (<react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 11, color: AppColors_1.AppColors.grayText, marginTop: 1 }}>
1381
+ {opts.description ? (<react_native_1.Text style={{
1382
+ fontFamily: AppFonts_1.AppFonts.interRegular,
1383
+ fontSize: 11,
1384
+ color: AppColors_1.AppColors.grayText,
1385
+ marginTop: 1,
1386
+ }}>
1257
1387
  {opts.description}
1258
1388
  </react_native_1.Text>) : null}
1259
1389
  </react_native_1.View>
@@ -1275,14 +1405,20 @@ const NetworkInspector = ({ enabled = true }) => {
1275
1405
  paddingVertical: 6,
1276
1406
  alignItems: 'center',
1277
1407
  borderRadius: 6,
1278
- backgroundColor: isActive ? AppColors_1.AppColors.purple : 'transparent',
1408
+ backgroundColor: isActive
1409
+ ? AppColors_1.AppColors.purple
1410
+ : 'transparent',
1279
1411
  }}>
1280
1412
  <react_native_1.Text style={{
1281
1413
  fontFamily: AppFonts_1.AppFonts.interBold,
1282
1414
  fontSize: 11,
1283
1415
  color: isActive ? '#FFFFFF' : AppColors_1.AppColors.grayText,
1284
1416
  }}>
1285
- {typeof opt === 'number' && opt >= 500 && settingsPage === 'insights' ? `${opt}ms` : opt}
1417
+ {typeof opt === 'number' &&
1418
+ opt >= 500 &&
1419
+ settingsPage === 'insights'
1420
+ ? `${opt}ms`
1421
+ : opt}
1286
1422
  </react_native_1.Text>
1287
1423
  </TouchableScale_1.default>);
1288
1424
  })}
@@ -1291,7 +1427,14 @@ const NetworkInspector = ({ enabled = true }) => {
1291
1427
  if (settingsPage === 'apis') {
1292
1428
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1293
1429
  {renderSubHeader('APIs Settings', <NetworkIcons_1.SignalIcon color={AppColors_1.AppColors.purple} size={16}/>, `Total: ${logs.length}`)}
1294
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1430
+ <react_native_1.View style={{
1431
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1432
+ padding: 16,
1433
+ borderRadius: 12,
1434
+ borderWidth: 1,
1435
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1436
+ gap: 4,
1437
+ }}>
1295
1438
  {renderSettingRow({
1296
1439
  icon: <NetworkIcons_1.SignalIcon color={AppColors_1.AppColors.purple} size={16}/>,
1297
1440
  label: 'Max Request Logs',
@@ -1305,7 +1448,14 @@ const NetworkInspector = ({ enabled = true }) => {
1305
1448
  })}
1306
1449
  </react_native_1.View>
1307
1450
 
1308
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, padding: 16, marginTop: 12 }}>
1451
+ <react_native_1.View style={{
1452
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1453
+ borderRadius: 12,
1454
+ borderWidth: 1,
1455
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1456
+ padding: 16,
1457
+ marginTop: 12,
1458
+ }}>
1309
1459
  {renderSettingRow({
1310
1460
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1311
1461
  label: 'Clear Network Logs',
@@ -1316,8 +1466,21 @@ const NetworkInspector = ({ enabled = true }) => {
1316
1466
  setSelected(null);
1317
1467
  react_native_1.Alert.alert('Success', 'Network logs cleared.');
1318
1468
  },
1319
- right: (<react_native_1.View style={{ paddingHorizontal: 10, paddingVertical: 5, borderRadius: 7, backgroundColor: 'rgba(255,46,87,0.08)', borderWidth: 1, borderColor: 'rgba(255,46,87,0.2)' }}>
1320
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.errorColor }}>Clear</react_native_1.Text>
1469
+ right: (<react_native_1.View style={{
1470
+ paddingHorizontal: 10,
1471
+ paddingVertical: 5,
1472
+ borderRadius: 7,
1473
+ backgroundColor: 'rgba(255,46,87,0.08)',
1474
+ borderWidth: 1,
1475
+ borderColor: 'rgba(255,46,87,0.2)',
1476
+ }}>
1477
+ <react_native_1.Text style={{
1478
+ fontFamily: AppFonts_1.AppFonts.interBold,
1479
+ fontSize: 11,
1480
+ color: AppColors_1.AppColors.errorColor,
1481
+ }}>
1482
+ Clear
1483
+ </react_native_1.Text>
1321
1484
  </react_native_1.View>),
1322
1485
  })}
1323
1486
  </react_native_1.View>
@@ -1326,7 +1489,14 @@ const NetworkInspector = ({ enabled = true }) => {
1326
1489
  if (settingsPage === 'logs') {
1327
1490
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1328
1491
  {renderSubHeader('Logs Settings', <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={16}/>, `Total: ${consoleLogs.length}`)}
1329
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1492
+ <react_native_1.View style={{
1493
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1494
+ padding: 16,
1495
+ borderRadius: 12,
1496
+ borderWidth: 1,
1497
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1498
+ gap: 4,
1499
+ }}>
1330
1500
  {renderSettingRow({
1331
1501
  icon: <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={16}/>,
1332
1502
  label: 'Max Console Logs',
@@ -1338,30 +1508,67 @@ const NetworkInspector = ({ enabled = true }) => {
1338
1508
  },
1339
1509
  })}
1340
1510
  <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
1341
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 13, color: AppColors_1.AppColors.primaryBlack, paddingTop: 4 }}>Log Levels</react_native_1.Text>
1511
+ <react_native_1.Text style={{
1512
+ fontFamily: AppFonts_1.AppFonts.interBold,
1513
+ fontSize: 13,
1514
+ color: AppColors_1.AppColors.primaryBlack,
1515
+ paddingTop: 4,
1516
+ }}>
1517
+ Log Levels
1518
+ </react_native_1.Text>
1342
1519
  {['info', 'warn', 'error'].map((level, li) => {
1343
1520
  const isLvlActive = showConsoleLevels[level];
1344
- const levelColor = level === 'error' ? AppColors_1.AppColors.errorColor : level === 'warn' ? AppColors_1.AppColors.warningIconGold : AppColors_1.AppColors.skyBlue;
1521
+ const levelColor = level === 'error'
1522
+ ? AppColors_1.AppColors.errorColor
1523
+ : level === 'warn'
1524
+ ? AppColors_1.AppColors.warningIconGold
1525
+ : AppColors_1.AppColors.skyBlue;
1345
1526
  return renderSettingRow({
1346
- icon: <react_native_1.View style={{ width: 10, height: 10, borderRadius: 5, backgroundColor: levelColor }}/>,
1527
+ icon: (<react_native_1.View style={{
1528
+ width: 10,
1529
+ height: 10,
1530
+ borderRadius: 5,
1531
+ backgroundColor: levelColor,
1532
+ }}/>),
1347
1533
  label: `Show ${level.charAt(0).toUpperCase() + level.slice(1)} logs`,
1348
- description: level === 'info' ? 'Informational messages' : level === 'warn' ? 'Warning messages' : 'Error messages',
1534
+ description: level === 'info'
1535
+ ? 'Informational messages'
1536
+ : level === 'warn'
1537
+ ? 'Warning messages'
1538
+ : 'Error messages',
1349
1539
  isLast: level === 'error',
1350
- onPress: () => setShowConsoleLevels(prev => ({ ...prev, [level]: !prev[level] })),
1540
+ onPress: () => setShowConsoleLevels(prev => ({
1541
+ ...prev,
1542
+ [level]: !prev[level],
1543
+ })),
1351
1544
  right: (<react_native_1.View style={{
1352
- width: 22, height: 22, borderRadius: 6,
1545
+ width: 22,
1546
+ height: 22,
1547
+ borderRadius: 6,
1353
1548
  borderWidth: 2,
1354
- borderColor: isLvlActive ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak,
1355
- backgroundColor: isLvlActive ? 'rgba(104, 75, 155, 0.1)' : 'transparent',
1356
- alignItems: 'center', justifyContent: 'center',
1549
+ borderColor: isLvlActive
1550
+ ? AppColors_1.AppColors.purple
1551
+ : AppColors_1.AppColors.grayTextWeak,
1552
+ backgroundColor: isLvlActive
1553
+ ? 'rgba(104, 75, 155, 0.1)'
1554
+ : 'transparent',
1555
+ alignItems: 'center',
1556
+ justifyContent: 'center',
1357
1557
  }}>
1358
- {isLvlActive && <NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>}
1558
+ {isLvlActive && (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>)}
1359
1559
  </react_native_1.View>),
1360
1560
  });
1361
1561
  })}
1362
1562
  </react_native_1.View>
1363
1563
 
1364
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, padding: 16, marginTop: 12 }}>
1564
+ <react_native_1.View style={{
1565
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1566
+ borderRadius: 12,
1567
+ borderWidth: 1,
1568
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1569
+ padding: 16,
1570
+ marginTop: 12,
1571
+ }}>
1365
1572
  {renderSettingRow({
1366
1573
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1367
1574
  label: 'Clear Console Logs',
@@ -1371,8 +1578,21 @@ const NetworkInspector = ({ enabled = true }) => {
1371
1578
  (0, consoleLogger_1.clearConsoleLogs)();
1372
1579
  react_native_1.Alert.alert('Success', 'Console logs cleared.');
1373
1580
  },
1374
- right: (<react_native_1.View style={{ paddingHorizontal: 10, paddingVertical: 5, borderRadius: 7, backgroundColor: 'rgba(255,46,87,0.08)', borderWidth: 1, borderColor: 'rgba(255,46,87,0.2)' }}>
1375
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.errorColor }}>Clear</react_native_1.Text>
1581
+ right: (<react_native_1.View style={{
1582
+ paddingHorizontal: 10,
1583
+ paddingVertical: 5,
1584
+ borderRadius: 7,
1585
+ backgroundColor: 'rgba(255,46,87,0.08)',
1586
+ borderWidth: 1,
1587
+ borderColor: 'rgba(255,46,87,0.2)',
1588
+ }}>
1589
+ <react_native_1.Text style={{
1590
+ fontFamily: AppFonts_1.AppFonts.interBold,
1591
+ fontSize: 11,
1592
+ color: AppColors_1.AppColors.errorColor,
1593
+ }}>
1594
+ Clear
1595
+ </react_native_1.Text>
1376
1596
  </react_native_1.View>),
1377
1597
  })}
1378
1598
  </react_native_1.View>
@@ -1381,7 +1601,14 @@ const NetworkInspector = ({ enabled = true }) => {
1381
1601
  if (settingsPage === 'analytics') {
1382
1602
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1383
1603
  {renderSubHeader('Analytics Settings', <NetworkIcons_1.AnalyticsIcon color={AppColors_1.AppColors.purple} size={16}/>, `Events: ${analyticsEvents.length}`)}
1384
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1604
+ <react_native_1.View style={{
1605
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1606
+ padding: 16,
1607
+ borderRadius: 12,
1608
+ borderWidth: 1,
1609
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1610
+ gap: 4,
1611
+ }}>
1385
1612
  {renderSettingRow({
1386
1613
  icon: <NetworkIcons_1.AnalyticsIcon color={AppColors_1.AppColors.purple} size={16}/>,
1387
1614
  label: 'Events Captured',
@@ -1389,7 +1616,14 @@ const NetworkInspector = ({ enabled = true }) => {
1389
1616
  isLast: true,
1390
1617
  })}
1391
1618
  </react_native_1.View>
1392
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, padding: 16, marginTop: 12 }}>
1619
+ <react_native_1.View style={{
1620
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1621
+ borderRadius: 12,
1622
+ borderWidth: 1,
1623
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1624
+ padding: 16,
1625
+ marginTop: 12,
1626
+ }}>
1393
1627
  {renderSettingRow({
1394
1628
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1395
1629
  label: 'Clear Analytics History',
@@ -1400,8 +1634,21 @@ const NetworkInspector = ({ enabled = true }) => {
1400
1634
  setSelectedEvent(null);
1401
1635
  react_native_1.Alert.alert('Success', 'Analytics events cleared.');
1402
1636
  },
1403
- right: (<react_native_1.View style={{ paddingHorizontal: 10, paddingVertical: 5, borderRadius: 7, backgroundColor: 'rgba(255,46,87,0.08)', borderWidth: 1, borderColor: 'rgba(255,46,87,0.2)' }}>
1404
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.errorColor }}>Clear</react_native_1.Text>
1637
+ right: (<react_native_1.View style={{
1638
+ paddingHorizontal: 10,
1639
+ paddingVertical: 5,
1640
+ borderRadius: 7,
1641
+ backgroundColor: 'rgba(255,46,87,0.08)',
1642
+ borderWidth: 1,
1643
+ borderColor: 'rgba(255,46,87,0.2)',
1644
+ }}>
1645
+ <react_native_1.Text style={{
1646
+ fontFamily: AppFonts_1.AppFonts.interBold,
1647
+ fontSize: 11,
1648
+ color: AppColors_1.AppColors.errorColor,
1649
+ }}>
1650
+ Clear
1651
+ </react_native_1.Text>
1405
1652
  </react_native_1.View>),
1406
1653
  })}
1407
1654
  </react_native_1.View>
@@ -1410,25 +1657,46 @@ const NetworkInspector = ({ enabled = true }) => {
1410
1657
  if (settingsPage === 'webview') {
1411
1658
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1412
1659
  {renderSubHeader('WebView Settings', <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={16}/>, `History: ${webViewNavHistory.length}`)}
1413
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1660
+ <react_native_1.View style={{
1661
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1662
+ padding: 16,
1663
+ borderRadius: 12,
1664
+ borderWidth: 1,
1665
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1666
+ gap: 4,
1667
+ }}>
1414
1668
  {renderSettingRow({
1415
1669
  icon: <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={16}/>,
1416
1670
  label: 'Capture CSS & JavaScript',
1417
1671
  description: 'Extract stylesheet and script source from pages',
1418
1672
  onPress: () => setWebViewCaptureCssJs(prev => !prev),
1419
1673
  right: (<react_native_1.View style={{
1420
- width: 22, height: 22, borderRadius: 6,
1674
+ width: 22,
1675
+ height: 22,
1676
+ borderRadius: 6,
1421
1677
  borderWidth: 2,
1422
- borderColor: webViewCaptureCssJs ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak,
1423
- backgroundColor: webViewCaptureCssJs ? 'rgba(104, 75, 155, 0.1)' : 'transparent',
1424
- alignItems: 'center', justifyContent: 'center',
1678
+ borderColor: webViewCaptureCssJs
1679
+ ? AppColors_1.AppColors.purple
1680
+ : AppColors_1.AppColors.grayTextWeak,
1681
+ backgroundColor: webViewCaptureCssJs
1682
+ ? 'rgba(104, 75, 155, 0.1)'
1683
+ : 'transparent',
1684
+ alignItems: 'center',
1685
+ justifyContent: 'center',
1425
1686
  }}>
1426
- {webViewCaptureCssJs && <NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>}
1687
+ {webViewCaptureCssJs && (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>)}
1427
1688
  </react_native_1.View>),
1428
1689
  isLast: true,
1429
1690
  })}
1430
1691
  </react_native_1.View>
1431
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, padding: 16, marginTop: 12 }}>
1692
+ <react_native_1.View style={{
1693
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1694
+ borderRadius: 12,
1695
+ borderWidth: 1,
1696
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1697
+ padding: 16,
1698
+ marginTop: 12,
1699
+ }}>
1432
1700
  {renderSettingRow({
1433
1701
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1434
1702
  label: 'Clear WebView Data',
@@ -1438,8 +1706,21 @@ const NetworkInspector = ({ enabled = true }) => {
1438
1706
  (0, webViewLogger_1.clearWebViewData)();
1439
1707
  react_native_1.Alert.alert('Success', 'WebView source history cleared.');
1440
1708
  },
1441
- right: (<react_native_1.View style={{ paddingHorizontal: 10, paddingVertical: 5, borderRadius: 7, backgroundColor: 'rgba(255,46,87,0.08)', borderWidth: 1, borderColor: 'rgba(255,46,87,0.2)' }}>
1442
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.errorColor }}>Clear</react_native_1.Text>
1709
+ right: (<react_native_1.View style={{
1710
+ paddingHorizontal: 10,
1711
+ paddingVertical: 5,
1712
+ borderRadius: 7,
1713
+ backgroundColor: 'rgba(255,46,87,0.08)',
1714
+ borderWidth: 1,
1715
+ borderColor: 'rgba(255,46,87,0.2)',
1716
+ }}>
1717
+ <react_native_1.Text style={{
1718
+ fontFamily: AppFonts_1.AppFonts.interBold,
1719
+ fontSize: 11,
1720
+ color: AppColors_1.AppColors.errorColor,
1721
+ }}>
1722
+ Clear
1723
+ </react_native_1.Text>
1443
1724
  </react_native_1.View>),
1444
1725
  })}
1445
1726
  </react_native_1.View>
@@ -1448,20 +1729,34 @@ const NetworkInspector = ({ enabled = true }) => {
1448
1729
  if (settingsPage === 'redux') {
1449
1730
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1450
1731
  {renderSubHeader('Redux Settings', <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={16}/>, `Reducers: ${Object.keys(reduxState || {}).length}`)}
1451
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1732
+ <react_native_1.View style={{
1733
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1734
+ padding: 16,
1735
+ borderRadius: 12,
1736
+ borderWidth: 1,
1737
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1738
+ gap: 4,
1739
+ }}>
1452
1740
  {renderSettingRow({
1453
1741
  icon: <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={16}/>,
1454
1742
  label: 'Auto-refresh Store',
1455
1743
  description: 'Automatically capture Redux store state updates',
1456
1744
  onPress: () => setReduxAutoRefreshState(prev => !prev),
1457
1745
  right: (<react_native_1.View style={{
1458
- width: 22, height: 22, borderRadius: 6,
1746
+ width: 22,
1747
+ height: 22,
1748
+ borderRadius: 6,
1459
1749
  borderWidth: 2,
1460
- borderColor: reduxAutoRefresh ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak,
1461
- backgroundColor: reduxAutoRefresh ? 'rgba(104, 75, 155, 0.1)' : 'transparent',
1462
- alignItems: 'center', justifyContent: 'center',
1750
+ borderColor: reduxAutoRefresh
1751
+ ? AppColors_1.AppColors.purple
1752
+ : AppColors_1.AppColors.grayTextWeak,
1753
+ backgroundColor: reduxAutoRefresh
1754
+ ? 'rgba(104, 75, 155, 0.1)'
1755
+ : 'transparent',
1756
+ alignItems: 'center',
1757
+ justifyContent: 'center',
1463
1758
  }}>
1464
- {reduxAutoRefresh && <NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>}
1759
+ {reduxAutoRefresh && (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>)}
1465
1760
  </react_native_1.View>),
1466
1761
  })}
1467
1762
  <react_native_1.View style={{ height: 1, backgroundColor: AppColors_1.AppColors.dividerColor }}/>
@@ -1478,18 +1773,40 @@ const NetworkInspector = ({ enabled = true }) => {
1478
1773
  })}
1479
1774
  </react_native_1.View>
1480
1775
 
1481
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, padding: 16, marginTop: 12 }}>
1776
+ <react_native_1.View style={{
1777
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1778
+ borderRadius: 12,
1779
+ borderWidth: 1,
1780
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1781
+ padding: 16,
1782
+ marginTop: 12,
1783
+ }}>
1482
1784
  {renderSettingRow({
1483
1785
  icon: <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={16}/>,
1484
1786
  label: 'Clear Redux State',
1485
- description: reduxState ? 'Reset state snapshot in inspector' : 'No store snapshot stored',
1787
+ description: reduxState
1788
+ ? 'Reset state snapshot in inspector'
1789
+ : 'No store snapshot stored',
1486
1790
  isLast: true,
1487
1791
  onPress: () => {
1488
1792
  setReduxState(null);
1489
1793
  react_native_1.Alert.alert('Success', 'Redux state snapshot cleared.');
1490
1794
  },
1491
- right: (<react_native_1.View style={{ paddingHorizontal: 10, paddingVertical: 5, borderRadius: 7, backgroundColor: 'rgba(255,46,87,0.08)', borderWidth: 1, borderColor: 'rgba(255,46,87,0.2)' }}>
1492
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 11, color: AppColors_1.AppColors.errorColor }}>Clear</react_native_1.Text>
1795
+ right: (<react_native_1.View style={{
1796
+ paddingHorizontal: 10,
1797
+ paddingVertical: 5,
1798
+ borderRadius: 7,
1799
+ backgroundColor: 'rgba(255,46,87,0.08)',
1800
+ borderWidth: 1,
1801
+ borderColor: 'rgba(255,46,87,0.2)',
1802
+ }}>
1803
+ <react_native_1.Text style={{
1804
+ fontFamily: AppFonts_1.AppFonts.interBold,
1805
+ fontSize: 11,
1806
+ color: AppColors_1.AppColors.errorColor,
1807
+ }}>
1808
+ Clear
1809
+ </react_native_1.Text>
1493
1810
  </react_native_1.View>),
1494
1811
  })}
1495
1812
  </react_native_1.View>
@@ -1498,7 +1815,14 @@ const NetworkInspector = ({ enabled = true }) => {
1498
1815
  // Default return page is Insights settings
1499
1816
  return (<react_native_1.ScrollView style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} contentContainerStyle={{ padding: 16 }}>
1500
1817
  {renderSubHeader('Insights Settings', <NetworkIcons_1.InsightsIcon color={AppColors_1.AppColors.purple} size={16}/>)}
1501
- <react_native_1.View style={{ backgroundColor: AppColors_1.AppColors.primaryLight, padding: 16, borderRadius: 12, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary, gap: 4 }}>
1818
+ <react_native_1.View style={{
1819
+ backgroundColor: AppColors_1.AppColors.primaryLight,
1820
+ padding: 16,
1821
+ borderRadius: 12,
1822
+ borderWidth: 1,
1823
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
1824
+ gap: 4,
1825
+ }}>
1502
1826
  {renderSettingRow({
1503
1827
  icon: <NetworkIcons_1.SignalIcon color={AppColors_1.AppColors.purple} size={16}/>,
1504
1828
  label: 'Slow Latency Warning',
@@ -1517,13 +1841,20 @@ const NetworkInspector = ({ enabled = true }) => {
1517
1841
  isLast: true,
1518
1842
  onPress: () => setInsightsShowConsoleAlerts(prev => !prev),
1519
1843
  right: (<react_native_1.View style={{
1520
- width: 22, height: 22, borderRadius: 6,
1844
+ width: 22,
1845
+ height: 22,
1846
+ borderRadius: 6,
1521
1847
  borderWidth: 2,
1522
- borderColor: insightsShowConsoleAlerts ? AppColors_1.AppColors.purple : AppColors_1.AppColors.grayTextWeak,
1523
- backgroundColor: insightsShowConsoleAlerts ? 'rgba(104, 75, 155, 0.1)' : 'transparent',
1524
- alignItems: 'center', justifyContent: 'center',
1848
+ borderColor: insightsShowConsoleAlerts
1849
+ ? AppColors_1.AppColors.purple
1850
+ : AppColors_1.AppColors.grayTextWeak,
1851
+ backgroundColor: insightsShowConsoleAlerts
1852
+ ? 'rgba(104, 75, 155, 0.1)'
1853
+ : 'transparent',
1854
+ alignItems: 'center',
1855
+ justifyContent: 'center',
1525
1856
  }}>
1526
- {insightsShowConsoleAlerts && <NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>}
1857
+ {insightsShowConsoleAlerts && (<NetworkIcons_1.CheckIcon size={12} color={AppColors_1.AppColors.purple}/>)}
1527
1858
  </react_native_1.View>),
1528
1859
  })}
1529
1860
  </react_native_1.View>
@@ -1531,10 +1862,14 @@ const NetworkInspector = ({ enabled = true }) => {
1531
1862
  };
1532
1863
  const renderInsightsDashboard = () => {
1533
1864
  const apiTotal = logs.length;
1534
- const apiErrors = logs.filter(l => (l.status != null && l.status >= 400) || l.status === 0 || l.status == null).length;
1865
+ const apiErrors = logs.filter(l => (l.status != null && l.status >= 400) ||
1866
+ l.status === 0 ||
1867
+ l.status == null).length;
1535
1868
  const apiSuccess = apiTotal - apiErrors;
1536
1869
  const apiSuccessRate = apiTotal > 0 ? Math.round((apiSuccess / apiTotal) * 100) : 100;
1537
- const durations = logs.filter(l => l.duration != null).map(l => l.duration);
1870
+ const durations = logs
1871
+ .filter(l => l.duration != null)
1872
+ .map(l => l.duration);
1538
1873
  const avgTime = durations.length > 0
1539
1874
  ? Math.round(durations.reduce((a, b) => a + b, 0) / durations.length)
1540
1875
  : null;
@@ -1544,7 +1879,9 @@ const NetworkInspector = ({ enabled = true }) => {
1544
1879
  const logInfos = visibleConsoleLogs.filter(l => l.type === 'info').length;
1545
1880
  const analyticsTotal = analyticsEvents.length;
1546
1881
  const uniqueEvents = new Set(analyticsEvents.map(e => e.name)).size;
1547
- const screenViews = analyticsEvents.filter(e => e.name === 'screen_view' || e.name === 'page_view' || e.name === 'firebase_screen_class').length;
1882
+ const screenViews = analyticsEvents.filter(e => e.name === 'screen_view' ||
1883
+ e.name === 'page_view' ||
1884
+ e.name === 'firebase_screen_class').length;
1548
1885
  const webviewTotal = webViewNavHistory.length;
1549
1886
  return (<react_native_1.View style={styles_1.default.dashboardContainer}>
1550
1887
  {/* Module 1: APIs */}
@@ -1562,13 +1899,19 @@ const NetworkInspector = ({ enabled = true }) => {
1562
1899
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Requests</react_native_1.Text>
1563
1900
  </react_native_1.View>
1564
1901
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1565
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, apiSuccessRate < 90 && { color: AppColors_1.AppColors.warningIconGold }]}>
1902
+ <react_native_1.Text style={[
1903
+ styles_1.default.dashboardGridVal,
1904
+ apiSuccessRate < 90 && { color: AppColors_1.AppColors.warningIconGold },
1905
+ ]}>
1566
1906
  {apiSuccessRate}%
1567
1907
  </react_native_1.Text>
1568
1908
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Success Rate</react_native_1.Text>
1569
1909
  </react_native_1.View>
1570
1910
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1571
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, apiErrors > 0 && { color: AppColors_1.AppColors.errorColor }]}>
1911
+ <react_native_1.Text style={[
1912
+ styles_1.default.dashboardGridVal,
1913
+ apiErrors > 0 && { color: AppColors_1.AppColors.errorColor },
1914
+ ]}>
1572
1915
  {apiErrors}
1573
1916
  </react_native_1.Text>
1574
1917
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Errors</react_native_1.Text>
@@ -1597,17 +1940,25 @@ const NetworkInspector = ({ enabled = true }) => {
1597
1940
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Total Logs</react_native_1.Text>
1598
1941
  </react_native_1.View>
1599
1942
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1600
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#0D9488' }]}>{logInfos}</react_native_1.Text>
1943
+ <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#0D9488' }]}>
1944
+ {logInfos}
1945
+ </react_native_1.Text>
1601
1946
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Info</react_native_1.Text>
1602
1947
  </react_native_1.View>
1603
1948
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1604
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, logWarns > 0 && { color: AppColors_1.AppColors.warningIconGold }]}>
1949
+ <react_native_1.Text style={[
1950
+ styles_1.default.dashboardGridVal,
1951
+ logWarns > 0 && { color: AppColors_1.AppColors.warningIconGold },
1952
+ ]}>
1605
1953
  {logWarns}
1606
1954
  </react_native_1.Text>
1607
1955
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Warnings</react_native_1.Text>
1608
1956
  </react_native_1.View>
1609
1957
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1610
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, logErrors > 0 && { color: AppColors_1.AppColors.errorColor }]}>
1958
+ <react_native_1.Text style={[
1959
+ styles_1.default.dashboardGridVal,
1960
+ logErrors > 0 && { color: AppColors_1.AppColors.errorColor },
1961
+ ]}>
1611
1962
  {logErrors}
1612
1963
  </react_native_1.Text>
1613
1964
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Errors</react_native_1.Text>
@@ -1620,7 +1971,9 @@ const NetworkInspector = ({ enabled = true }) => {
1620
1971
  <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
1621
1972
  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
1622
1973
  <NetworkIcons_1.AnalyticsIcon color="#EA580C" size={18}/>
1623
- <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>Analytics Events</react_native_1.Text>
1974
+ <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
1975
+ Analytics Events
1976
+ </react_native_1.Text>
1624
1977
  </react_native_1.View>
1625
1978
  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
1626
1979
  </react_native_1.View>
@@ -1630,7 +1983,9 @@ const NetworkInspector = ({ enabled = true }) => {
1630
1983
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Total Events</react_native_1.Text>
1631
1984
  </react_native_1.View>
1632
1985
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1633
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#EA580C' }]}>{uniqueEvents}</react_native_1.Text>
1986
+ <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#EA580C' }]}>
1987
+ {uniqueEvents}
1988
+ </react_native_1.Text>
1634
1989
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Unique Names</react_native_1.Text>
1635
1990
  </react_native_1.View>
1636
1991
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
@@ -1639,7 +1994,9 @@ const NetworkInspector = ({ enabled = true }) => {
1639
1994
  </react_native_1.View>
1640
1995
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1641
1996
  <react_native_1.Text style={styles_1.default.dashboardGridVal}>
1642
- {analyticsTotal > 0 ? Math.round(analyticsTotal / Math.max(1, logs.length / 5)) : 0}
1997
+ {analyticsTotal > 0
1998
+ ? Math.round(analyticsTotal / Math.max(1, logs.length / 5))
1999
+ : 0}
1643
2000
  </react_native_1.Text>
1644
2001
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Events Ratio</react_native_1.Text>
1645
2002
  </react_native_1.View>
@@ -1651,7 +2008,9 @@ const NetworkInspector = ({ enabled = true }) => {
1651
2008
  <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
1652
2009
  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
1653
2010
  <NetworkIcons_1.GlobeIcon color="#2563EB" size={18}/>
1654
- <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>WebView Captures</react_native_1.Text>
2011
+ <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
2012
+ WebView Captures
2013
+ </react_native_1.Text>
1655
2014
  </react_native_1.View>
1656
2015
  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
1657
2016
  </react_native_1.View>
@@ -1661,12 +2020,16 @@ const NetworkInspector = ({ enabled = true }) => {
1661
2020
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>History Size</react_native_1.Text>
1662
2021
  </react_native_1.View>
1663
2022
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1664
- <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#16A34A' }]}>Active</react_native_1.Text>
2023
+ <react_native_1.Text style={[styles_1.default.dashboardGridVal, { color: '#16A34A' }]}>
2024
+ Active
2025
+ </react_native_1.Text>
1665
2026
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Status</react_native_1.Text>
1666
2027
  </react_native_1.View>
1667
2028
  <react_native_1.View style={styles_1.default.dashboardGridItem}>
1668
2029
  <react_native_1.Text numberOfLines={1} style={styles_1.default.dashboardGridVal}>
1669
- {webviewTotal > 0 ? `${webViewNavHistory[0]?.title?.substring(0, 10) ?? ''}...` : '—'}
2030
+ {webviewTotal > 0
2031
+ ? `${webViewNavHistory[0]?.title?.substring(0, 10) ?? ''}...`
2032
+ : '—'}
1670
2033
  </react_native_1.Text>
1671
2034
  <react_native_1.Text style={styles_1.default.dashboardGridLbl}>Last URL</react_native_1.Text>
1672
2035
  </react_native_1.View>
@@ -1678,34 +2041,69 @@ const NetworkInspector = ({ enabled = true }) => {
1678
2041
  <react_native_1.View style={styles_1.default.dashboardModuleHeader}>
1679
2042
  <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
1680
2043
  <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={18}/>
1681
- <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>Redux Store State</react_native_1.Text>
2044
+ <react_native_1.Text style={styles_1.default.dashboardModuleTitle}>
2045
+ Redux Store State
2046
+ </react_native_1.Text>
1682
2047
  </react_native_1.View>
1683
2048
  <react_native_1.Text style={styles_1.default.dashboardModuleGoText}>View Details →</react_native_1.Text>
1684
2049
  </react_native_1.View>
1685
2050
  {reduxState ? (<react_native_1.View style={{ paddingHorizontal: 12, paddingBottom: 12, gap: 6 }}>
1686
- <react_native_1.View style={{ flexDirection: 'row', justifyContent: 'space-between', marginBottom: 4 }}>
1687
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, letterSpacing: 0.5 }}>
2051
+ <react_native_1.View style={{
2052
+ flexDirection: 'row',
2053
+ justifyContent: 'space-between',
2054
+ marginBottom: 4,
2055
+ }}>
2056
+ <react_native_1.Text style={{
2057
+ fontFamily: AppFonts_1.AppFonts.interBold,
2058
+ fontSize: 10,
2059
+ color: AppColors_1.AppColors.grayTextWeak,
2060
+ letterSpacing: 0.5,
2061
+ }}>
1688
2062
  REDUCER NAME
1689
2063
  </react_native_1.Text>
1690
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, letterSpacing: 0.5 }}>
2064
+ <react_native_1.Text style={{
2065
+ fontFamily: AppFonts_1.AppFonts.interBold,
2066
+ fontSize: 10,
2067
+ color: AppColors_1.AppColors.grayTextWeak,
2068
+ letterSpacing: 0.5,
2069
+ }}>
1691
2070
  SIZE / FIELDS
1692
2071
  </react_native_1.Text>
1693
2072
  </react_native_1.View>
1694
2073
  {Object.keys(reduxState).map(key => {
1695
2074
  const val = reduxState[key];
1696
- const fieldsCount = typeof val === 'object' && val !== null ? Object.keys(val).length : 0;
2075
+ const fieldsCount = typeof val === 'object' && val !== null
2076
+ ? Object.keys(val).length
2077
+ : 0;
1697
2078
  const sizeStr = (0, helpers_1.getSize)(val);
1698
- return (<react_native_1.View key={key} style={{ flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', paddingVertical: 2 }}>
1699
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interMedium, fontSize: 12, color: AppColors_1.AppColors.grayTextStrong }}>
2079
+ return (<react_native_1.View key={key} style={{
2080
+ flexDirection: 'row',
2081
+ justifyContent: 'space-between',
2082
+ alignItems: 'center',
2083
+ paddingVertical: 2,
2084
+ }}>
2085
+ <react_native_1.Text style={{
2086
+ fontFamily: AppFonts_1.AppFonts.interMedium,
2087
+ fontSize: 12,
2088
+ color: AppColors_1.AppColors.grayTextStrong,
2089
+ }}>
1700
2090
  {key}
1701
2091
  </react_native_1.Text>
1702
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 11, color: AppColors_1.AppColors.grayTextWeak }}>
2092
+ <react_native_1.Text style={{
2093
+ fontFamily: AppFonts_1.AppFonts.interRegular,
2094
+ fontSize: 11,
2095
+ color: AppColors_1.AppColors.grayTextWeak,
2096
+ }}>
1703
2097
  {sizeStr} ({fieldsCount} fields)
1704
2098
  </react_native_1.Text>
1705
2099
  </react_native_1.View>);
1706
2100
  })}
1707
2101
  </react_native_1.View>) : (<react_native_1.View style={{ padding: 12, alignItems: 'center' }}>
1708
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 12, color: AppColors_1.AppColors.grayTextWeak }}>
2102
+ <react_native_1.Text style={{
2103
+ fontFamily: AppFonts_1.AppFonts.interRegular,
2104
+ fontSize: 12,
2105
+ color: AppColors_1.AppColors.grayTextWeak,
2106
+ }}>
1709
2107
  No connected Redux store.
1710
2108
  </react_native_1.Text>
1711
2109
  </react_native_1.View>)}
@@ -1760,10 +2158,19 @@ const NetworkInspector = ({ enabled = true }) => {
1760
2158
  <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={20}/>
1761
2159
  </react_native_1.View>
1762
2160
  <react_native_1.View style={{ flex: 1 }}>
1763
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 13, color: AppColors_1.AppColors.primaryBlack }}>
2161
+ <react_native_1.Text style={{
2162
+ fontFamily: AppFonts_1.AppFonts.interBold,
2163
+ fontSize: 13,
2164
+ color: AppColors_1.AppColors.primaryBlack,
2165
+ }}>
1764
2166
  Redux Store Snapshot
1765
2167
  </react_native_1.Text>
1766
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 11, color: AppColors_1.AppColors.grayText, marginTop: 2 }}>
2168
+ <react_native_1.Text style={{
2169
+ fontFamily: AppFonts_1.AppFonts.interRegular,
2170
+ fontSize: 11,
2171
+ color: AppColors_1.AppColors.grayText,
2172
+ marginTop: 2,
2173
+ }}>
1767
2174
  Total size: {(0, helpers_1.getSize)(reduxState)} • {reducerKeys.length} Reducers
1768
2175
  </react_native_1.Text>
1769
2176
  </react_native_1.View>
@@ -1787,12 +2194,16 @@ const NetworkInspector = ({ enabled = true }) => {
1787
2194
  alignItems: 'center',
1788
2195
  justifyContent: 'center',
1789
2196
  borderRadius: 8,
1790
- backgroundColor: reduxActiveSubTab === 'timeline' ? AppColors_1.AppColors.purple : 'transparent',
2197
+ backgroundColor: reduxActiveSubTab === 'timeline'
2198
+ ? AppColors_1.AppColors.purple
2199
+ : 'transparent',
1791
2200
  }}>
1792
2201
  <react_native_1.Text style={{
1793
2202
  fontFamily: AppFonts_1.AppFonts.interBold,
1794
2203
  fontSize: 11,
1795
- color: reduxActiveSubTab === 'timeline' ? '#FFFFFF' : AppColors_1.AppColors.grayText,
2204
+ color: reduxActiveSubTab === 'timeline'
2205
+ ? '#FFFFFF'
2206
+ : AppColors_1.AppColors.grayText,
1796
2207
  }}>
1797
2208
  ⚡ Action Timeline
1798
2209
  </react_native_1.Text>
@@ -1828,7 +2239,9 @@ const NetworkInspector = ({ enabled = true }) => {
1828
2239
  borderColor: AppColors_1.AppColors.dividerColor,
1829
2240
  height: 36,
1830
2241
  }}>
1831
- <react_native_1.TextInput placeholder={reduxActiveSubTab === 'timeline' ? "Search actions or payloads..." : "Search Redux keys or values..."} placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={reduxSearch} onChangeText={setReduxSearch} style={{
2242
+ <react_native_1.TextInput placeholder={reduxActiveSubTab === 'timeline'
2243
+ ? 'Search actions or payloads...'
2244
+ : 'Search Redux keys or values...'} placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={reduxSearch} onChangeText={setReduxSearch} style={{
1832
2245
  flex: 1,
1833
2246
  fontFamily: AppFonts_1.AppFonts.interRegular,
1834
2247
  fontSize: 12,
@@ -1874,22 +2287,22 @@ const NetworkInspector = ({ enabled = true }) => {
1874
2287
  <react_native_1.Modal visible={visible} animationType="slide" transparent>
1875
2288
  {visible && (<ErrorBoundary_1.default onClose={closeModal}>
1876
2289
  <react_native_1.View style={styles_1.default.modalBackdrop}>
1877
- <react_native_1.Pressable style={styles_1.default.modalBackdropPressable} onPress={closeModal}/>
1878
- <react_native_1.View style={styles_1.default.modalContentCard}>
1879
- <react_native_1.StatusBar translucent backgroundColor="transparent" barStyle="light-content"/>
2290
+ <react_native_1.Pressable style={styles_1.default.modalBackdropPressable} onPress={closeModal}/>
2291
+ <react_native_1.View style={styles_1.default.modalContentCard}>
2292
+ <react_native_1.StatusBar translucent backgroundColor="transparent" barStyle="light-content"/>
1880
2293
 
1881
- <react_native_linear_gradient_1.default colors={[AppColors_1.AppColors.purple, '#6B4EFF']} style={styles_1.default.headerGradient}>
1882
- <react_native_1.View style={styles_1.default.header}>
1883
- <react_native_1.View style={[
2294
+ <react_native_linear_gradient_1.default colors={[AppColors_1.AppColors.purple, '#6B4EFF']} style={styles_1.default.headerGradient}>
2295
+ <react_native_1.View style={styles_1.default.header}>
2296
+ <react_native_1.View style={[
1884
2297
  styles_1.default.headerLeft,
1885
2298
  {
1886
2299
  flexDirection: 'row',
1887
2300
  alignItems: 'center',
1888
2301
  gap: 16,
1889
- flex: (selected == null && selectedEvent == null) ? 5 : 1,
2302
+ flex: selected == null && selectedEvent == null ? 5 : 1,
1890
2303
  },
1891
2304
  ]}>
1892
- <TouchableScale_1.default onPress={() => {
2305
+ <TouchableScale_1.default onPress={() => {
1893
2306
  requestAnimationFrame(() => {
1894
2307
  setSelected(null);
1895
2308
  setSelectedEvent(null);
@@ -1899,11 +2312,16 @@ const NetworkInspector = ({ enabled = true }) => {
1899
2312
  selected == null &&
1900
2313
  selectedEvent == null && { display: 'none' },
1901
2314
  ]}>
1902
- <NetworkIcons_1.WhiteBackNavigation />
1903
- </TouchableScale_1.default>
2315
+ <NetworkIcons_1.WhiteBackNavigation />
2316
+ </TouchableScale_1.default>
1904
2317
 
1905
- {selected == null && selectedEvent == null ? (<react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 14, flex: 1 }}>
1906
- <react_native_1.View style={{
2318
+ {selected == null && selectedEvent == null ? (<react_native_1.View style={{
2319
+ flexDirection: 'row',
2320
+ alignItems: 'center',
2321
+ gap: 14,
2322
+ flex: 1,
2323
+ }}>
2324
+ <react_native_1.View style={{
1907
2325
  width: 42,
1908
2326
  height: 42,
1909
2327
  borderRadius: 10,
@@ -1917,56 +2335,80 @@ const NetworkInspector = ({ enabled = true }) => {
1917
2335
  shadowRadius: 4,
1918
2336
  shadowOffset: { width: 0, height: 2 },
1919
2337
  }}>
1920
- <NetworkIcons_1.BrandSquareIcon size={36}/>
1921
- </react_native_1.View>
1922
- <react_native_1.View style={{ gap: 3 }}>
1923
- <react_native_1.Text style={[styles_1.default.headerTitle, { fontSize: 17, letterSpacing: 0.2 }]}>RN InApp Inspector</react_native_1.Text>
1924
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 5 }}>
1925
- <react_native_1.Animated.View style={{ width: 6, height: 6, borderRadius: 3, backgroundColor: '#4ADE80', opacity: activePulseAnim }}/>
1926
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interMedium, fontSize: 10, color: 'rgba(255,255,255,0.78)', letterSpacing: 0.3 }}>
1927
- Active • {react_native_1.Platform.OS === 'ios' ? 'iOS' : 'Android'} (v1.0.13)
1928
- </react_native_1.Text>
2338
+ <NetworkIcons_1.BrandSquareIcon size={36}/>
1929
2339
  </react_native_1.View>
1930
- </react_native_1.View>
1931
- </react_native_1.View>) : null}
1932
- </react_native_1.View>
1933
-
1934
- <react_native_1.View style={styles_1.default.headerCenter}>
1935
- {selected != null ? (<react_native_1.View style={styles_1.default.headerDetailCenter}>
1936
- <react_native_1.View style={styles_1.default.headerDetailRow}>
1937
- <react_native_1.View style={[
1938
- styles_1.default.headerMethodBadge,
1939
- {
2340
+ <react_native_1.View style={{ gap: 3 }}>
2341
+ <react_native_1.Text style={[
2342
+ styles_1.default.headerTitle,
2343
+ { fontSize: 17, letterSpacing: 0.2 },
2344
+ ]}>
2345
+ RN InApp Inspector
2346
+ </react_native_1.Text>
2347
+ <react_native_1.View style={{
2348
+ flexDirection: 'row',
2349
+ alignItems: 'center',
2350
+ gap: 5,
2351
+ }}>
2352
+ <react_native_1.Animated.View style={{
2353
+ width: 6,
2354
+ height: 6,
2355
+ borderRadius: 3,
2356
+ backgroundColor: '#4ADE80',
2357
+ opacity: activePulseAnim,
2358
+ }}/>
2359
+ <react_native_1.Text style={{
2360
+ fontFamily: AppFonts_1.AppFonts.interMedium,
2361
+ fontSize: 10,
2362
+ color: 'rgba(255,255,255,0.78)',
2363
+ letterSpacing: 0.3,
2364
+ }}>
2365
+ Active •{' '}
2366
+ {react_native_1.Platform.OS === 'ios' ? 'iOS' : 'Android'}{' '}
2367
+ (v1.0.13)
2368
+ </react_native_1.Text>
2369
+ </react_native_1.View>
2370
+ </react_native_1.View>
2371
+ </react_native_1.View>) : null}
2372
+ </react_native_1.View>
2373
+
2374
+ <react_native_1.View style={styles_1.default.headerCenter}>
2375
+ {selected != null ? (<react_native_1.View style={styles_1.default.headerDetailCenter}>
2376
+ <react_native_1.View style={styles_1.default.headerDetailRow}>
2377
+ <react_native_1.View style={[
2378
+ styles_1.default.headerMethodBadge,
2379
+ {
1940
2380
  backgroundColor: constants_1.METHOD_COLORS[selected.method] ??
1941
2381
  AppColors_1.AppColors.grayText,
1942
2382
  },
1943
2383
  ]}>
1944
- <react_native_1.Text style={styles_1.default.headerMethodText}>
1945
- {selected.method}
2384
+ <react_native_1.Text style={styles_1.default.headerMethodText}>
2385
+ {selected.method}
2386
+ </react_native_1.Text>
2387
+ </react_native_1.View>
2388
+ <react_native_1.Text style={styles_1.default.headerDetailTitle} numberOfLines={1} ellipsizeMode="middle">
2389
+ {detailTitle}
1946
2390
  </react_native_1.Text>
1947
2391
  </react_native_1.View>
1948
- <react_native_1.Text style={styles_1.default.headerDetailTitle} numberOfLines={1} ellipsizeMode="middle">
1949
- {detailTitle}
1950
- </react_native_1.Text>
1951
- </react_native_1.View>
1952
- <react_native_1.View style={styles_1.default.headerDetailSubRow}>
1953
- <react_native_1.View style={[
2392
+ <react_native_1.View style={styles_1.default.headerDetailSubRow}>
2393
+ <react_native_1.View style={[
1954
2394
  styles_1.default.headerStatusDot,
1955
- { backgroundColor: (0, helpers_1.getStatusColor)(selected.status) },
2395
+ {
2396
+ backgroundColor: (0, helpers_1.getStatusColor)(selected.status),
2397
+ },
1956
2398
  ]}/>
1957
- <react_native_1.Text style={styles_1.default.headerSubTitle}>
1958
- {selected.status === 0
2399
+ <react_native_1.Text style={styles_1.default.headerSubTitle}>
2400
+ {selected.status === 0
1959
2401
  ? 'Failed'
1960
2402
  : selected.status ?? 'Pending'}{' '}
1961
- •{' '}
1962
- {selected.duration != null
2403
+ •{' '}
2404
+ {selected.duration != null
1963
2405
  ? `${selected.duration}ms`
1964
2406
  : '-'}
1965
- </react_native_1.Text>
1966
- </react_native_1.View>
1967
- </react_native_1.View>) : selectedEvent != null ? (<react_native_1.View style={styles_1.default.headerDetailCenter}>
1968
- <react_native_1.View style={styles_1.default.headerDetailRow}>
1969
- <react_native_1.View style={[
2407
+ </react_native_1.Text>
2408
+ </react_native_1.View>
2409
+ </react_native_1.View>) : selectedEvent != null ? (<react_native_1.View style={styles_1.default.headerDetailCenter}>
2410
+ <react_native_1.View style={styles_1.default.headerDetailRow}>
2411
+ <react_native_1.View style={[
1970
2412
  styles_1.default.headerMethodBadge,
1971
2413
  {
1972
2414
  backgroundColor: selectedEvent.source === 'firebase'
@@ -1974,16 +2416,18 @@ const NetworkInspector = ({ enabled = true }) => {
1974
2416
  : 'rgba(124,92,191,0.3)',
1975
2417
  },
1976
2418
  ]}>
1977
- <react_native_1.Text style={styles_1.default.headerMethodText}>
1978
- {selectedEvent.source === 'firebase' ? 'FB' : 'MAN'}
2419
+ <react_native_1.Text style={styles_1.default.headerMethodText}>
2420
+ {selectedEvent.source === 'firebase'
2421
+ ? 'FB'
2422
+ : 'MAN'}
2423
+ </react_native_1.Text>
2424
+ </react_native_1.View>
2425
+ <react_native_1.Text style={styles_1.default.headerDetailTitle} numberOfLines={1} ellipsizeMode="middle">
2426
+ {selectedEvent.name}
1979
2427
  </react_native_1.Text>
1980
2428
  </react_native_1.View>
1981
- <react_native_1.Text style={styles_1.default.headerDetailTitle} numberOfLines={1} ellipsizeMode="middle">
1982
- {selectedEvent.name}
1983
- </react_native_1.Text>
1984
- </react_native_1.View>
1985
- <react_native_1.View style={styles_1.default.headerDetailSubRow}>
1986
- <react_native_1.View style={[
2429
+ <react_native_1.View style={styles_1.default.headerDetailSubRow}>
2430
+ <react_native_1.View style={[
1987
2431
  styles_1.default.headerStatusDot,
1988
2432
  {
1989
2433
  backgroundColor: selectedEvent.source === 'firebase'
@@ -1991,46 +2435,90 @@ const NetworkInspector = ({ enabled = true }) => {
1991
2435
  : AppColors_1.AppColors.purple,
1992
2436
  },
1993
2437
  ]}/>
1994
- <react_native_1.Text style={styles_1.default.headerSubTitle}>
1995
- {Object.keys(selectedEvent.params).length} param
1996
- {Object.keys(selectedEvent.params).length !== 1
2438
+ <react_native_1.Text style={styles_1.default.headerSubTitle}>
2439
+ {Object.keys(selectedEvent.params).length} param
2440
+ {Object.keys(selectedEvent.params).length !== 1
1997
2441
  ? 's'
1998
2442
  : ''}
1999
- {' · '}
2000
- {selectedEvent.source}
2001
- </react_native_1.Text>
2002
- </react_native_1.View>
2003
- </react_native_1.View>) : null}
2004
- </react_native_1.View>
2443
+ {' · '}
2444
+ {selectedEvent.source}
2445
+ </react_native_1.Text>
2446
+ </react_native_1.View>
2447
+ </react_native_1.View>) : null}
2448
+ </react_native_1.View>
2005
2449
 
2006
- <react_native_1.View style={styles_1.default.headerRight}>
2007
- {selected == null && selectedEvent == null && (<TouchableScale_1.default onPress={() => setSettingsPage('main')} hitSlop={15} style={[styles_1.default.closeButtonSquare, { marginRight: 8, backgroundColor: 'rgba(255,255,255,0.15)' }]}>
2008
- <NetworkIcons_1.SettingsIcon color="#FFFFFF" size={16}/>
2009
- </TouchableScale_1.default>)}
2450
+ <react_native_1.View style={styles_1.default.headerRight}>
2451
+ {selected == null && selectedEvent == null && (<TouchableScale_1.default onPress={() => setSettingsPage('main')} hitSlop={15} style={[
2452
+ styles_1.default.closeButtonSquare,
2453
+ {
2454
+ marginRight: 8,
2455
+ backgroundColor: 'rgba(255,255,255,0.15)',
2456
+ },
2457
+ ]}>
2458
+ <NetworkIcons_1.SettingsIcon color="#FFFFFF" size={16}/>
2459
+ </TouchableScale_1.default>)}
2010
2460
 
2011
- <TouchableScale_1.default onPress={closeModal} hitSlop={15} style={styles_1.default.closeButtonSquare}>
2012
- <NetworkIcons_1.CloseWhite size={16}/>
2013
- </TouchableScale_1.default>
2461
+ <TouchableScale_1.default onPress={closeModal} hitSlop={15} style={styles_1.default.closeButtonSquare}>
2462
+ <NetworkIcons_1.CloseWhite size={16}/>
2463
+ </TouchableScale_1.default>
2464
+ </react_native_1.View>
2014
2465
  </react_native_1.View>
2015
- </react_native_1.View>
2016
- </react_native_linear_gradient_1.default>
2017
-
2018
- {/* ─── Horizontal Scrollable Tab Bar inside Content ─── */}
2019
- {selected == null && selectedEvent == null && settingsPage === null ? (<react_native_1.View style={styles_1.default.tabBarContainer}>
2020
- <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{ paddingRight: 16 }}>
2021
- {[
2022
- { key: 'insights', label: 'Insights', count: 0, icon: 'insights' },
2023
- { key: 'apis', label: 'APIs', count: logs.length, icon: 'apis' },
2024
- { key: 'logs', label: 'Logs', count: consoleLogs.length, icon: 'logs' },
2025
- { key: 'analytics', label: 'Analytics', count: analyticsEvents.length, icon: 'analytics' },
2026
- { key: 'webview', label: 'WebView', count: webViewNavHistory.length, icon: 'webview' },
2027
- { key: 'redux', label: 'Redux', count: 0, icon: 'redux' },
2028
- ].filter(tab => tabVisibility[tab.key]).map(tab => {
2466
+ </react_native_linear_gradient_1.default>
2467
+
2468
+ {/* ─── Horizontal Scrollable Tab Bar inside Content ─── */}
2469
+ {selected == null &&
2470
+ selectedEvent == null &&
2471
+ settingsPage === null ? (<react_native_1.View style={styles_1.default.tabBarContainer}>
2472
+ <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{ paddingRight: 16 }}>
2473
+ {[
2474
+ {
2475
+ key: 'insights',
2476
+ label: 'Insights',
2477
+ count: 0,
2478
+ icon: 'insights',
2479
+ },
2480
+ {
2481
+ key: 'apis',
2482
+ label: 'APIs',
2483
+ count: logs.length,
2484
+ icon: 'apis',
2485
+ },
2486
+ {
2487
+ key: 'logs',
2488
+ label: 'Logs',
2489
+ count: consoleLogs.length,
2490
+ icon: 'logs',
2491
+ },
2492
+ {
2493
+ key: 'analytics',
2494
+ label: 'Analytics',
2495
+ count: analyticsEvents.length,
2496
+ icon: 'analytics',
2497
+ },
2498
+ {
2499
+ key: 'webview',
2500
+ label: 'WebView',
2501
+ count: webViewNavHistory.length,
2502
+ icon: 'webview',
2503
+ },
2504
+ {
2505
+ key: 'redux',
2506
+ label: 'Redux',
2507
+ count: 0,
2508
+ icon: 'redux',
2509
+ },
2510
+ ]
2511
+ .filter(tab => tabVisibility[tab.key])
2512
+ .map(tab => {
2029
2513
  const isActive = activeTab === tab.key;
2030
- const iconColor = isActive ? '#FFFFFF' : AppColors_1.AppColors.grayText;
2514
+ const iconColor = isActive
2515
+ ? '#FFFFFF'
2516
+ : AppColors_1.AppColors.grayText;
2031
2517
  const countLabel = tab.count > 9 ? '9+' : String(tab.count);
2032
- const hasUnreadApis = activeTab !== 'apis' && logs.length > lastReadApisCount;
2033
- const hasUnreadLogs = activeTab !== 'logs' && consoleLogs.length > lastReadLogsCount;
2518
+ const hasUnreadApis = activeTab !== 'apis' &&
2519
+ logs.length > lastReadApisCount;
2520
+ const hasUnreadLogs = activeTab !== 'logs' &&
2521
+ consoleLogs.length > lastReadLogsCount;
2034
2522
  return (<TouchableScale_1.default key={tab.key} onPress={() => {
2035
2523
  requestAnimationFrame(() => {
2036
2524
  setActiveTab(tab.key);
@@ -2039,20 +2527,27 @@ const NetworkInspector = ({ enabled = true }) => {
2039
2527
  styles_1.default.contentTabButton,
2040
2528
  isActive && styles_1.default.contentTabButtonActive,
2041
2529
  ]}>
2042
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
2043
- {tab.icon === 'insights' && <NetworkIcons_1.InsightsIcon color={iconColor} size={14}/>}
2044
- {tab.icon === 'apis' && <NetworkIcons_1.SignalIcon color={iconColor} size={14}/>}
2045
- {tab.icon === 'logs' && <NetworkIcons_1.TerminalIcon color={iconColor} size={14}/>}
2046
- {tab.icon === 'analytics' && <NetworkIcons_1.AnalyticsIcon color={iconColor} size={14}/>}
2047
- {tab.icon === 'webview' && <NetworkIcons_1.GlobeIcon color={iconColor} size={14}/>}
2048
- {tab.icon === 'redux' && <NetworkIcons_1.TerminalIcon color={iconColor} size={14}/>}
2049
- <react_native_1.Text numberOfLines={1} ellipsizeMode="tail" style={[
2530
+ <react_native_1.View style={{
2531
+ flexDirection: 'row',
2532
+ alignItems: 'center',
2533
+ gap: 6,
2534
+ }}>
2535
+ {tab.icon === 'insights' && (<NetworkIcons_1.InsightsIcon color={iconColor} size={14}/>)}
2536
+ {tab.icon === 'apis' && (<NetworkIcons_1.SignalIcon color={iconColor} size={14}/>)}
2537
+ {tab.icon === 'logs' && (<NetworkIcons_1.TerminalIcon color={iconColor} size={14}/>)}
2538
+ {tab.icon === 'analytics' && (<NetworkIcons_1.AnalyticsIcon color={iconColor} size={14}/>)}
2539
+ {tab.icon === 'webview' && (<NetworkIcons_1.GlobeIcon color={iconColor} size={14}/>)}
2540
+ {tab.icon === 'redux' && (<NetworkIcons_1.TerminalIcon color={iconColor} size={14}/>)}
2541
+ <react_native_1.Text numberOfLines={1} ellipsizeMode="tail" style={[
2050
2542
  styles_1.default.contentTabButtonText,
2051
- isActive && styles_1.default.contentTabButtonTextActive,
2543
+ isActive &&
2544
+ styles_1.default.contentTabButtonTextActive,
2052
2545
  ]}>
2053
- {tab.label} {tab.count > 0 ? `(${countLabel})` : ''}
2054
- </react_native_1.Text>
2055
- {((tab.key === 'apis' && hasUnreadApis) || (tab.key === 'logs' && hasUnreadLogs)) && (<react_native_1.Animated.View style={{
2546
+ {tab.label}{' '}
2547
+ {tab.count > 0 ? `(${countLabel})` : ''}
2548
+ </react_native_1.Text>
2549
+ {((tab.key === 'apis' && hasUnreadApis) ||
2550
+ (tab.key === 'logs' && hasUnreadLogs)) && (<react_native_1.Animated.View style={{
2056
2551
  width: 6,
2057
2552
  height: 6,
2058
2553
  borderRadius: 3,
@@ -2061,42 +2556,45 @@ const NetworkInspector = ({ enabled = true }) => {
2061
2556
  alignSelf: 'center',
2062
2557
  transform: [{ scale: unreadPulseAnim }],
2063
2558
  }}/>)}
2064
- </react_native_1.View>
2065
- </TouchableScale_1.default>);
2559
+ </react_native_1.View>
2560
+ </TouchableScale_1.default>);
2066
2561
  })}
2067
- </react_native_1.ScrollView>
2068
- </react_native_1.View>) : null}
2069
-
2070
-
2562
+ </react_native_1.ScrollView>
2563
+ </react_native_1.View>) : null}
2071
2564
 
2072
- {/* ─── Secondary Tab Bar for Analytics ──────────────────────── */}
2073
- {isReady && activeTab === 'analytics' && selectedEvent == null && (<react_native_1.View>
2074
- {/* ─── Search + Shared Toolbar for Analytics ──────────────────────── */}
2075
- <react_native_1.View style={[styles_1.default.toolbarRow, { marginTop: 12, marginBottom: 4 }]}>
2076
- <react_native_1.View style={styles_1.default.searchContainer}>
2077
- <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2078
- <react_native_1.TextInput placeholder="Search events..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={analyticsSearch} onChangeText={setAnalyticsSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2079
- {analyticsSearch.length > 0 && (<react_native_1.Pressable onPress={() => setAnalyticsSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2080
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2081
- </react_native_1.Pressable>)}
2082
- </react_native_1.View>
2083
- {analyticsSubTab === 'ga_events' && (<react_native_1.View style={styles_1.default.toolbarRight}>
2084
- <TouchableScale_1.default style={[
2565
+ {/* ─── Secondary Tab Bar for Analytics ──────────────────────── */}
2566
+ {isReady &&
2567
+ activeTab === 'analytics' &&
2568
+ selectedEvent == null && (<react_native_1.View>
2569
+ {/* ─── Search + Shared Toolbar for Analytics ──────────────────────── */}
2570
+ <react_native_1.View style={[
2571
+ styles_1.default.toolbarRow,
2572
+ { marginTop: 12, marginBottom: 4 },
2573
+ ]}>
2574
+ <react_native_1.View style={styles_1.default.searchContainer}>
2575
+ <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2576
+ <react_native_1.TextInput placeholder="Search events..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={analyticsSearch} onChangeText={setAnalyticsSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2577
+ {analyticsSearch.length > 0 && (<react_native_1.Pressable onPress={() => setAnalyticsSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2578
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2579
+ </react_native_1.Pressable>)}
2580
+ </react_native_1.View>
2581
+ {analyticsSubTab === 'ga_events' && (<react_native_1.View style={styles_1.default.toolbarRight}>
2582
+ <TouchableScale_1.default style={[
2085
2583
  styles_1.default.toolbarBtn,
2086
2584
  !hideScreenView && styles_1.default.toolbarBtnActive,
2087
2585
  ]} onPress={() => setHideScreenView(prev => !prev)} hitSlop={10}>
2088
- <NetworkIcons_1.ScreenIcon color={!hideScreenView
2586
+ <NetworkIcons_1.ScreenIcon color={!hideScreenView
2089
2587
  ? AppColors_1.AppColors.purple
2090
2588
  : AppColors_1.AppColors.grayTextStrong} size={18}/>
2091
- </TouchableScale_1.default>
2092
- <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2093
- <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2094
- </TouchableScale_1.default>
2095
- </react_native_1.View>)}
2096
- </react_native_1.View>
2589
+ </TouchableScale_1.default>
2590
+ <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2591
+ <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2592
+ </TouchableScale_1.default>
2593
+ </react_native_1.View>)}
2594
+ </react_native_1.View>
2097
2595
 
2098
- {/* ─── Secondary Tab Bar for Analytics ──────────────────────── */}
2099
- <react_native_1.View style={{
2596
+ {/* ─── Secondary Tab Bar for Analytics ──────────────────────── */}
2597
+ <react_native_1.View style={{
2100
2598
  marginHorizontal: 16,
2101
2599
  marginTop: 4,
2102
2600
  marginBottom: 8,
@@ -2107,7 +2605,7 @@ const NetworkInspector = ({ enabled = true }) => {
2107
2605
  borderWidth: 1,
2108
2606
  borderColor: AppColors_1.AppColors.grayBorderSecondary,
2109
2607
  }}>
2110
- <react_native_1.Pressable style={[
2608
+ <react_native_1.Pressable style={[
2111
2609
  {
2112
2610
  flex: 1,
2113
2611
  paddingVertical: 8,
@@ -2123,7 +2621,7 @@ const NetworkInspector = ({ enabled = true }) => {
2123
2621
  elevation: 2,
2124
2622
  },
2125
2623
  ]} onPress={() => setAnalyticsSubTab('ga_events')}>
2126
- <react_native_1.Text style={[
2624
+ <react_native_1.Text style={[
2127
2625
  {
2128
2626
  fontFamily: AppFonts_1.AppFonts.interMedium,
2129
2627
  fontSize: 13,
@@ -2134,14 +2632,14 @@ const NetworkInspector = ({ enabled = true }) => {
2134
2632
  color: AppColors_1.AppColors.purple,
2135
2633
  },
2136
2634
  ]}>
2137
- GA Events (
2138
- {analyticsSearch
2635
+ GA Events (
2636
+ {analyticsSearch
2139
2637
  ? filteredAnalyticsEvents.length
2140
2638
  : analyticsEvents.length}
2141
- )
2142
- </react_native_1.Text>
2143
- </react_native_1.Pressable>
2144
- <react_native_1.Pressable style={[
2639
+ )
2640
+ </react_native_1.Text>
2641
+ </react_native_1.Pressable>
2642
+ <react_native_1.Pressable style={[
2145
2643
  {
2146
2644
  flex: 1,
2147
2645
  paddingVertical: 8,
@@ -2157,7 +2655,7 @@ const NetworkInspector = ({ enabled = true }) => {
2157
2655
  elevation: 2,
2158
2656
  },
2159
2657
  ]} onPress={() => setAnalyticsSubTab('top_events')}>
2160
- <react_native_1.Text style={[
2658
+ <react_native_1.Text style={[
2161
2659
  {
2162
2660
  fontFamily: AppFonts_1.AppFonts.interMedium,
2163
2661
  fontSize: 13,
@@ -2168,15 +2666,15 @@ const NetworkInspector = ({ enabled = true }) => {
2168
2666
  color: AppColors_1.AppColors.purple,
2169
2667
  },
2170
2668
  ]}>
2171
- Top Events ({topEventsArray.length})
2172
- </react_native_1.Text>
2173
- </react_native_1.Pressable>
2174
- </react_native_1.View>
2175
- </react_native_1.View>)}
2669
+ Top Events ({topEventsArray.length})
2670
+ </react_native_1.Text>
2671
+ </react_native_1.Pressable>
2672
+ </react_native_1.View>
2673
+ </react_native_1.View>)}
2176
2674
 
2177
- {isReady ? (activeTab === 'insights' ? (<react_native_1.ScrollView style={styles_1.default.insightsContainer} contentContainerStyle={styles_1.default.insightsContent} showsVerticalScrollIndicator={false}>
2178
- {renderInsightsDashboard()}
2179
- </react_native_1.ScrollView>) : activeTab === 'analytics' ? (selectedEvent != null ? (<AnalyticsDetail_1.default event={selectedEvent}/>) : analyticsSubTab === 'top_events' ? (<react_native_1.FlatList data={topEventsArray} keyExtractor={item => item[0]} contentContainerStyle={[
2675
+ {isReady ? (activeTab === 'insights' ? (<react_native_1.ScrollView style={styles_1.default.insightsContainer} contentContainerStyle={styles_1.default.insightsContent} showsVerticalScrollIndicator={false}>
2676
+ {renderInsightsDashboard()}
2677
+ </react_native_1.ScrollView>) : activeTab === 'analytics' ? (selectedEvent != null ? (<AnalyticsDetail_1.default event={selectedEvent}/>) : analyticsSubTab === 'top_events' ? (<react_native_1.FlatList data={topEventsArray} keyExtractor={item => item[0]} contentContainerStyle={[
2180
2678
  styles_1.default.listContent,
2181
2679
  { paddingHorizontal: 16, paddingTop: 16 },
2182
2680
  ]} renderItem={({ item: [name, count] }) => {
@@ -2186,45 +2684,45 @@ const NetworkInspector = ({ enabled = true }) => {
2186
2684
  styles_1.default.analyticsTopEventsCard,
2187
2685
  { marginBottom: 12, paddingVertical: 16 },
2188
2686
  ]}>
2189
- <react_native_1.View style={styles_1.default.analyticsTopEventRow}>
2190
- <react_native_1.View style={{
2687
+ <react_native_1.View style={styles_1.default.analyticsTopEventRow}>
2688
+ <react_native_1.View style={{
2191
2689
  flexDirection: 'row',
2192
2690
  alignItems: 'center',
2193
2691
  gap: 8,
2194
2692
  flex: 1,
2195
2693
  }}>
2196
- <react_native_1.View style={[
2694
+ <react_native_1.View style={[
2197
2695
  styles_1.default.analyticsIconCircle,
2198
2696
  { backgroundColor: `${color}1A` },
2199
2697
  ]}>
2200
- <react_native_svg_1.default width={14} height={14} viewBox="0 0 24 24" fill={color}>
2201
- <react_native_svg_1.Circle cx="12" cy="12" r="10" opacity="0.3"/>
2202
- <react_native_svg_1.Path d="M7 14l3-3 4 4 6-6" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" fill="none"/>
2203
- </react_native_svg_1.default>
2204
- </react_native_1.View>
2205
- <react_native_1.Text style={styles_1.default.analyticsTopEventName} numberOfLines={2}>
2206
- {name}
2207
- </react_native_1.Text>
2208
- </react_native_1.View>
2209
- <react_native_1.View style={styles_1.default.analyticsTopEventBarWrap}>
2210
- <react_native_linear_gradient_1.default colors={[color, `${color}99`]} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }} style={[
2698
+ <react_native_svg_1.default width={14} height={14} viewBox="0 0 24 24" fill={color}>
2699
+ <react_native_svg_1.Circle cx="12" cy="12" r="10" opacity="0.3"/>
2700
+ <react_native_svg_1.Path d="M7 14l3-3 4 4 6-6" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" fill="none"/>
2701
+ </react_native_svg_1.default>
2702
+ </react_native_1.View>
2703
+ <react_native_1.Text style={styles_1.default.analyticsTopEventName} numberOfLines={2}>
2704
+ {name}
2705
+ </react_native_1.Text>
2706
+ </react_native_1.View>
2707
+ <react_native_1.View style={styles_1.default.analyticsTopEventBarWrap}>
2708
+ <react_native_linear_gradient_1.default colors={[color, `${color}99`]} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }} style={[
2211
2709
  styles_1.default.analyticsTopEventBar,
2212
2710
  {
2213
2711
  width: `${Math.max(6, (count / maxCount) * 100)}%`,
2214
2712
  },
2215
2713
  ]}/>
2216
- </react_native_1.View>
2217
- <react_native_1.Text style={styles_1.default.analyticsTopEventCount}>
2218
- {count}
2219
- </react_native_1.Text>
2220
- </react_native_1.View>
2221
- </react_native_1.View>);
2714
+ </react_native_1.View>
2715
+ <react_native_1.Text style={styles_1.default.analyticsTopEventCount}>
2716
+ {count}
2717
+ </react_native_1.Text>
2718
+ </react_native_1.View>
2719
+ </react_native_1.View>);
2222
2720
  }} ListEmptyComponent={<react_native_1.View style={styles_1.default.emptyContainer}>
2223
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
2224
- <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
2225
- </react_native_1.View>
2226
- <react_native_1.Text style={styles_1.default.emptyTitle}>No Top Events</react_native_1.Text>
2227
- </react_native_1.View>}/>) : (<react_native_1.FlatList data={filteredAnalyticsEvents} keyExtractor={item => item.id.toString()} renderItem={({ item, index }) => {
2721
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
2722
+ <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
2723
+ </react_native_1.View>
2724
+ <react_native_1.Text style={styles_1.default.emptyTitle}>No Top Events</react_native_1.Text>
2725
+ </react_native_1.View>}/>) : (<react_native_1.FlatList data={filteredAnalyticsEvents} keyExtractor={item => item.id.toString()} renderItem={({ item, index }) => {
2228
2726
  const prev = filteredAnalyticsEvents[index + 1];
2229
2727
  const next = filteredAnalyticsEvents[index - 1];
2230
2728
  const msSincePrev = prev
@@ -2255,67 +2753,68 @@ const NetworkInspector = ({ enabled = true }) => {
2255
2753
  return screenName;
2256
2754
  })()}/>);
2257
2755
  }} initialNumToRender={20} maxToRenderPerBatch={20} windowSize={5} removeClippedSubviews ListEmptyComponent={<react_native_1.View style={styles_1.default.emptyContainer}>
2258
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
2259
- <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
2260
- </react_native_1.View>
2261
- <react_native_1.Text style={styles_1.default.emptyTitle}>
2262
- {analyticsSearch.length > 0
2756
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
2757
+ <NetworkIcons_1.EmptyRadarIcon color={AppColors_1.AppColors.purple} size={32}/>
2758
+ </react_native_1.View>
2759
+ <react_native_1.Text style={styles_1.default.emptyTitle}>
2760
+ {analyticsSearch.length > 0
2263
2761
  ? 'No matching events'
2264
2762
  : 'No analytics events yet'}
2265
- </react_native_1.Text>
2266
- <react_native_1.Text style={styles_1.default.emptySub}>
2267
- {analyticsSearch.length > 0
2763
+ </react_native_1.Text>
2764
+ <react_native_1.Text style={styles_1.default.emptySub}>
2765
+ {analyticsSearch.length > 0
2268
2766
  ? 'Try adjusting your search.'
2269
2767
  : 'Call setupAnalyticsLogger(analytics()) at app start.'}
2270
- </react_native_1.Text>
2271
- </react_native_1.View>} contentContainerStyle={[
2768
+ </react_native_1.Text>
2769
+ </react_native_1.View>} contentContainerStyle={[
2272
2770
  styles_1.default.listContent,
2273
- filteredAnalyticsEvents.length === 0 && { flexGrow: 1 },
2771
+ filteredAnalyticsEvents.length === 0 && {
2772
+ flexGrow: 1,
2773
+ },
2274
2774
  ]} keyboardShouldPersistTaps="handled"/>)) : activeTab === 'apis' && selected == null ? (<react_native_1.FlatList data={groupedData} keyExtractor={item => item?.id?.toString()} renderItem={renderItem} initialNumToRender={10} maxToRenderPerBatch={10} windowSize={5} removeClippedSubviews={true} ListHeaderComponent={<react_native_1.View style={{ marginTop: 8 }}>
2275
- <react_native_1.View style={styles_1.default.toolbarRow}>
2276
- <react_native_1.View style={styles_1.default.searchContainer}>
2277
- <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2278
- <react_native_1.TextInput placeholder="Search endpoints..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={search} onChangeText={setSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2279
- {search.length > 0 && (<react_native_1.Pressable onPress={() => setSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2280
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2281
- </react_native_1.Pressable>)}
2282
- </react_native_1.View>
2283
-
2284
- <react_native_1.View style={styles_1.default.toolbarRight}>
2285
- <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2286
- <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2287
- {selectedLogs.size > 0 && (<react_native_1.View style={styles_1.default.trashBadge}>
2288
- <react_native_1.Text style={styles_1.default.trashBadgeText}>
2289
- {selectedLogs.size}
2290
- </react_native_1.Text>
2291
- </react_native_1.View>)}
2292
- </TouchableScale_1.default>
2775
+ <react_native_1.View style={styles_1.default.toolbarRow}>
2776
+ <react_native_1.View style={styles_1.default.searchContainer}>
2777
+ <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2778
+ <react_native_1.TextInput placeholder="Search endpoints..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={search} onChangeText={setSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2779
+ {search.length > 0 && (<react_native_1.Pressable onPress={() => setSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2780
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2781
+ </react_native_1.Pressable>)}
2782
+ </react_native_1.View>
2293
2783
 
2784
+ <react_native_1.View style={styles_1.default.toolbarRight}>
2785
+ <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2786
+ <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2787
+ {selectedLogs.size > 0 && (<react_native_1.View style={styles_1.default.trashBadge}>
2788
+ <react_native_1.Text style={styles_1.default.trashBadgeText}>
2789
+ {selectedLogs.size}
2790
+ </react_native_1.Text>
2791
+ </react_native_1.View>)}
2792
+ </TouchableScale_1.default>
2294
2793
 
2295
- <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={() => setSortOrder(o => o === 'newest' ? 'oldest' : 'newest')} hitSlop={10}>
2296
- <NetworkIcons_1.SortArrowIcon direction={sortOrder === 'newest' ? 'down' : 'up'} color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2297
- </TouchableScale_1.default>
2794
+ <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={() => setSortOrder(o => o === 'newest' ? 'oldest' : 'newest')} hitSlop={10}>
2795
+ <NetworkIcons_1.SortArrowIcon direction={sortOrder === 'newest' ? 'down' : 'up'} color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2796
+ </TouchableScale_1.default>
2298
2797
 
2299
- <TouchableScale_1.default style={[
2798
+ <TouchableScale_1.default style={[
2300
2799
  styles_1.default.toolbarBtn,
2301
2800
  filtersAccordion.isOpen &&
2302
2801
  styles_1.default.toolbarBtnActive,
2303
2802
  ]} onPress={filtersAccordion.toggleOpen} hitSlop={10}>
2304
- <NetworkIcons_1.FilterIcon color={filtersAccordion.isOpen
2803
+ <NetworkIcons_1.FilterIcon color={filtersAccordion.isOpen
2305
2804
  ? AppColors_1.AppColors.purple
2306
2805
  : AppColors_1.AppColors.grayTextStrong} size={18}/>
2307
- </TouchableScale_1.default>
2806
+ </TouchableScale_1.default>
2807
+ </react_native_1.View>
2308
2808
  </react_native_1.View>
2309
- </react_native_1.View>
2310
2809
 
2311
- <react_native_1.Animated.View style={[
2810
+ <react_native_1.Animated.View style={[
2312
2811
  filtersAccordion.bodyStyle,
2313
2812
  { overflow: 'hidden' },
2314
2813
  ]}>
2315
- <react_native_1.View style={styles_1.default.filtersContainer}>
2316
- <react_native_1.Text style={styles_1.default.filtersHeading}>STATUS</react_native_1.Text>
2317
- <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles_1.default.statusRowContent}>
2318
- {constants_1.STATUS_FILTERS.map(filter => {
2814
+ <react_native_1.View style={styles_1.default.filtersContainer}>
2815
+ <react_native_1.Text style={styles_1.default.filtersHeading}>STATUS</react_native_1.Text>
2816
+ <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles_1.default.statusRowContent}>
2817
+ {constants_1.STATUS_FILTERS.map(filter => {
2319
2818
  const isAll = filter === 'ALL';
2320
2819
  const active = isAll
2321
2820
  ? statusFilters.size === 0
@@ -2334,35 +2833,38 @@ const NetworkInspector = ({ enabled = true }) => {
2334
2833
  });
2335
2834
  }
2336
2835
  }} hitSlop={10}>
2337
- {active ? (<react_native_1.View style={[
2836
+ {active ? (<react_native_1.View style={[
2338
2837
  styles_1.default.statusFilterChip,
2339
2838
  styles_1.default.statusFilterActive,
2340
2839
  { overflow: 'hidden' },
2341
2840
  ]}>
2342
- <react_native_linear_gradient_1.default colors={[
2841
+ <react_native_linear_gradient_1.default colors={[
2343
2842
  AppColors_1.AppColors.purpleShade50,
2344
2843
  '#EAE5FF',
2345
2844
  ]} style={react_native_1.StyleSheet.absoluteFill} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }}/>
2346
- <react_native_1.Text style={[
2845
+ <react_native_1.Text style={[
2347
2846
  styles_1.default.statusFilterText,
2348
2847
  { color: AppColors_1.AppColors.purple },
2349
2848
  ]}>
2350
- {filter}
2351
- </react_native_1.Text>
2352
- </react_native_1.View>) : (<react_native_1.View style={styles_1.default.statusFilterChip}>
2353
- <react_native_1.Text style={styles_1.default.statusFilterText}>
2354
- {filter}
2355
- </react_native_1.Text>
2356
- </react_native_1.View>)}
2357
- </TouchableScale_1.default>);
2849
+ {filter}
2850
+ </react_native_1.Text>
2851
+ </react_native_1.View>) : (<react_native_1.View style={styles_1.default.statusFilterChip}>
2852
+ <react_native_1.Text style={styles_1.default.statusFilterText}>
2853
+ {filter}
2854
+ </react_native_1.Text>
2855
+ </react_native_1.View>)}
2856
+ </TouchableScale_1.default>);
2358
2857
  })}
2359
- </react_native_1.ScrollView>
2858
+ </react_native_1.ScrollView>
2360
2859
 
2361
- <react_native_1.Text style={[styles_1.default.filtersHeading, { marginTop: 16 }]}>
2362
- METHOD
2363
- </react_native_1.Text>
2364
- <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles_1.default.statusRowContent}>
2365
- {availableMethods.map(filter => {
2860
+ <react_native_1.Text style={[
2861
+ styles_1.default.filtersHeading,
2862
+ { marginTop: 16 },
2863
+ ]}>
2864
+ METHOD
2865
+ </react_native_1.Text>
2866
+ <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={styles_1.default.statusRowContent}>
2867
+ {availableMethods.map(filter => {
2366
2868
  const isAll = filter === 'ALL';
2367
2869
  const active = isAll
2368
2870
  ? methodFilters.size === 0
@@ -2381,101 +2883,101 @@ const NetworkInspector = ({ enabled = true }) => {
2381
2883
  });
2382
2884
  }
2383
2885
  }} hitSlop={10}>
2384
- {active ? (<react_native_1.View style={[
2886
+ {active ? (<react_native_1.View style={[
2385
2887
  styles_1.default.statusFilterChip,
2386
2888
  styles_1.default.statusFilterActive,
2387
2889
  { overflow: 'hidden' },
2388
2890
  ]}>
2389
- <react_native_linear_gradient_1.default colors={[
2891
+ <react_native_linear_gradient_1.default colors={[
2390
2892
  AppColors_1.AppColors.purpleShade50,
2391
2893
  '#EAE5FF',
2392
2894
  ]} style={react_native_1.StyleSheet.absoluteFill} start={{ x: 0, y: 0 }} end={{ x: 1, y: 0 }}/>
2393
- <react_native_1.Text style={[
2895
+ <react_native_1.Text style={[
2394
2896
  styles_1.default.statusFilterText,
2395
2897
  { color: AppColors_1.AppColors.purple },
2396
2898
  ]}>
2397
- {filter}
2398
- </react_native_1.Text>
2399
- </react_native_1.View>) : (<react_native_1.View style={styles_1.default.statusFilterChip}>
2400
- <react_native_1.Text style={styles_1.default.statusFilterText}>
2401
- {filter}
2402
- </react_native_1.Text>
2403
- </react_native_1.View>)}
2404
- </TouchableScale_1.default>);
2899
+ {filter}
2900
+ </react_native_1.Text>
2901
+ </react_native_1.View>) : (<react_native_1.View style={styles_1.default.statusFilterChip}>
2902
+ <react_native_1.Text style={styles_1.default.statusFilterText}>
2903
+ {filter}
2904
+ </react_native_1.Text>
2905
+ </react_native_1.View>)}
2906
+ </TouchableScale_1.default>);
2405
2907
  })}
2406
- </react_native_1.ScrollView>
2407
- </react_native_1.View>
2408
- </react_native_1.Animated.View>
2908
+ </react_native_1.ScrollView>
2909
+ </react_native_1.View>
2910
+ </react_native_1.Animated.View>
2409
2911
 
2410
- {(search ||
2912
+ {(search ||
2411
2913
  statusFilters.size > 0 ||
2412
2914
  methodFilters.size > 0) && (<react_native_1.Text style={styles_1.default.resultCount}>
2413
- {filteredLogs.length === logs.length
2915
+ {filteredLogs.length === logs.length
2414
2916
  ? `${logs.length} requests`
2415
2917
  : `${filteredLogs.length} of ${logs.length} filtered requests`}
2416
- </react_native_1.Text>)}
2417
- </react_native_1.View>} ListEmptyComponent={<EmptyState_1.default isSearch={search.length > 0 || statusFilters.size > 0}/>} contentContainerStyle={[
2918
+ </react_native_1.Text>)}
2919
+ </react_native_1.View>} ListEmptyComponent={<EmptyState_1.default isSearch={search.length > 0 || statusFilters.size > 0}/>} contentContainerStyle={[
2418
2920
  styles_1.default.listContent,
2419
2921
  filteredLogs.length === 0 && { flexGrow: 1 },
2420
2922
  ]} keyboardShouldPersistTaps="handled"/>) : activeTab === 'logs' ? (<react_native_1.View style={{ flex: 1 }}>
2421
- <react_native_1.View style={{
2923
+ <react_native_1.View style={{
2422
2924
  backgroundColor: '#FFFFFF',
2423
2925
  borderBottomWidth: 1,
2424
2926
  borderBottomColor: AppColors_1.AppColors.dividerColor,
2425
2927
  paddingBottom: 6,
2426
2928
  }}>
2427
- <react_native_1.View style={[
2929
+ <react_native_1.View style={[
2428
2930
  styles_1.default.toolbarRow,
2429
2931
  { marginTop: 12, marginBottom: 8 },
2430
2932
  ]}>
2431
- <react_native_1.View style={styles_1.default.searchContainer}>
2432
- <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2433
- <react_native_1.TextInput placeholder="Search logs..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={logSearch} onChangeText={setLogSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2434
- {logSearch.length > 0 && (<react_native_1.Pressable onPress={() => setLogSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2435
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2436
- </react_native_1.Pressable>)}
2437
- </react_native_1.View>
2933
+ <react_native_1.View style={styles_1.default.searchContainer}>
2934
+ <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={16}/>
2935
+ <react_native_1.TextInput placeholder="Search logs..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={logSearch} onChangeText={setLogSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
2936
+ {logSearch.length > 0 && (<react_native_1.Pressable onPress={() => setLogSearch('')} hitSlop={10} style={styles_1.default.clearBtn}>
2937
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
2938
+ </react_native_1.Pressable>)}
2939
+ </react_native_1.View>
2438
2940
 
2439
- <react_native_1.View style={styles_1.default.toolbarRight}>
2440
- <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2441
- <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2442
- </TouchableScale_1.default>
2443
- </react_native_1.View>
2444
- </react_native_1.View>
2941
+ <react_native_1.View style={styles_1.default.toolbarRight}>
2942
+ <TouchableScale_1.default style={styles_1.default.toolbarBtn} onPress={handleDelete} hitSlop={10}>
2943
+ <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.grayTextStrong} size={18}/>
2944
+ </TouchableScale_1.default>
2945
+ </react_native_1.View>
2946
+ </react_native_1.View>
2445
2947
 
2446
- <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} style={{ marginVertical: 4, maxHeight: 46 }} contentContainerStyle={{
2948
+ <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} style={{ marginVertical: 4, maxHeight: 46 }} contentContainerStyle={{
2447
2949
  paddingHorizontal: 16,
2448
2950
  paddingBottom: 4,
2449
2951
  flexDirection: 'row',
2450
2952
  alignItems: 'center',
2451
2953
  gap: 8,
2452
2954
  }}>
2453
- {(() => {
2955
+ {(() => {
2454
2956
  const active = logFilters.has('all');
2455
2957
  return (<TouchableScale_1.default onPress={() => {
2456
2958
  setLogFilters(new Set(['all']));
2457
2959
  }}>
2458
- <react_native_1.View style={[
2960
+ <react_native_1.View style={[
2459
2961
  styles_1.default.statusFilterChip,
2460
2962
  active && {
2461
2963
  borderColor: AppColors_1.AppColors.purpleShade700,
2462
2964
  backgroundColor: '#F4EBFF',
2463
2965
  },
2464
2966
  ]}>
2465
- <react_native_1.Text numberOfLines={1} style={[
2967
+ <react_native_1.Text numberOfLines={1} style={[
2466
2968
  styles_1.default.statusFilterText,
2467
2969
  active && {
2468
2970
  color: AppColors_1.AppColors.purpleShade700,
2469
2971
  fontFamily: AppFonts_1.AppFonts.interBold,
2470
2972
  },
2471
2973
  ]}>
2472
- All ({logCounts.all})
2473
- </react_native_1.Text>
2474
- </react_native_1.View>
2475
- </TouchableScale_1.default>);
2974
+ All ({logCounts.all})
2975
+ </react_native_1.Text>
2976
+ </react_native_1.View>
2977
+ </TouchableScale_1.default>);
2476
2978
  })()}
2477
2979
 
2478
- {(() => {
2980
+ {(() => {
2479
2981
  const active = logFilters.has('user-log');
2480
2982
  return (<TouchableScale_1.default onPress={() => {
2481
2983
  setLogFilters(prev => {
@@ -2489,27 +2991,27 @@ const NetworkInspector = ({ enabled = true }) => {
2489
2991
  return next;
2490
2992
  });
2491
2993
  }}>
2492
- <react_native_1.View style={[
2994
+ <react_native_1.View style={[
2493
2995
  styles_1.default.statusFilterChip,
2494
2996
  active && {
2495
2997
  borderColor: '#64748B',
2496
2998
  backgroundColor: '#F1F5F9',
2497
2999
  },
2498
3000
  ]}>
2499
- <react_native_1.Text numberOfLines={1} style={[
3001
+ <react_native_1.Text numberOfLines={1} style={[
2500
3002
  styles_1.default.statusFilterText,
2501
3003
  active && {
2502
3004
  color: '#334155',
2503
3005
  fontFamily: AppFonts_1.AppFonts.interBold,
2504
3006
  },
2505
3007
  ]}>
2506
- User Log ({logCounts['user-log']})
2507
- </react_native_1.Text>
2508
- </react_native_1.View>
2509
- </TouchableScale_1.default>);
3008
+ User Log ({logCounts['user-log']})
3009
+ </react_native_1.Text>
3010
+ </react_native_1.View>
3011
+ </TouchableScale_1.default>);
2510
3012
  })()}
2511
3013
 
2512
- {(() => {
3014
+ {(() => {
2513
3015
  const active = logFilters.has('info');
2514
3016
  return (<TouchableScale_1.default onPress={() => {
2515
3017
  setLogFilters(prev => {
@@ -2523,27 +3025,27 @@ const NetworkInspector = ({ enabled = true }) => {
2523
3025
  return next;
2524
3026
  });
2525
3027
  }}>
2526
- <react_native_1.View style={[
3028
+ <react_native_1.View style={[
2527
3029
  styles_1.default.statusFilterChip,
2528
3030
  active && {
2529
3031
  borderColor: AppColors_1.AppColors.purple,
2530
3032
  backgroundColor: AppColors_1.AppColors.purpleShade50,
2531
3033
  },
2532
3034
  ]}>
2533
- <react_native_1.Text numberOfLines={1} style={[
3035
+ <react_native_1.Text numberOfLines={1} style={[
2534
3036
  styles_1.default.statusFilterText,
2535
3037
  active && {
2536
3038
  color: AppColors_1.AppColors.purple,
2537
3039
  fontFamily: AppFonts_1.AppFonts.interBold,
2538
3040
  },
2539
3041
  ]}>
2540
- Info ({logCounts.info})
2541
- </react_native_1.Text>
2542
- </react_native_1.View>
2543
- </TouchableScale_1.default>);
3042
+ Info ({logCounts.info})
3043
+ </react_native_1.Text>
3044
+ </react_native_1.View>
3045
+ </TouchableScale_1.default>);
2544
3046
  })()}
2545
3047
 
2546
- {(() => {
3048
+ {(() => {
2547
3049
  const active = logFilters.has('warn');
2548
3050
  return (<TouchableScale_1.default onPress={() => {
2549
3051
  setLogFilters(prev => {
@@ -2557,14 +3059,14 @@ const NetworkInspector = ({ enabled = true }) => {
2557
3059
  return next;
2558
3060
  });
2559
3061
  }}>
2560
- <react_native_1.View style={[
3062
+ <react_native_1.View style={[
2561
3063
  styles_1.default.statusFilterChip,
2562
3064
  active && {
2563
3065
  borderColor: AppColors_1.AppColors.lightOrange,
2564
3066
  backgroundColor: '#FFFDF6',
2565
3067
  },
2566
3068
  ]}>
2567
- <react_native_1.Text numberOfLines={1} style={[
3069
+ <react_native_1.Text numberOfLines={1} style={[
2568
3070
  styles_1.default.statusFilterText,
2569
3071
  active && {
2570
3072
  color: AppColors_1.AppColors.darkOrange ||
@@ -2572,13 +3074,13 @@ const NetworkInspector = ({ enabled = true }) => {
2572
3074
  fontFamily: AppFonts_1.AppFonts.interBold,
2573
3075
  },
2574
3076
  ]}>
2575
- Warning ({logCounts.warn})
2576
- </react_native_1.Text>
2577
- </react_native_1.View>
2578
- </TouchableScale_1.default>);
3077
+ Warning ({logCounts.warn})
3078
+ </react_native_1.Text>
3079
+ </react_native_1.View>
3080
+ </TouchableScale_1.default>);
2579
3081
  })()}
2580
3082
 
2581
- {(() => {
3083
+ {(() => {
2582
3084
  const active = logFilters.has('error');
2583
3085
  return (<TouchableScale_1.default onPress={() => {
2584
3086
  setLogFilters(prev => {
@@ -2592,27 +3094,27 @@ const NetworkInspector = ({ enabled = true }) => {
2592
3094
  return next;
2593
3095
  });
2594
3096
  }}>
2595
- <react_native_1.View style={[
3097
+ <react_native_1.View style={[
2596
3098
  styles_1.default.statusFilterChip,
2597
3099
  active && {
2598
3100
  borderColor: AppColors_1.AppColors.errorColor,
2599
3101
  backgroundColor: '#FFF5F6',
2600
3102
  },
2601
3103
  ]}>
2602
- <react_native_1.Text numberOfLines={1} style={[
3104
+ <react_native_1.Text numberOfLines={1} style={[
2603
3105
  styles_1.default.statusFilterText,
2604
3106
  active && {
2605
3107
  color: AppColors_1.AppColors.errorColor,
2606
3108
  fontFamily: AppFonts_1.AppFonts.interBold,
2607
3109
  },
2608
3110
  ]}>
2609
- Error ({logCounts.error})
2610
- </react_native_1.Text>
2611
- </react_native_1.View>
2612
- </TouchableScale_1.default>);
3111
+ Error ({logCounts.error})
3112
+ </react_native_1.Text>
3113
+ </react_native_1.View>
3114
+ </TouchableScale_1.default>);
2613
3115
  })()}
2614
3116
 
2615
- {(() => {
3117
+ {(() => {
2616
3118
  const active = logFilters.has('analytics');
2617
3119
  return (<TouchableScale_1.default onPress={() => {
2618
3120
  setLogFilters(prev => {
@@ -2626,29 +3128,29 @@ const NetworkInspector = ({ enabled = true }) => {
2626
3128
  return next;
2627
3129
  });
2628
3130
  }}>
2629
- <react_native_1.View style={[
3131
+ <react_native_1.View style={[
2630
3132
  styles_1.default.statusFilterChip,
2631
3133
  active && {
2632
3134
  borderColor: AppColors_1.AppColors.skyBlue,
2633
3135
  backgroundColor: `${AppColors_1.AppColors.skyBlue}15`,
2634
3136
  },
2635
3137
  ]}>
2636
- <react_native_1.Text numberOfLines={1} style={[
3138
+ <react_native_1.Text numberOfLines={1} style={[
2637
3139
  styles_1.default.statusFilterText,
2638
3140
  active && {
2639
3141
  color: AppColors_1.AppColors.skyBlue,
2640
3142
  fontFamily: AppFonts_1.AppFonts.interBold,
2641
3143
  },
2642
3144
  ]}>
2643
- Analytics ({logCounts.analytics})
2644
- </react_native_1.Text>
2645
- </react_native_1.View>
2646
- </TouchableScale_1.default>);
3145
+ Analytics ({logCounts.analytics})
3146
+ </react_native_1.Text>
3147
+ </react_native_1.View>
3148
+ </TouchableScale_1.default>);
2647
3149
  })()}
2648
- </react_native_1.ScrollView>
2649
- </react_native_1.View>
3150
+ </react_native_1.ScrollView>
3151
+ </react_native_1.View>
2650
3152
 
2651
- <react_native_1.FlatList data={filteredConsoleLogs} keyExtractor={item => item.id.toString()} ListHeaderComponent={(() => {
3153
+ <react_native_1.FlatList data={filteredConsoleLogs} keyExtractor={item => item.id.toString()} ListHeaderComponent={(() => {
2652
3154
  const total = visibleConsoleLogs.length;
2653
3155
  const filtered = filteredConsoleLogs.length;
2654
3156
  const isAllSelected = logFilters.has('all') ||
@@ -2658,8 +3160,8 @@ const NetworkInspector = ({ enabled = true }) => {
2658
3160
  styles_1.default.resultCount,
2659
3161
  { marginBottom: 4, marginTop: 12 },
2660
3162
  ]}>
2661
- Showing ({filtered}/{total}) logs showing
2662
- </react_native_1.Text>);
3163
+ Showing ({filtered}/{total}) logs showing
3164
+ </react_native_1.Text>);
2663
3165
  }
2664
3166
  else {
2665
3167
  const activeFilterNames = Array.from(logFilters)
@@ -2669,31 +3171,35 @@ const NetworkInspector = ({ enabled = true }) => {
2669
3171
  return 'User Log';
2670
3172
  if (f === 'analytics')
2671
3173
  return 'Analytics';
2672
- return f.charAt(0).toUpperCase() + f.slice(1);
3174
+ return (f.charAt(0).toUpperCase() +
3175
+ f.slice(1));
2673
3176
  });
2674
3177
  return (<react_native_1.Text style={[
2675
3178
  styles_1.default.resultCount,
2676
3179
  { marginBottom: 4, marginTop: 12 },
2677
3180
  ]}>
2678
- Filtering with {activeFilterNames.join(', ')} (
2679
- {filtered}/{total}) logs is showing
2680
- </react_native_1.Text>);
3181
+ Filtering with {activeFilterNames.join(', ')} (
3182
+ {filtered}/{total}) logs is showing
3183
+ </react_native_1.Text>);
2681
3184
  }
2682
3185
  })()} renderItem={({ item }) => (<ConsoleLogCard_1.ConsoleLogCard item={item} searchStr={logSearch}/>)} initialNumToRender={15} maxToRenderPerBatch={15} windowSize={7} removeClippedSubviews={true} ListEmptyComponent={<EmptyState_1.default isSearch={logSearch.length > 0 || logFilters.size > 0}/>} contentContainerStyle={[
2683
3186
  styles_1.default.listContent,
2684
3187
  filteredConsoleLogs.length === 0 && { flexGrow: 1 },
2685
3188
  ]} keyboardShouldPersistTaps="handled"/>
2686
- </react_native_1.View>) : activeTab === 'webview' ? (webViewNavHistory.length === 0 ? (<react_native_1.View style={styles_1.default.emptyContainer}>
2687
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
2688
- <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
2689
- </react_native_1.View>
2690
- <react_native_1.Text style={styles_1.default.emptyTitle}>No WebView Activity</react_native_1.Text>
2691
- <react_native_1.Text style={styles_1.default.emptySub}>
2692
- Load a webpage within a connected WebView component to inspect pages, page source, and console logs.
2693
- </react_native_1.Text>
2694
- </react_native_1.View>) : (<react_native_1.View style={{ flex: 1 }}>
2695
- {/* ─── Current Page Address Bar (Now on top) ─── */}
2696
- {(() => {
3189
+ </react_native_1.View>) : activeTab === 'webview' ? (webViewNavHistory.length === 0 ? (<react_native_1.View style={styles_1.default.emptyContainer}>
3190
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
3191
+ <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
3192
+ </react_native_1.View>
3193
+ <react_native_1.Text style={styles_1.default.emptyTitle}>
3194
+ No WebView Activity
3195
+ </react_native_1.Text>
3196
+ <react_native_1.Text style={styles_1.default.emptySub}>
3197
+ Load a webpage within a connected WebView component to
3198
+ inspect pages, page source, and console logs.
3199
+ </react_native_1.Text>
3200
+ </react_native_1.View>) : (<react_native_1.View style={{ flex: 1 }}>
3201
+ {/* ─── Current Page Address Bar (Now on top) ─── */}
3202
+ {(() => {
2697
3203
  const currentUrl = webViewNavHistory[0]?.url;
2698
3204
  if (!currentUrl)
2699
3205
  return null;
@@ -2705,7 +3211,7 @@ const NetworkInspector = ({ enabled = true }) => {
2705
3211
  borderBottomWidth: 1,
2706
3212
  borderBottomColor: AppColors_1.AppColors.dividerColor,
2707
3213
  }}>
2708
- <react_native_1.View style={{
3214
+ <react_native_1.View style={{
2709
3215
  flexDirection: 'row',
2710
3216
  alignItems: 'center',
2711
3217
  backgroundColor: AppColors_1.AppColors.grayBackground,
@@ -2716,27 +3222,42 @@ const NetworkInspector = ({ enabled = true }) => {
2716
3222
  paddingVertical: 5,
2717
3223
  gap: 8,
2718
3224
  }}>
2719
- {/* Left: Lock and HTTPS label */}
2720
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
2721
- <react_native_1.Text style={{ fontSize: 11 }}>🔒</react_native_1.Text>
2722
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 9.5, color: AppColors_1.AppColors.greenColor, letterSpacing: 0.5 }}>HTTPS</react_native_1.Text>
2723
- </react_native_1.View>
2724
- <react_native_1.View style={{ width: 1.5, height: 12, backgroundColor: AppColors_1.AppColors.grayBorderSecondary }}/>
3225
+ {/* Left: Lock and HTTPS label */}
3226
+ <react_native_1.View style={{
3227
+ flexDirection: 'row',
3228
+ alignItems: 'center',
3229
+ gap: 4,
3230
+ }}>
3231
+ <react_native_1.Text style={{ fontSize: 11 }}>🔒</react_native_1.Text>
3232
+ <react_native_1.Text style={{
3233
+ fontFamily: AppFonts_1.AppFonts.interBold,
3234
+ fontSize: 9.5,
3235
+ color: AppColors_1.AppColors.greenColor,
3236
+ letterSpacing: 0.5,
3237
+ }}>
3238
+ HTTPS
3239
+ </react_native_1.Text>
3240
+ </react_native_1.View>
3241
+ <react_native_1.View style={{
3242
+ width: 1.5,
3243
+ height: 12,
3244
+ backgroundColor: AppColors_1.AppColors.grayBorderSecondary,
3245
+ }}/>
2725
3246
 
2726
- {/* Middle: URL text (Address style) */}
2727
- <react_native_1.View style={{ flex: 1 }}>
2728
- <HighlightText_1.default text={currentUrl} search={webViewSearch} numberOfLines={1} ellipsizeMode="tail" style={{
3247
+ {/* Middle: URL text (Address style) */}
3248
+ <react_native_1.View style={{ flex: 1 }}>
3249
+ <HighlightText_1.default text={currentUrl} search={webViewSearch} numberOfLines={1} ellipsizeMode="tail" style={{
2729
3250
  fontFamily: AppFonts_1.AppFonts.interMedium,
2730
3251
  fontSize: 11.5,
2731
3252
  color: AppColors_1.AppColors.primaryBlack,
2732
3253
  }} highlightStyle={styles_1.default.highlight} detectLinks={false}/>
2733
- </react_native_1.View>
3254
+ </react_native_1.View>
2734
3255
 
2735
- {/* Right: Copy Button */}
2736
- <CopyButton_1.default value={currentUrl} label="URL"/>
3256
+ {/* Right: Copy Button */}
3257
+ <CopyButton_1.default value={currentUrl} label="URL"/>
2737
3258
 
2738
- {/* Right: Globe Icon button to open browser */}
2739
- <TouchableScale_1.default onPress={() => react_native_1.Linking.openURL(currentUrl)} hitSlop={8} style={{
3259
+ {/* Right: Globe Icon button to open browser */}
3260
+ <TouchableScale_1.default onPress={() => react_native_1.Linking.openURL(currentUrl)} hitSlop={8} style={{
2740
3261
  width: 26,
2741
3262
  height: 26,
2742
3263
  borderRadius: 13,
@@ -2746,26 +3267,26 @@ const NetworkInspector = ({ enabled = true }) => {
2746
3267
  alignItems: 'center',
2747
3268
  justifyContent: 'center',
2748
3269
  }}>
2749
- <NetworkIcons_1.GlobeIcon size={11} color={AppColors_1.AppColors.purple}/>
2750
- </TouchableScale_1.default>
2751
- </react_native_1.View>
2752
- </react_native_1.View>);
3270
+ <NetworkIcons_1.GlobeIcon size={11} color={AppColors_1.AppColors.purple}/>
3271
+ </TouchableScale_1.default>
3272
+ </react_native_1.View>
3273
+ </react_native_1.View>);
2753
3274
  })()}
2754
3275
 
2755
- {/* ─── WebView Sub-Tabs (Now below Address Bar) ─── */}
2756
- <react_native_1.View style={{
3276
+ {/* ─── WebView Sub-Tabs (Now below Address Bar) ─── */}
3277
+ <react_native_1.View style={{
2757
3278
  backgroundColor: AppColors_1.AppColors.primaryLight,
2758
3279
  borderBottomWidth: 1,
2759
3280
  borderBottomColor: AppColors_1.AppColors.dividerColor,
2760
3281
  paddingVertical: 6,
2761
3282
  }}>
2762
- <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{
3283
+ <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={false} contentContainerStyle={{
2763
3284
  paddingHorizontal: 12,
2764
3285
  flexDirection: 'row',
2765
3286
  gap: 8,
2766
3287
  }}>
2767
- {/* Sub-tab 1: Preview */}
2768
- <react_native_1.Pressable style={[
3288
+ {/* Sub-tab 1: Preview */}
3289
+ <react_native_1.Pressable style={[
2769
3290
  {
2770
3291
  paddingVertical: 6,
2771
3292
  paddingHorizontal: 14,
@@ -2782,18 +3303,24 @@ const NetworkInspector = ({ enabled = true }) => {
2782
3303
  borderColor: AppColors_1.AppColors.purple,
2783
3304
  },
2784
3305
  ]} onPress={() => setWebViewSubTab('preview')}>
2785
- <NetworkIcons_1.EyeIcon color={webViewSubTab === 'preview' ? '#FFFFFF' : AppColors_1.AppColors.grayTextWeak} size={13}/>
2786
- <react_native_1.Text style={{
2787
- fontFamily: webViewSubTab === 'preview' ? AppFonts_1.AppFonts.interBold : AppFonts_1.AppFonts.interMedium,
3306
+ <NetworkIcons_1.EyeIcon color={webViewSubTab === 'preview'
3307
+ ? '#FFFFFF'
3308
+ : AppColors_1.AppColors.grayTextWeak} size={13}/>
3309
+ <react_native_1.Text style={{
3310
+ fontFamily: webViewSubTab === 'preview'
3311
+ ? AppFonts_1.AppFonts.interBold
3312
+ : AppFonts_1.AppFonts.interMedium,
2788
3313
  fontSize: 12,
2789
- color: webViewSubTab === 'preview' ? '#FFFFFF' : AppColors_1.AppColors.grayTextStrong,
3314
+ color: webViewSubTab === 'preview'
3315
+ ? '#FFFFFF'
3316
+ : AppColors_1.AppColors.grayTextStrong,
2790
3317
  }}>
2791
- Preview
2792
- </react_native_1.Text>
2793
- </react_native_1.Pressable>
3318
+ Preview
3319
+ </react_native_1.Text>
3320
+ </react_native_1.Pressable>
2794
3321
 
2795
- {/* Sub-tab 2: Page Source */}
2796
- <react_native_1.Pressable style={[
3322
+ {/* Sub-tab 2: Page Source */}
3323
+ <react_native_1.Pressable style={[
2797
3324
  {
2798
3325
  paddingVertical: 6,
2799
3326
  paddingHorizontal: 14,
@@ -2810,18 +3337,24 @@ const NetworkInspector = ({ enabled = true }) => {
2810
3337
  borderColor: AppColors_1.AppColors.purple,
2811
3338
  },
2812
3339
  ]} onPress={() => setWebViewSubTab('html')}>
2813
- <NetworkIcons_1.HtmlIcon color={webViewSubTab === 'html' ? '#FFFFFF' : AppColors_1.AppColors.grayTextWeak} size={13}/>
2814
- <react_native_1.Text style={{
2815
- fontFamily: webViewSubTab === 'html' ? AppFonts_1.AppFonts.interBold : AppFonts_1.AppFonts.interMedium,
3340
+ <NetworkIcons_1.HtmlIcon color={webViewSubTab === 'html'
3341
+ ? '#FFFFFF'
3342
+ : AppColors_1.AppColors.grayTextWeak} size={13}/>
3343
+ <react_native_1.Text style={{
3344
+ fontFamily: webViewSubTab === 'html'
3345
+ ? AppFonts_1.AppFonts.interBold
3346
+ : AppFonts_1.AppFonts.interMedium,
2816
3347
  fontSize: 12,
2817
- color: webViewSubTab === 'html' ? '#FFFFFF' : AppColors_1.AppColors.grayTextStrong,
3348
+ color: webViewSubTab === 'html'
3349
+ ? '#FFFFFF'
3350
+ : AppColors_1.AppColors.grayTextStrong,
2818
3351
  }}>
2819
- Page Source
2820
- </react_native_1.Text>
2821
- </react_native_1.Pressable>
3352
+ Page Source
3353
+ </react_native_1.Text>
3354
+ </react_native_1.Pressable>
2822
3355
 
2823
- {/* Sub-tab 3: History */}
2824
- <react_native_1.Pressable style={[
3356
+ {/* Sub-tab 3: History */}
3357
+ <react_native_1.Pressable style={[
2825
3358
  {
2826
3359
  paddingVertical: 6,
2827
3360
  paddingHorizontal: 14,
@@ -2838,18 +3371,24 @@ const NetworkInspector = ({ enabled = true }) => {
2838
3371
  borderColor: AppColors_1.AppColors.purple,
2839
3372
  },
2840
3373
  ]} onPress={() => setWebViewSubTab('navigation')}>
2841
- <NetworkIcons_1.ClockIcon color={webViewSubTab === 'navigation' ? '#FFFFFF' : AppColors_1.AppColors.grayTextWeak} size={13}/>
2842
- <react_native_1.Text style={{
2843
- fontFamily: webViewSubTab === 'navigation' ? AppFonts_1.AppFonts.interBold : AppFonts_1.AppFonts.interMedium,
3374
+ <NetworkIcons_1.ClockIcon color={webViewSubTab === 'navigation'
3375
+ ? '#FFFFFF'
3376
+ : AppColors_1.AppColors.grayTextWeak} size={13}/>
3377
+ <react_native_1.Text style={{
3378
+ fontFamily: webViewSubTab === 'navigation'
3379
+ ? AppFonts_1.AppFonts.interBold
3380
+ : AppFonts_1.AppFonts.interMedium,
2844
3381
  fontSize: 12,
2845
- color: webViewSubTab === 'navigation' ? '#FFFFFF' : AppColors_1.AppColors.grayTextStrong,
3382
+ color: webViewSubTab === 'navigation'
3383
+ ? '#FFFFFF'
3384
+ : AppColors_1.AppColors.grayTextStrong,
2846
3385
  }}>
2847
- History ({webViewNavHistory.length})
2848
- </react_native_1.Text>
2849
- </react_native_1.Pressable>
3386
+ History ({webViewNavHistory.length})
3387
+ </react_native_1.Text>
3388
+ </react_native_1.Pressable>
2850
3389
 
2851
- {/* Sub-tab 4: Console */}
2852
- <react_native_1.Pressable style={[
3390
+ {/* Sub-tab 4: Console */}
3391
+ <react_native_1.Pressable style={[
2853
3392
  {
2854
3393
  paddingVertical: 6,
2855
3394
  paddingHorizontal: 14,
@@ -2866,22 +3405,28 @@ const NetworkInspector = ({ enabled = true }) => {
2866
3405
  borderColor: AppColors_1.AppColors.purple,
2867
3406
  },
2868
3407
  ]} onPress={() => setWebViewSubTab('console')}>
2869
- <NetworkIcons_1.TerminalIcon color={webViewSubTab === 'console' ? '#FFFFFF' : AppColors_1.AppColors.grayTextWeak} size={13}/>
2870
- <react_native_1.Text style={{
2871
- fontFamily: webViewSubTab === 'console' ? AppFonts_1.AppFonts.interBold : AppFonts_1.AppFonts.interMedium,
3408
+ <NetworkIcons_1.TerminalIcon color={webViewSubTab === 'console'
3409
+ ? '#FFFFFF'
3410
+ : AppColors_1.AppColors.grayTextWeak} size={13}/>
3411
+ <react_native_1.Text style={{
3412
+ fontFamily: webViewSubTab === 'console'
3413
+ ? AppFonts_1.AppFonts.interBold
3414
+ : AppFonts_1.AppFonts.interMedium,
2872
3415
  fontSize: 12,
2873
- color: webViewSubTab === 'console' ? '#FFFFFF' : AppColors_1.AppColors.grayTextStrong,
3416
+ color: webViewSubTab === 'console'
3417
+ ? '#FFFFFF'
3418
+ : AppColors_1.AppColors.grayTextStrong,
2874
3419
  }}>
2875
- Console ({webViewLogs.length})
2876
- </react_native_1.Text>
2877
- </react_native_1.Pressable>
2878
- </react_native_1.ScrollView>
2879
- </react_native_1.View>
3420
+ Console ({webViewLogs.length})
3421
+ </react_native_1.Text>
3422
+ </react_native_1.Pressable>
3423
+ </react_native_1.ScrollView>
3424
+ </react_native_1.View>
2880
3425
 
2881
- {webViewSubTab === 'html' ? (<react_native_1.View style={{ flex: 1 }}>
2882
- {webViewHtml || webViewCss || webViewJs ? (<react_native_1.View style={{ flex: 1 }}>
2883
- {/* Clear Inspect Banner */}
2884
- {inspectedElement && (<react_native_1.View style={{
3426
+ {webViewSubTab === 'html' ? (<react_native_1.View style={{ flex: 1 }}>
3427
+ {webViewHtml || webViewCss || webViewJs ? (<react_native_1.View style={{ flex: 1 }}>
3428
+ {/* Clear Inspect Banner */}
3429
+ {inspectedElement && (<react_native_1.View style={{
2885
3430
  flexDirection: 'row',
2886
3431
  alignItems: 'center',
2887
3432
  justifyContent: 'space-between',
@@ -2891,36 +3436,44 @@ const NetworkInspector = ({ enabled = true }) => {
2891
3436
  borderBottomWidth: 1,
2892
3437
  borderBottomColor: AppColors_1.AppColors.dividerColor,
2893
3438
  }}>
2894
- <react_native_1.Text style={{
3439
+ <react_native_1.Text style={{
2895
3440
  fontFamily: AppFonts_1.AppFonts.interMedium,
2896
3441
  fontSize: 11.5,
2897
3442
  color: AppColors_1.AppColors.purple,
2898
3443
  flex: 1,
2899
3444
  }}>
2900
- Inspecting element:{' '}
2901
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold }}>
2902
- &lt;{inspectedElement.tagName}
2903
- {inspectedElement.id ? ` id="${inspectedElement.id}"` : ''}
2904
- {inspectedElement.className ? ` class="${inspectedElement.className.trim().split(/\s+/)[0]}"` : ''}
2905
- &gt;
2906
- </react_native_1.Text>
2907
- </react_native_1.Text>
2908
- <react_native_1.Pressable onPress={() => setInspectedElement(null)} style={{
3445
+ Inspecting element:{' '}
3446
+ <react_native_1.Text style={{
3447
+ fontFamily: AppFonts_1.AppFonts.interBold,
3448
+ }}>
3449
+ &lt;{inspectedElement.tagName}
3450
+ {inspectedElement.id
3451
+ ? ` id="${inspectedElement.id}"`
3452
+ : ''}
3453
+ {inspectedElement.className
3454
+ ? ` class="${inspectedElement.className
3455
+ .trim()
3456
+ .split(/\s+/)[0]}"`
3457
+ : ''}
3458
+ &gt;
3459
+ </react_native_1.Text>
3460
+ </react_native_1.Text>
3461
+ <react_native_1.Pressable onPress={() => setInspectedElement(null)} style={{
2909
3462
  paddingHorizontal: 8,
2910
3463
  paddingVertical: 4,
2911
3464
  }}>
2912
- <react_native_1.Text style={{
3465
+ <react_native_1.Text style={{
2913
3466
  fontFamily: AppFonts_1.AppFonts.interBold,
2914
3467
  fontSize: 11,
2915
3468
  color: AppColors_1.AppColors.purple,
2916
3469
  }}>
2917
- Clear Inspect
2918
- </react_native_1.Text>
2919
- </react_native_1.Pressable>
2920
- </react_native_1.View>)}
3470
+ Clear Inspect
3471
+ </react_native_1.Text>
3472
+ </react_native_1.Pressable>
3473
+ </react_native_1.View>)}
2921
3474
 
2922
- {/* Inner sub-tabs inside HTML source view */}
2923
- <react_native_1.View style={{
3475
+ {/* Inner sub-tabs inside HTML source view */}
3476
+ <react_native_1.View style={{
2924
3477
  flexDirection: 'row',
2925
3478
  borderBottomWidth: 1,
2926
3479
  borderBottomColor: AppColors_1.AppColors.dividerColor,
@@ -2928,7 +3481,7 @@ const NetworkInspector = ({ enabled = true }) => {
2928
3481
  paddingHorizontal: 12,
2929
3482
  gap: 12,
2930
3483
  }}>
2931
- {['html', 'css', 'javascript'].map(tab => {
3484
+ {['html', 'css', 'javascript'].map(tab => {
2932
3485
  const active = htmlSubTab === tab;
2933
3486
  const label = tab === 'html'
2934
3487
  ? 'HTML'
@@ -2951,10 +3504,16 @@ const NetworkInspector = ({ enabled = true }) => {
2951
3504
  alignItems: 'center',
2952
3505
  gap: 4,
2953
3506
  }}>
2954
- {tab === 'html' && (<NetworkIcons_1.HtmlIcon color={active ? activeColor : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
2955
- {tab === 'css' && (<NetworkIcons_1.CssIcon color={active ? activeColor : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
2956
- {tab === 'javascript' && (<NetworkIcons_1.JsIcon color={active ? activeColor : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
2957
- <react_native_1.Text style={{
3507
+ {tab === 'html' && (<NetworkIcons_1.HtmlIcon color={active
3508
+ ? activeColor
3509
+ : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
3510
+ {tab === 'css' && (<NetworkIcons_1.CssIcon color={active
3511
+ ? activeColor
3512
+ : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
3513
+ {tab === 'javascript' && (<NetworkIcons_1.JsIcon color={active
3514
+ ? activeColor
3515
+ : AppColors_1.AppColors.grayTextWeak} size={14}/>)}
3516
+ <react_native_1.Text style={{
2958
3517
  fontFamily: active
2959
3518
  ? AppFonts_1.AppFonts.interBold
2960
3519
  : AppFonts_1.AppFonts.interMedium,
@@ -2963,58 +3522,67 @@ const NetworkInspector = ({ enabled = true }) => {
2963
3522
  ? activeColor
2964
3523
  : AppColors_1.AppColors.grayTextWeak,
2965
3524
  }}>
2966
- {label}
2967
- </react_native_1.Text>
2968
- </react_native_1.Pressable>);
3525
+ {label}
3526
+ </react_native_1.Text>
3527
+ </react_native_1.Pressable>);
2969
3528
  })}
2970
- </react_native_1.View>
2971
- <react_native_1.View style={{ flex: 1, padding: 12 }}>
2972
- {!isHtmlTabReady ? (<react_native_1.View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', minHeight: 200 }}>
2973
- <react_native_1.ActivityIndicator size="large" color={AppColors_1.AppColors.purple}/>
2974
- </react_native_1.View>) : htmlSubTab === 'html' ? (webViewHtml ? (<CodeSnippet_1.default code={webViewHtml} language="html" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
3529
+ </react_native_1.View>
3530
+ <react_native_1.View style={{ flex: 1, padding: 12 }}>
3531
+ {!isHtmlTabReady ? (<react_native_1.View style={{
3532
+ flex: 1,
3533
+ justifyContent: 'center',
3534
+ alignItems: 'center',
3535
+ minHeight: 200,
3536
+ }}>
3537
+ <react_native_1.ActivityIndicator size="large" color={AppColors_1.AppColors.purple}/>
3538
+ </react_native_1.View>) : htmlSubTab === 'html' ? (webViewHtml ? (<CodeSnippet_1.default code={webViewHtml} language="html" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
2975
3539
  fontFamily: 'monospace',
2976
3540
  fontSize: 11,
2977
3541
  color: '#94A3B8',
2978
3542
  padding: 12,
2979
3543
  }}>
2980
- No HTML content captured.
2981
- </react_native_1.Text>)) : htmlSubTab === 'css' ? (webViewCss ? (<CodeSnippet_1.default code={webViewCss} language="css" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
3544
+ No HTML content captured.
3545
+ </react_native_1.Text>)) : htmlSubTab === 'css' ? (webViewCss ? (<CodeSnippet_1.default code={webViewCss} language="css" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
2982
3546
  fontFamily: 'monospace',
2983
3547
  fontSize: 11,
2984
3548
  color: '#94A3B8',
2985
3549
  padding: 12,
2986
3550
  }}>
2987
- No CSS styles detected on this page.
2988
- </react_native_1.Text>)) : webViewJs ? (<CodeSnippet_1.default code={webViewJs} language="javascript" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
3551
+ No CSS styles detected on this page.
3552
+ </react_native_1.Text>)) : webViewJs ? (<CodeSnippet_1.default code={webViewJs} language="javascript" search={getSearchTermForTab()}/>) : (<react_native_1.Text style={{
2989
3553
  fontFamily: 'monospace',
2990
3554
  fontSize: 11,
2991
3555
  color: '#94A3B8',
2992
3556
  padding: 12,
2993
3557
  }}>
2994
- No scripts detected on this page.
2995
- </react_native_1.Text>)}
2996
- </react_native_1.View>
2997
- </react_native_1.View>) : (<react_native_1.View style={styles_1.default.emptyContainer}>
2998
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
2999
- <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
3000
- </react_native_1.View>
3001
- <react_native_1.Text style={styles_1.default.emptyTitle}>
3002
- No Page Source Captured
3003
- </react_native_1.Text>
3004
- <react_native_1.Text style={styles_1.default.emptySub}>
3005
- Load a page in the WebView to inspect its HTML, CSS,
3006
- or Javascript source.
3007
- </react_native_1.Text>
3008
- </react_native_1.View>)}
3009
- </react_native_1.View>) : webViewSubTab === 'navigation' ? (<react_native_1.FlatList data={filteredNavHistory} keyExtractor={(item, index) => `${index}-${item.timestamp}`} style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }} ListHeaderComponent={<react_native_1.View style={{
3558
+ No scripts detected on this page.
3559
+ </react_native_1.Text>)}
3560
+ </react_native_1.View>
3561
+ </react_native_1.View>) : (<react_native_1.View style={styles_1.default.emptyContainer}>
3562
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
3563
+ <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
3564
+ </react_native_1.View>
3565
+ <react_native_1.Text style={styles_1.default.emptyTitle}>
3566
+ No Page Source Captured
3567
+ </react_native_1.Text>
3568
+ <react_native_1.Text style={styles_1.default.emptySub}>
3569
+ Load a page in the WebView to inspect its
3570
+ HTML, CSS, or Javascript source.
3571
+ </react_native_1.Text>
3572
+ </react_native_1.View>)}
3573
+ </react_native_1.View>) : webViewSubTab === 'navigation' ? (<react_native_1.FlatList data={filteredNavHistory} keyExtractor={(item, index) => `${index}-${item.timestamp}`} style={{
3574
+ flex: 1,
3575
+ backgroundColor: AppColors_1.AppColors.grayBackground,
3576
+ }} ListHeaderComponent={<react_native_1.View style={{
3010
3577
  paddingHorizontal: 16,
3011
3578
  paddingTop: 12,
3012
3579
  paddingBottom: 8,
3013
3580
  }}>
3014
- <react_native_1.Text style={styles_1.default.resultCount}>
3015
- Navigation History ({webViewNavHistory.length})
3016
- </react_native_1.Text>
3017
- </react_native_1.View>} renderItem={({ item, index, }) => {
3581
+ <react_native_1.Text style={styles_1.default.resultCount}>
3582
+ Navigation History ({webViewNavHistory.length}
3583
+ )
3584
+ </react_native_1.Text>
3585
+ </react_native_1.View>} renderItem={({ item, index, }) => {
3018
3586
  const isLatest = index === 0;
3019
3587
  const formatNavTime = (ts) => {
3020
3588
  const d = new Date(ts);
@@ -3026,7 +3594,9 @@ const NetworkInspector = ({ enabled = true }) => {
3026
3594
  borderRadius: 12,
3027
3595
  borderWidth: 1,
3028
3596
  borderColor: AppColors_1.AppColors.grayBorderSecondary,
3029
- backgroundColor: isLatest ? AppColors_1.AppColors.purpleShade50 : AppColors_1.AppColors.primaryLight,
3597
+ backgroundColor: isLatest
3598
+ ? AppColors_1.AppColors.purpleShade50
3599
+ : AppColors_1.AppColors.primaryLight,
3030
3600
  padding: 14,
3031
3601
  flexDirection: 'row',
3032
3602
  alignItems: 'center',
@@ -3038,23 +3608,23 @@ const NetworkInspector = ({ enabled = true }) => {
3038
3608
  shadowRadius: 4,
3039
3609
  elevation: 2,
3040
3610
  }}>
3041
- <react_native_1.View style={{ flex: 1, gap: 8 }}>
3042
- {/* Top row: Title and Badge */}
3043
- <react_native_1.View style={{
3611
+ <react_native_1.View style={{ flex: 1, gap: 8 }}>
3612
+ {/* Top row: Title and Badge */}
3613
+ <react_native_1.View style={{
3044
3614
  flexDirection: 'row',
3045
3615
  alignItems: 'center',
3046
3616
  gap: 8,
3047
3617
  flexWrap: 'wrap',
3048
3618
  }}>
3049
- <react_native_1.Text numberOfLines={1} ellipsizeMode="tail" style={{
3619
+ <react_native_1.Text numberOfLines={1} ellipsizeMode="tail" style={{
3050
3620
  fontFamily: AppFonts_1.AppFonts.interBold,
3051
3621
  fontSize: 14,
3052
3622
  color: AppColors_1.AppColors.primaryBlack,
3053
3623
  flexShrink: 1,
3054
3624
  }}>
3055
- {item.title || 'Untitled Page'}
3056
- </react_native_1.Text>
3057
- {isLatest && (<react_native_1.View style={{
3625
+ {item.title || 'Untitled Page'}
3626
+ </react_native_1.Text>
3627
+ {isLatest && (<react_native_1.View style={{
3058
3628
  flexDirection: 'row',
3059
3629
  alignItems: 'center',
3060
3630
  gap: 4,
@@ -3063,62 +3633,97 @@ const NetworkInspector = ({ enabled = true }) => {
3063
3633
  paddingVertical: 3,
3064
3634
  borderRadius: 12,
3065
3635
  }}>
3066
- <react_native_1.View style={{
3636
+ <react_native_1.View style={{
3067
3637
  width: 6,
3068
3638
  height: 6,
3069
3639
  borderRadius: 3,
3070
3640
  backgroundColor: AppColors_1.AppColors.greenBaggageText,
3071
3641
  }}/>
3072
- <react_native_1.Text style={{
3642
+ <react_native_1.Text style={{
3073
3643
  fontFamily: AppFonts_1.AppFonts.interBold,
3074
3644
  fontSize: 9.5,
3075
3645
  color: AppColors_1.AppColors.greenBaggageText,
3076
3646
  }}>
3077
- Active
3078
- </react_native_1.Text>
3079
- </react_native_1.View>)}
3080
- </react_native_1.View>
3647
+ Active
3648
+ </react_native_1.Text>
3649
+ </react_native_1.View>)}
3650
+ </react_native_1.View>
3081
3651
 
3082
- {/* Middle row: URL with Globe Icon */}
3083
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
3084
- <NetworkIcons_1.GlobeIcon size={12} color={AppColors_1.AppColors.grayTextWeak}/>
3085
- <HighlightText_1.default text={item.url} search={webViewSearch} numberOfLines={2} ellipsizeMode="tail" style={{
3652
+ {/* Middle row: URL with Globe Icon */}
3653
+ <react_native_1.View style={{
3654
+ flexDirection: 'row',
3655
+ alignItems: 'center',
3656
+ gap: 6,
3657
+ }}>
3658
+ <NetworkIcons_1.GlobeIcon size={12} color={AppColors_1.AppColors.grayTextWeak}/>
3659
+ <HighlightText_1.default text={item.url} search={webViewSearch} numberOfLines={2} ellipsizeMode="tail" style={{
3086
3660
  fontFamily: AppFonts_1.AppFonts.interRegular,
3087
3661
  fontSize: 12,
3088
3662
  color: AppColors_1.AppColors.grayText,
3089
3663
  flex: 1,
3090
3664
  }} highlightStyle={styles_1.default.highlight} detectLinks={true}/>
3091
- </react_native_1.View>
3665
+ </react_native_1.View>
3092
3666
 
3093
- {/* Bottom row: Time */}
3094
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 6 }}>
3095
- <NetworkIcons_1.ClockIcon size={11} color={AppColors_1.AppColors.grayTextWeak}/>
3096
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 11, color: AppColors_1.AppColors.grayTextWeak }}>
3097
- {formatNavTime(item.timestamp)}
3098
- </react_native_1.Text>
3099
- </react_native_1.View>
3100
- </react_native_1.View>
3101
- <CopyButton_1.default value={item.url} label="URL"/>
3102
- </react_native_1.View>);
3667
+ {/* Bottom row: Time */}
3668
+ <react_native_1.View style={{
3669
+ flexDirection: 'row',
3670
+ alignItems: 'center',
3671
+ gap: 6,
3672
+ }}>
3673
+ <NetworkIcons_1.ClockIcon size={11} color={AppColors_1.AppColors.grayTextWeak}/>
3674
+ <react_native_1.Text style={{
3675
+ fontFamily: AppFonts_1.AppFonts.interRegular,
3676
+ fontSize: 11,
3677
+ color: AppColors_1.AppColors.grayTextWeak,
3678
+ }}>
3679
+ {formatNavTime(item.timestamp)}
3680
+ </react_native_1.Text>
3681
+ </react_native_1.View>
3682
+ </react_native_1.View>
3683
+ <CopyButton_1.default value={item.url} label="URL"/>
3684
+ </react_native_1.View>);
3103
3685
  }} initialNumToRender={15} maxToRenderPerBatch={15} windowSize={7} removeClippedSubviews={true} ListEmptyComponent={<EmptyState_1.default isSearch={webViewSearch.length > 0}/>} contentContainerStyle={[
3104
3686
  styles_1.default.listContent,
3105
- filteredNavHistory.length === 0 && { flexGrow: 1 },
3106
- ]} keyboardShouldPersistTaps="handled"/>) : webViewSubTab === 'console' ? (<react_native_1.View style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }}>
3107
- {webViewLogs.length > 0 ? (<react_native_1.FlatList data={webViewLogs} keyExtractor={(item) => String(item.id)} style={{ flex: 1 }} ListHeaderComponent={<react_native_1.View style={{ paddingHorizontal: 16, paddingTop: 12, paddingBottom: 8, flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center' }}>
3108
- <react_native_1.Text style={styles_1.default.resultCount}>
3109
- Console Logs ({webViewLogs.length})
3110
- </react_native_1.Text>
3111
- <TouchableScale_1.default onPress={() => (0, webViewLogger_1.clearWebViewData)()} style={{ padding: 6, borderRadius: 6, backgroundColor: AppColors_1.AppColors.primaryLight, borderWidth: 1, borderColor: AppColors_1.AppColors.grayBorderSecondary }}>
3112
- <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={14}/>
3113
- </TouchableScale_1.default>
3114
- </react_native_1.View>} renderItem={({ item }) => {
3115
- const logColor = item.type === 'error' ? AppColors_1.AppColors.errorColor :
3116
- item.type === 'warn' ? AppColors_1.AppColors.warningIconGold :
3117
- item.type === 'info' ? AppColors_1.AppColors.skyBlue :
3118
- AppColors_1.AppColors.grayTextWeak;
3119
- const bgColor = item.type === 'error' ? 'rgba(255, 46, 87, 0.06)' :
3120
- item.type === 'warn' ? 'rgba(191, 162, 82, 0.08)' :
3121
- AppColors_1.AppColors.primaryLight;
3687
+ filteredNavHistory.length === 0 && {
3688
+ flexGrow: 1,
3689
+ },
3690
+ ]} keyboardShouldPersistTaps="handled"/>) : webViewSubTab === 'console' ? (<react_native_1.View style={{
3691
+ flex: 1,
3692
+ backgroundColor: AppColors_1.AppColors.grayBackground,
3693
+ }}>
3694
+ {webViewLogs.length > 0 ? (<react_native_1.FlatList data={webViewLogs} keyExtractor={(item) => String(item.id)} style={{ flex: 1 }} ListHeaderComponent={<react_native_1.View style={{
3695
+ paddingHorizontal: 16,
3696
+ paddingTop: 12,
3697
+ paddingBottom: 8,
3698
+ flexDirection: 'row',
3699
+ justifyContent: 'space-between',
3700
+ alignItems: 'center',
3701
+ }}>
3702
+ <react_native_1.Text style={styles_1.default.resultCount}>
3703
+ Console Logs ({webViewLogs.length})
3704
+ </react_native_1.Text>
3705
+ <TouchableScale_1.default onPress={() => (0, webViewLogger_1.clearWebViewData)()} style={{
3706
+ padding: 6,
3707
+ borderRadius: 6,
3708
+ backgroundColor: AppColors_1.AppColors.primaryLight,
3709
+ borderWidth: 1,
3710
+ borderColor: AppColors_1.AppColors.grayBorderSecondary,
3711
+ }}>
3712
+ <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor} size={14}/>
3713
+ </TouchableScale_1.default>
3714
+ </react_native_1.View>} renderItem={({ item }) => {
3715
+ const logColor = item.type === 'error'
3716
+ ? AppColors_1.AppColors.errorColor
3717
+ : item.type === 'warn'
3718
+ ? AppColors_1.AppColors.warningIconGold
3719
+ : item.type === 'info'
3720
+ ? AppColors_1.AppColors.skyBlue
3721
+ : AppColors_1.AppColors.grayTextWeak;
3722
+ const bgColor = item.type === 'error'
3723
+ ? 'rgba(255, 46, 87, 0.06)'
3724
+ : item.type === 'warn'
3725
+ ? 'rgba(191, 162, 82, 0.08)'
3726
+ : AppColors_1.AppColors.primaryLight;
3122
3727
  const d = new Date(item.timestamp);
3123
3728
  const timeStr = `${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}:${String(d.getSeconds()).padStart(2, '0')}`;
3124
3729
  return (<react_native_1.View style={{
@@ -3135,34 +3740,65 @@ const NetworkInspector = ({ enabled = true }) => {
3135
3740
  gap: 8,
3136
3741
  alignItems: 'flex-start',
3137
3742
  }}>
3138
- <react_native_1.View style={{ paddingTop: 1 }}>
3139
- <NetworkIcons_1.TerminalIcon color={logColor} size={11}/>
3140
- </react_native_1.View>
3141
- <react_native_1.View style={{ flex: 1, gap: 3 }}>
3142
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between' }}>
3143
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 10, color: logColor, textTransform: 'uppercase', letterSpacing: 0.5 }}>
3144
- {item.type}
3145
- </react_native_1.Text>
3146
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak }}>
3147
- {timeStr}
3148
- </react_native_1.Text>
3149
- </react_native_1.View>
3150
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 12, color: AppColors_1.AppColors.primaryBlack, lineHeight: 16 }}>
3151
- {item.message}
3152
- </react_native_1.Text>
3743
+ <react_native_1.View style={{ paddingTop: 1 }}>
3744
+ <NetworkIcons_1.TerminalIcon color={logColor} size={11}/>
3745
+ </react_native_1.View>
3746
+ <react_native_1.View style={{ flex: 1, gap: 3 }}>
3747
+ <react_native_1.View style={{
3748
+ flexDirection: 'row',
3749
+ alignItems: 'center',
3750
+ justifyContent: 'space-between',
3751
+ }}>
3752
+ <react_native_1.Text style={{
3753
+ fontFamily: AppFonts_1.AppFonts.interBold,
3754
+ fontSize: 10,
3755
+ color: logColor,
3756
+ textTransform: 'uppercase',
3757
+ letterSpacing: 0.5,
3758
+ }}>
3759
+ {item.type}
3760
+ </react_native_1.Text>
3761
+ <react_native_1.Text style={{
3762
+ fontFamily: AppFonts_1.AppFonts.interRegular,
3763
+ fontSize: 10,
3764
+ color: AppColors_1.AppColors.grayTextWeak,
3765
+ }}>
3766
+ {timeStr}
3767
+ </react_native_1.Text>
3768
+ </react_native_1.View>
3769
+ <react_native_1.Text style={{
3770
+ fontFamily: AppFonts_1.AppFonts.interRegular,
3771
+ fontSize: 12,
3772
+ color: AppColors_1.AppColors.primaryBlack,
3773
+ lineHeight: 16,
3774
+ }}>
3775
+ {item.message}
3776
+ </react_native_1.Text>
3777
+ </react_native_1.View>
3778
+ </react_native_1.View>);
3779
+ }} initialNumToRender={20} maxToRenderPerBatch={20} windowSize={7} contentContainerStyle={[
3780
+ styles_1.default.listContent,
3781
+ webViewLogs.length === 0 && { flexGrow: 1 },
3782
+ ]}/>) : (<react_native_1.View style={styles_1.default.emptyContainer}>
3783
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
3784
+ <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={32}/>
3153
3785
  </react_native_1.View>
3154
- </react_native_1.View>);
3155
- }} initialNumToRender={20} maxToRenderPerBatch={20} windowSize={7} contentContainerStyle={[styles_1.default.listContent, webViewLogs.length === 0 && { flexGrow: 1 }]}/>) : (<react_native_1.View style={styles_1.default.emptyContainer}>
3156
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
3157
- <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple} size={32}/>
3158
- </react_native_1.View>
3159
- <react_native_1.Text style={styles_1.default.emptyTitle}>No Console Logs</react_native_1.Text>
3160
- <react_native_1.Text style={styles_1.default.emptySub}>
3161
- Console logs from the WebView will appear here.
3162
- </react_native_1.Text>
3163
- </react_native_1.View>)}
3164
- </react_native_1.View>) : (<react_native_1.View style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }}>
3165
- {webViewHtml ? (OriginalWebView ? (<OriginalWebView source={{ html: webViewHtml, baseUrl: webViewHtmlUrl }} injectedJavaScript={previewInspectScript} onMessage={(event) => {
3786
+ <react_native_1.Text style={styles_1.default.emptyTitle}>
3787
+ No Console Logs
3788
+ </react_native_1.Text>
3789
+ <react_native_1.Text style={styles_1.default.emptySub}>
3790
+ Console logs from the WebView will appear
3791
+ here.
3792
+ </react_native_1.Text>
3793
+ </react_native_1.View>)}
3794
+ </react_native_1.View>) : (<react_native_1.View style={{
3795
+ flex: 1,
3796
+ backgroundColor: AppColors_1.AppColors.grayBackground,
3797
+ }}>
3798
+ {webViewHtml ? (OriginalWebView ? (<OriginalWebView source={{
3799
+ html: webViewHtml,
3800
+ baseUrl: webViewHtmlUrl,
3801
+ }} injectedJavaScript={previewInspectScript} onMessage={(event) => {
3166
3802
  try {
3167
3803
  const data = JSON.parse(event.nativeEvent.data);
3168
3804
  if (data.type === 'preview-inspect') {
@@ -3177,27 +3813,39 @@ const NetworkInspector = ({ enabled = true }) => {
3177
3813
  }
3178
3814
  }
3179
3815
  catch (err) { }
3180
- }} style={{ flex: 1 }}/>) : (<react_native_1.View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', padding: 20 }}>
3181
- <react_native_1.Text style={{ color: AppColors_1.AppColors.grayText, textAlign: 'center', fontFamily: AppFonts_1.AppFonts.interMedium }}>
3182
- react-native-webview is not installed in the target project. Install it to enable Preview mode.
3183
- </react_native_1.Text>
3184
- </react_native_1.View>)) : (<react_native_1.View style={styles_1.default.emptyContainer}>
3185
- <react_native_1.View style={styles_1.default.emptyIconWrap}>
3186
- <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
3187
- </react_native_1.View>
3188
- <react_native_1.Text style={styles_1.default.emptyTitle}>
3189
- No Preview Available
3190
- </react_native_1.Text>
3191
- <react_native_1.Text style={styles_1.default.emptySub}>
3192
- Load a page in the WebView to see its visual preview.
3193
- </react_native_1.Text>
3194
- </react_native_1.View>)}
3195
- </react_native_1.View>)}
3196
- </react_native_1.View>)) : activeTab === 'redux' ? (renderReduxTab()) : (<react_native_1.View style={{ flex: 1 }}>
3197
- {/* Non-scrollable details header */}
3198
- <react_native_1.View style={{ paddingHorizontal: 6, paddingTop: 4 }}>
3199
- <react_native_1.View style={styles_1.default.detailInfoBar}>
3200
- {(() => {
3816
+ }} style={{ flex: 1 }}/>) : (<react_native_1.View style={{
3817
+ flex: 1,
3818
+ justifyContent: 'center',
3819
+ alignItems: 'center',
3820
+ padding: 20,
3821
+ }}>
3822
+ <react_native_1.Text style={{
3823
+ color: AppColors_1.AppColors.grayText,
3824
+ textAlign: 'center',
3825
+ fontFamily: AppFonts_1.AppFonts.interMedium,
3826
+ }}>
3827
+ react-native-webview is not installed in the
3828
+ target project. Install it to enable Preview
3829
+ mode.
3830
+ </react_native_1.Text>
3831
+ </react_native_1.View>)) : (<react_native_1.View style={styles_1.default.emptyContainer}>
3832
+ <react_native_1.View style={styles_1.default.emptyIconWrap}>
3833
+ <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.purple} size={32}/>
3834
+ </react_native_1.View>
3835
+ <react_native_1.Text style={styles_1.default.emptyTitle}>
3836
+ No Preview Available
3837
+ </react_native_1.Text>
3838
+ <react_native_1.Text style={styles_1.default.emptySub}>
3839
+ Load a page in the WebView to see its visual
3840
+ preview.
3841
+ </react_native_1.Text>
3842
+ </react_native_1.View>)}
3843
+ </react_native_1.View>)}
3844
+ </react_native_1.View>)) : activeTab === 'redux' ? (renderReduxTab()) : (<react_native_1.View style={{ flex: 1 }}>
3845
+ {/* Non-scrollable details header */}
3846
+ <react_native_1.View style={{ paddingHorizontal: 6, paddingTop: 4 }}>
3847
+ <react_native_1.View style={styles_1.default.detailInfoBar}>
3848
+ {(() => {
3201
3849
  let hostStr = '';
3202
3850
  let pathStr = detailDisplayUrl;
3203
3851
  let queryStr = '';
@@ -3226,31 +3874,29 @@ const NetworkInspector = ({ enabled = true }) => {
3226
3874
  }
3227
3875
  catch (e) { }
3228
3876
  return (<>
3229
- <react_native_1.View style={styles_1.default.detailInfoTop}>
3230
- <react_native_1.View style={{
3877
+ <react_native_1.View style={styles_1.default.detailInfoTop}>
3878
+ <react_native_1.View style={{
3231
3879
  flexDirection: 'row',
3232
3880
  alignItems: 'center',
3233
3881
  gap: 8,
3234
3882
  }}>
3235
- <react_native_1.View style={[
3883
+ <react_native_1.View style={[
3236
3884
  styles_1.default.methodBadge,
3237
3885
  {
3238
- backgroundColor: `${constants_1.METHOD_COLORS[selected.method] ??
3239
- constants_1.METHOD_COLORS.ALL}15`,
3886
+ backgroundColor: `${constants_1.METHOD_COLORS[selected.method] ?? constants_1.METHOD_COLORS.ALL}15`,
3240
3887
  },
3241
3888
  ]}>
3242
- <react_native_1.Text style={[
3889
+ <react_native_1.Text style={[
3243
3890
  styles_1.default.methodBadgeText,
3244
3891
  {
3245
- color: constants_1.METHOD_COLORS[selected.method] ??
3246
- constants_1.METHOD_COLORS.ALL,
3892
+ color: constants_1.METHOD_COLORS[selected.method] ?? constants_1.METHOD_COLORS.ALL,
3247
3893
  },
3248
3894
  ]}>
3249
- {selected.method}
3250
- </react_native_1.Text>
3251
- </react_native_1.View>
3895
+ {selected.method}
3896
+ </react_native_1.Text>
3897
+ </react_native_1.View>
3252
3898
 
3253
- {selected.status != null && (<react_native_1.View style={[
3899
+ {selected.status != null && (<react_native_1.View style={[
3254
3900
  styles_1.default.chip,
3255
3901
  {
3256
3902
  backgroundColor: selected.status === 0
@@ -3261,10 +3907,10 @@ const NetworkInspector = ({ enabled = true }) => {
3261
3907
  : `${(0, helpers_1.getStatusColor)(selected.status)}40`,
3262
3908
  },
3263
3909
  ]}>
3264
- {selected.status === 0 ? (<NetworkIcons_1.FailIcon size={8} color={AppColors_1.AppColors.errorColor}/>) : (<react_native_svg_1.default width={6} height={6} viewBox="0 0 10 10" fill="none">
3265
- <react_native_svg_1.Circle cx="5" cy="5" r="5" fill={(0, helpers_1.getStatusColor)(selected.status)}/>
3266
- </react_native_svg_1.default>)}
3267
- <react_native_1.Text style={[
3910
+ {selected.status === 0 ? (<NetworkIcons_1.FailIcon size={8} color={AppColors_1.AppColors.errorColor}/>) : (<react_native_svg_1.default width={6} height={6} viewBox="0 0 10 10" fill="none">
3911
+ <react_native_svg_1.Circle cx="5" cy="5" r="5" fill={(0, helpers_1.getStatusColor)(selected.status)}/>
3912
+ </react_native_svg_1.default>)}
3913
+ <react_native_1.Text style={[
3268
3914
  styles_1.default.chipText,
3269
3915
  {
3270
3916
  color: selected.status === 0
@@ -3272,29 +3918,38 @@ const NetworkInspector = ({ enabled = true }) => {
3272
3918
  : (0, helpers_1.getStatusColor)(selected.status),
3273
3919
  },
3274
3920
  ]}>
3275
- {selected.status === 0
3921
+ {selected.status === 0
3276
3922
  ? 'Failed'
3277
3923
  : String(selected.status)}
3278
- </react_native_1.Text>
3279
- </react_native_1.View>)}
3924
+ </react_native_1.Text>
3925
+ </react_native_1.View>)}
3280
3926
 
3281
- {selected.duration != null && (<react_native_1.View style={[styles_1.default.chip, { backgroundColor: 'rgba(104,75,155,0.08)', borderColor: 'rgba(104,75,155,0.18)' }]}>
3282
- <react_native_1.Text style={[styles_1.default.chipText, { color: AppColors_1.AppColors.purple }]}>
3283
- {selected.duration}ms
3284
- </react_native_1.Text>
3285
- </react_native_1.View>)}
3286
- </react_native_1.View>
3287
- <react_native_1.View style={styles_1.default.detailInfoRight}>
3288
- <TouchableScale_1.default style={styles_1.default.iconSquareBtn} onPress={() => react_native_1.Linking.openURL(detailDisplayUrl)} hitSlop={12}>
3289
- <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
3290
- </TouchableScale_1.default>
3291
- <CopyButton_1.default value={(0, helpers_1.getFetchCommand)(selected)} label="fetch()" iconType="fetch"/>
3292
- <CopyButton_1.default value={(0, helpers_1.getCurlCommand)(selected)} label="cURL" iconType="terminal"/>
3293
- <CopyButton_1.default value={detailDisplayUrl} label="URL"/>
3294
- </react_native_1.View>
3295
- </react_native_1.View>
3927
+ {selected.duration != null && (<react_native_1.View style={[
3928
+ styles_1.default.chip,
3929
+ {
3930
+ backgroundColor: 'rgba(104,75,155,0.08)',
3931
+ borderColor: 'rgba(104,75,155,0.18)',
3932
+ },
3933
+ ]}>
3934
+ <react_native_1.Text style={[
3935
+ styles_1.default.chipText,
3936
+ { color: AppColors_1.AppColors.purple },
3937
+ ]}>
3938
+ {selected.duration}ms
3939
+ </react_native_1.Text>
3940
+ </react_native_1.View>)}
3941
+ </react_native_1.View>
3942
+ <react_native_1.View style={styles_1.default.detailInfoRight}>
3943
+ <TouchableScale_1.default style={styles_1.default.iconSquareBtn} onPress={() => react_native_1.Linking.openURL(detailDisplayUrl)} hitSlop={12}>
3944
+ <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
3945
+ </TouchableScale_1.default>
3946
+ <CopyButton_1.default value={(0, helpers_1.getFetchCommand)(selected)} label="fetch()" iconType="fetch"/>
3947
+ <CopyButton_1.default value={(0, helpers_1.getCurlCommand)(selected)} label="cURL" iconType="terminal"/>
3948
+ <CopyButton_1.default value={detailDisplayUrl} label="URL"/>
3949
+ </react_native_1.View>
3950
+ </react_native_1.View>
3296
3951
 
3297
- <react_native_1.Pressable style={{
3952
+ <react_native_1.Pressable style={{
3298
3953
  backgroundColor: AppColors_1.AppColors.grayBackground,
3299
3954
  borderRadius: 10,
3300
3955
  borderWidth: 1,
@@ -3302,28 +3957,59 @@ const NetworkInspector = ({ enabled = true }) => {
3302
3957
  padding: 10,
3303
3958
  marginTop: 6,
3304
3959
  }} onPress={() => react_native_1.Linking.openURL(detailDisplayUrl)}>
3305
- <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', marginBottom: 2 }}>
3306
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interMedium, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, flex: 1 }} numberOfLines={1}>
3307
- {hostStr || 'API Endpoint'}
3308
- </react_native_1.Text>
3309
- {queryStr ? (<react_native_1.View style={{ backgroundColor: 'rgba(104,75,155,0.08)', paddingHorizontal: 5, paddingVertical: 1, borderRadius: 4 }}>
3310
- <react_native_1.Text style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 8.5, color: AppColors_1.AppColors.purple }}>Query Params</react_native_1.Text>
3311
- </react_native_1.View>) : null}
3312
- </react_native_1.View>
3313
- <react_native_1.Text selectable={true} style={{ fontFamily: AppFonts_1.AppFonts.interBold, fontSize: 12, color: AppColors_1.AppColors.primaryBlack, marginTop: 2 }} numberOfLines={2}>
3314
- {pathStr}
3315
- </react_native_1.Text>
3316
- {queryStr ? (<react_native_1.Text selectable={true} style={{ fontFamily: AppFonts_1.AppFonts.interRegular, fontSize: 10, color: AppColors_1.AppColors.grayTextWeak, marginTop: 4 }} numberOfLines={1}>
3317
- {queryStr}
3318
- </react_native_1.Text>) : null}
3319
- </react_native_1.Pressable>
3320
- </>);
3960
+ <react_native_1.View style={{
3961
+ flexDirection: 'row',
3962
+ alignItems: 'center',
3963
+ justifyContent: 'space-between',
3964
+ marginBottom: 2,
3965
+ }}>
3966
+ <react_native_1.Text style={{
3967
+ fontFamily: AppFonts_1.AppFonts.interMedium,
3968
+ fontSize: 10,
3969
+ color: AppColors_1.AppColors.grayTextWeak,
3970
+ flex: 1,
3971
+ }} numberOfLines={1}>
3972
+ {hostStr || 'API Endpoint'}
3973
+ </react_native_1.Text>
3974
+ {queryStr ? (<react_native_1.View style={{
3975
+ backgroundColor: 'rgba(104,75,155,0.08)',
3976
+ paddingHorizontal: 5,
3977
+ paddingVertical: 1,
3978
+ borderRadius: 4,
3979
+ }}>
3980
+ <react_native_1.Text style={{
3981
+ fontFamily: AppFonts_1.AppFonts.interBold,
3982
+ fontSize: 8.5,
3983
+ color: AppColors_1.AppColors.purple,
3984
+ }}>
3985
+ Query Params
3986
+ </react_native_1.Text>
3987
+ </react_native_1.View>) : null}
3988
+ </react_native_1.View>
3989
+ <react_native_1.Text selectable={true} style={{
3990
+ fontFamily: AppFonts_1.AppFonts.interBold,
3991
+ fontSize: 12,
3992
+ color: AppColors_1.AppColors.primaryBlack,
3993
+ marginTop: 2,
3994
+ }} numberOfLines={2}>
3995
+ {pathStr}
3996
+ </react_native_1.Text>
3997
+ {queryStr ? (<react_native_1.Text selectable={true} style={{
3998
+ fontFamily: AppFonts_1.AppFonts.interRegular,
3999
+ fontSize: 10,
4000
+ color: AppColors_1.AppColors.grayTextWeak,
4001
+ marginTop: 4,
4002
+ }} numberOfLines={1}>
4003
+ {queryStr}
4004
+ </react_native_1.Text>) : null}
4005
+ </react_native_1.Pressable>
4006
+ </>);
3321
4007
  })()}
3322
- </react_native_1.View>
3323
- </react_native_1.View>
4008
+ </react_native_1.View>
4009
+ </react_native_1.View>
3324
4010
 
3325
- {/* Sticky Segment Control */}
3326
- <react_native_1.View style={{
4011
+ {/* Sticky Segment Control */}
4012
+ <react_native_1.View style={{
3327
4013
  flexDirection: 'row',
3328
4014
  backgroundColor: AppColors_1.AppColors.grayBackground,
3329
4015
  borderRadius: 10,
@@ -3334,7 +4020,12 @@ const NetworkInspector = ({ enabled = true }) => {
3334
4020
  borderWidth: 1,
3335
4021
  borderColor: AppColors_1.AppColors.dividerColor,
3336
4022
  }}>
3337
- {['metadata', 'headers', 'request', 'response'].map(tab => {
4023
+ {[
4024
+ 'metadata',
4025
+ 'headers',
4026
+ 'request',
4027
+ 'response',
4028
+ ].map(tab => {
3338
4029
  const isActive = apiDetailActiveTab === tab;
3339
4030
  if (tab === 'request' && selected.request == null)
3340
4031
  return null;
@@ -3348,7 +4039,9 @@ const NetworkInspector = ({ enabled = true }) => {
3348
4039
  return 'Response';
3349
4040
  };
3350
4041
  const getIcon = () => {
3351
- const iconColor = isActive ? '#FFFFFF' : AppColors_1.AppColors.grayText;
4042
+ const iconColor = isActive
4043
+ ? '#FFFFFF'
4044
+ : AppColors_1.AppColors.grayText;
3352
4045
  if (tab === 'metadata')
3353
4046
  return <NetworkIcons_1.StatusIcon color={iconColor}/>;
3354
4047
  if (tab === 'headers')
@@ -3364,115 +4057,129 @@ const NetworkInspector = ({ enabled = true }) => {
3364
4057
  alignItems: 'center',
3365
4058
  justifyContent: 'center',
3366
4059
  borderRadius: 8,
3367
- backgroundColor: isActive ? AppColors_1.AppColors.purple : 'transparent',
4060
+ backgroundColor: isActive
4061
+ ? AppColors_1.AppColors.purple
4062
+ : 'transparent',
3368
4063
  gap: 4,
3369
4064
  }}>
3370
- {getIcon()}
3371
- <react_native_1.Text style={{
4065
+ {getIcon()}
4066
+ <react_native_1.Text style={{
3372
4067
  fontFamily: AppFonts_1.AppFonts.interBold,
3373
4068
  fontSize: 10,
3374
- color: isActive ? '#FFFFFF' : AppColors_1.AppColors.grayText,
4069
+ color: isActive
4070
+ ? '#FFFFFF'
4071
+ : AppColors_1.AppColors.grayText,
3375
4072
  }}>
3376
- {getLabel()}
3377
- </react_native_1.Text>
3378
- </react_native_1.TouchableOpacity>);
4073
+ {getLabel()}
4074
+ </react_native_1.Text>
4075
+ </react_native_1.TouchableOpacity>);
3379
4076
  })}
3380
- </react_native_1.View>
4077
+ </react_native_1.View>
3381
4078
 
3382
- {/* Scrollable Tab Content */}
3383
- <react_native_1.ScrollView style={styles_1.default.detailScroll} contentContainerStyle={{ paddingHorizontal: 6, paddingBottom: 24 }} showsVerticalScrollIndicator={true}>
3384
- {apiDetailActiveTab === 'metadata' && (<>
3385
- <MetaAccordion_1.default status={selected.status} statusColor={(0, helpers_1.getStatusColor)(selected.status)} duration={selected.duration} size={(0, helpers_1.getSize)(selected.response)} triggeredAt={(0, helpers_1.formatDateTime)(selected.startTime)} method={selected.method} contentType={selected.responseHeaders?.['content-type'] ||
4079
+ {/* Scrollable Tab Content */}
4080
+ <react_native_1.ScrollView style={styles_1.default.detailScroll} contentContainerStyle={{
4081
+ paddingHorizontal: 6,
4082
+ paddingBottom: 24,
4083
+ }} showsVerticalScrollIndicator={true}>
4084
+ {apiDetailActiveTab === 'metadata' && (<>
4085
+ <MetaAccordion_1.default status={selected.status} statusColor={(0, helpers_1.getStatusColor)(selected.status)} duration={selected.duration} size={(0, helpers_1.getSize)(selected.response)} triggeredAt={(0, helpers_1.formatDateTime)(selected.startTime)} method={selected.method} contentType={selected.responseHeaders?.['content-type'] ||
3386
4086
  selected.responseHeaders?.['Content-Type']} url={selected.url}/>
3387
4087
 
3388
- {(() => {
4088
+ {(() => {
3389
4089
  const routeInfo = logRouteMapRef.current.get(selected.id);
3390
4090
  if (!routeInfo || routeInfo.path === 'Navigators')
3391
4091
  return null;
3392
4092
  return <SourcePageCard_1.default routeInfo={routeInfo}/>;
3393
4093
  })()}
3394
4094
 
3395
- {(() => {
4095
+ {(() => {
3396
4096
  const cType = selected.responseHeaders?.['content-type'] ||
3397
4097
  selected.responseHeaders?.['Content-Type'];
3398
4098
  if (cType?.includes('image/')) {
3399
4099
  return (<react_native_1.View style={styles_1.default.imagePreviewWrapper}>
3400
- <react_native_1.Image source={{ uri: selected.url }} style={styles_1.default.imagePreview} resizeMode="contain"/>
3401
- <TouchableScale_1.default style={styles_1.default.imageDownloadBtn} onPress={() => react_native_1.Linking.openURL(selected.url)} hitSlop={10}>
3402
- <NetworkIcons_1.DownloadIcon color={AppColors_1.AppColors.purple} size={18}/>
3403
- </TouchableScale_1.default>
3404
- </react_native_1.View>);
4100
+ <react_native_1.Image source={{ uri: selected.url }} style={styles_1.default.imagePreview} resizeMode="contain"/>
4101
+ <TouchableScale_1.default style={styles_1.default.imageDownloadBtn} onPress={() => react_native_1.Linking.openURL(selected.url)} hitSlop={10}>
4102
+ <NetworkIcons_1.DownloadIcon color={AppColors_1.AppColors.purple} size={18}/>
4103
+ </TouchableScale_1.default>
4104
+ </react_native_1.View>);
3405
4105
  }
3406
4106
  return null;
3407
4107
  })()}
3408
- </>)}
4108
+ </>)}
3409
4109
 
3410
- {apiDetailActiveTab === 'headers' && (<>
3411
- <react_native_1.View style={styles_1.default.detailSearchRow}>
3412
- <react_native_1.View style={styles_1.default.detailSearchBox}>
3413
- <react_native_1.TextInput placeholder="Search headers..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
3414
- {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
3415
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
3416
- </react_native_1.Pressable>)}
3417
- </react_native_1.View>
3418
- </react_native_1.View>
4110
+ {apiDetailActiveTab === 'headers' && (<>
4111
+ <react_native_1.View style={styles_1.default.detailSearchRow}>
4112
+ <react_native_1.View style={styles_1.default.detailSearchBox}>
4113
+ <react_native_1.TextInput placeholder="Search headers..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
4114
+ {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
4115
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
4116
+ </react_native_1.Pressable>)}
4117
+ </react_native_1.View>
4118
+ </react_native_1.View>
3419
4119
 
3420
- <HeadersSection_1.default title="Request Headers" headers={selected.requestHeaders} search={detailSearch} resetKey={selected.id}/>
3421
- <HeadersSection_1.default title="Response Headers" headers={selected.responseHeaders} search={detailSearch} resetKey={selected.id}/>
3422
- </>)}
4120
+ <HeadersSection_1.default title="Request Headers" headers={selected.requestHeaders} search={detailSearch} resetKey={selected.id}/>
4121
+ <HeadersSection_1.default title="Response Headers" headers={selected.responseHeaders} search={detailSearch} resetKey={selected.id}/>
4122
+ </>)}
3423
4123
 
3424
- {apiDetailActiveTab === 'request' && selected.request != null && (<>
3425
- <react_native_1.View style={styles_1.default.detailSearchRow}>
3426
- <react_native_1.View style={styles_1.default.detailSearchBox}>
3427
- <react_native_1.TextInput placeholder="Search request..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
3428
- {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
3429
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
3430
- </react_native_1.Pressable>)}
3431
- </react_native_1.View>
3432
- </react_native_1.View>
4124
+ {apiDetailActiveTab === 'request' &&
4125
+ selected.request != null && (<>
4126
+ <react_native_1.View style={styles_1.default.detailSearchRow}>
4127
+ <react_native_1.View style={styles_1.default.detailSearchBox}>
4128
+ <react_native_1.TextInput placeholder="Search request..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
4129
+ {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
4130
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
4131
+ </react_native_1.Pressable>)}
4132
+ </react_native_1.View>
4133
+ </react_native_1.View>
3433
4134
 
3434
- <react_native_1.View style={styles_1.default.sectionContainer}>
3435
- <SectionHeader_1.default title="Request" value={selected.request} expanded={reqExpanded} onToggleExpand={() => setReqExpanded(v => !v)} showDiff={prevRequestData != null} isDiffing={showReqDiff} onToggleDiff={() => {
4135
+ <react_native_1.View style={styles_1.default.sectionContainer}>
4136
+ <SectionHeader_1.default title="Request" value={selected.request} expanded={reqExpanded} onToggleExpand={() => setReqExpanded(v => !v)} showDiff={prevRequestData != null} isDiffing={showReqDiff} onToggleDiff={() => {
3436
4137
  setShowReqDiff(v => !v);
3437
4138
  if (!reqExpanded && !showReqDiff)
3438
4139
  setReqExpanded(true);
3439
4140
  }}/>
3440
- {showReqDiff ? (<DiffViewer_1.default oldData={prevRequestData} newData={selected.request} forceOpen={reqExpanded}/>) : (<JsonViewer_1.default data={selected.request} search={detailSearch} forceOpen={reqExpanded}/>)}
3441
- </react_native_1.View>
3442
- </>)}
4141
+ {showReqDiff ? (<DiffViewer_1.default oldData={prevRequestData} newData={selected.request} forceOpen={reqExpanded}/>) : (<JsonViewer_1.default data={selected.request} search={detailSearch} forceOpen={reqExpanded}/>)}
4142
+ </react_native_1.View>
4143
+ </>)}
3443
4144
 
3444
- {apiDetailActiveTab === 'response' && (<>
3445
- <react_native_1.View style={styles_1.default.detailSearchRow}>
3446
- <react_native_1.View style={styles_1.default.detailSearchBox}>
3447
- <react_native_1.TextInput placeholder="Search response..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
3448
- {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
3449
- <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
3450
- </react_native_1.Pressable>)}
3451
- </react_native_1.View>
3452
- </react_native_1.View>
4145
+ {apiDetailActiveTab === 'response' && (<>
4146
+ <react_native_1.View style={styles_1.default.detailSearchRow}>
4147
+ <react_native_1.View style={styles_1.default.detailSearchBox}>
4148
+ <react_native_1.TextInput placeholder="Search response..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={detailSearch} onChangeText={setDetailSearch} style={styles_1.default.detailSearchInput} autoCorrect={false} autoCapitalize="none"/>
4149
+ {detailSearch.length > 0 && (<react_native_1.Pressable onPress={() => setDetailSearch('')} hitSlop={10} style={{ padding: 8 }}>
4150
+ <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
4151
+ </react_native_1.Pressable>)}
4152
+ </react_native_1.View>
4153
+ </react_native_1.View>
3453
4154
 
3454
- <react_native_1.View style={styles_1.default.sectionContainer}>
3455
- <SectionHeader_1.default title="Response" value={selected.response} expanded={resExpanded} onToggleExpand={() => setResExpanded(v => !v)} showDiff={prevResponseData != null} isDiffing={showResDiff} onToggleDiff={() => {
4155
+ <react_native_1.View style={styles_1.default.sectionContainer}>
4156
+ <SectionHeader_1.default title="Response" value={selected.response} expanded={resExpanded} onToggleExpand={() => setResExpanded(v => !v)} showDiff={prevResponseData != null} isDiffing={showResDiff} onToggleDiff={() => {
3456
4157
  setShowResDiff(v => !v);
3457
4158
  if (!resExpanded && !showResDiff)
3458
4159
  setResExpanded(true);
3459
4160
  }}/>
3460
- {showResDiff ? (<DiffViewer_1.default oldData={prevResponseData} newData={selected.response} forceOpen={resExpanded}/>) : (<JsonViewer_1.default data={selected.response} search={detailSearch} forceOpen={resExpanded}/>)}
3461
- </react_native_1.View>
3462
- </>)}
3463
- </react_native_1.ScrollView>
3464
- </react_native_1.View>)) : (<react_native_1.View style={styles_1.default.empty}>
3465
- <react_native_1.ActivityIndicator size="large" color={AppColors_1.AppColors.purple}/>
3466
- <react_native_1.Text style={[styles_1.default.emptySub, { marginTop: 12 }]}>
3467
- Loading logs...
3468
- </react_native_1.Text>
3469
- </react_native_1.View>)}
4161
+ {showResDiff ? (<DiffViewer_1.default oldData={prevResponseData} newData={selected.response} forceOpen={resExpanded}/>) : (<JsonViewer_1.default data={selected.response} search={detailSearch} forceOpen={resExpanded}/>)}
4162
+ </react_native_1.View>
4163
+ </>)}
4164
+ </react_native_1.ScrollView>
4165
+ </react_native_1.View>)) : (<react_native_1.View style={styles_1.default.empty}>
4166
+ <react_native_1.ActivityIndicator size="large" color={AppColors_1.AppColors.purple}/>
4167
+ <react_native_1.Text style={[styles_1.default.emptySub, { marginTop: 12 }]}>
4168
+ Loading logs...
4169
+ </react_native_1.Text>
4170
+ </react_native_1.View>)}
3470
4171
 
3471
- {settingsPage !== null && (<react_native_1.View style={[react_native_1.StyleSheet.absoluteFill, { backgroundColor: AppColors_1.AppColors.grayBackground, zIndex: 99999 }]}>
3472
- {renderSettings()}
3473
- </react_native_1.View>)}
4172
+ {settingsPage !== null && (<react_native_1.View style={[
4173
+ react_native_1.StyleSheet.absoluteFill,
4174
+ {
4175
+ backgroundColor: AppColors_1.AppColors.grayBackground,
4176
+ zIndex: 99999,
4177
+ },
4178
+ ]}>
4179
+ {renderSettings()}
4180
+ </react_native_1.View>)}
4181
+ </react_native_1.View>
3474
4182
  </react_native_1.View>
3475
- </react_native_1.View>
3476
4183
  </ErrorBoundary_1.default>)}
3477
4184
  </react_native_1.Modal>
3478
4185
  </>);