react-native-inapp-inspector 2.5.2 → 2.5.3

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

@@ -1,5 +1,5 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(h,x,f,b){b===void 0&&(b=f);var T=Object.getOwnPropertyDescriptor(x,f);(!T||("get"in T?!x.__esModule:T.writable||T.configurable))&&(T={enumerable:!0,get:function(){return x[f]}}),Object.defineProperty(h,b,T)}):(function(h,x,f,b){b===void 0&&(b=f),h[b]=x[f]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(h,x){Object.defineProperty(h,"default",{enumerable:!0,value:x})}):function(h,x){h.default=x}),__importStar=this&&this.__importStar||(function(){var h=function(x){return h=Object.getOwnPropertyNames||function(f){var b=[];for(var T in f)Object.prototype.hasOwnProperty.call(f,T)&&(b[b.length]=T);return b},h(x)};return function(x){if(x&&x.__esModule)return x;var f={};if(x!=null)for(var b=h(x),T=0;T<b.length;T++)b[T]!=="default"&&__createBinding(f,x,b[T]);return __setModuleDefault(f,x),f}})(),__importDefault=this&&this.__importDefault||function(h){return h&&h.__esModule?h:{default:h}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.NetworkFilterModal=exports.isNetworkFiltersDefault=exports.DEFAULT_NETWORK_FILTERS=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),NetworkIcons_1=require("../NetworkIcons"),TouchableScale_1=__importDefault(require("../TouchableScale"));exports.DEFAULT_NETWORK_FILTERS={statusCodes:new Set(["all"]),methods:new Set(["all"]),latency:"all",protocol:"all",sortBy:"time_desc"};const isNetworkFiltersDefault=h=>(h.statusCodes.has("all")||h.statusCodes.size===0)&&(h.methods.has("all")||h.methods.size===0)&&h.latency==="all"&&h.protocol==="all"&&h.sortBy==="time_desc";exports.isNetworkFiltersDefault=isNetworkFiltersDefault;const NetworkFilterModal=({visible:h,onClose:x,filters:f,onApply:b,searchQuery:T=""})=>{const{logs:S}=(0,InspectorContext_1.useInspector)(),[o,k]=(0,react_1.useState)(()=>({...f,statusCodes:new Set(f.statusCodes),methods:new Set(f.methods)}));(0,react_1.useEffect)(()=>{h&&k({...f,statusCodes:new Set(f.statusCodes),methods:new Set(f.methods)})},[h,f]);const g=(0,react_1.useMemo)(()=>{const e={all:S.length,"2xx":0,"3xx":0,"4xx":0,"5xx":0,failed:0},t={all:S.length};let C=0,_=0,w=0,F=0,B=0;for(const A of S){const v=typeof A.status=="number"?A.status:parseInt(String(A.status),10);A.status===0||A.status==null?e.failed=(e.failed||0)+1:isNaN(v)||(v>=200&&v<300?e["2xx"]=(e["2xx"]||0)+1:v>=300&&v<400?e["3xx"]=(e["3xx"]||0)+1:v>=400&&v<500?e["4xx"]=(e["4xx"]||0)+1:v>=500&&(e["5xx"]=(e["5xx"]||0)+1));const P=(A.method||"GET").toUpperCase();t[P]=(t[P]||0)+1;const I=A.duration||0;I<200?C++:I<=500?_++:w++,(A.url||"").toLowerCase().startsWith("https")?F++:B++}return{statusMap:e,methodMap:t,fastCount:C,normalCount:_,slowCount:w,httpsCount:F,httpCount:B}},[S]),m=(0,react_1.useMemo)(()=>S.filter(e=>{if(!o.statusCodes.has("all")&&o.statusCodes.size>0){const _=typeof e.status=="number"?e.status:parseInt(String(e.status),10);let w=!1;if(o.statusCodes.has("failed")&&(e.status===0||e.status==null)&&(w=!0),o.statusCodes.has("2xx")&&!isNaN(_)&&_>=200&&_<300&&(w=!0),o.statusCodes.has("3xx")&&!isNaN(_)&&_>=300&&_<400&&(w=!0),o.statusCodes.has("4xx")&&!isNaN(_)&&_>=400&&_<500&&(w=!0),o.statusCodes.has("5xx")&&!isNaN(_)&&_>=500&&(w=!0),!w)return!1}if(!o.methods.has("all")&&o.methods.size>0){const _=(e.method||"GET").toUpperCase();if(!o.methods.has(_))return!1}const t=e.duration||0;if(o.latency==="fast"&&t>=200||o.latency==="normal"&&(t<200||t>500)||o.latency==="slow"&&t<=500)return!1;const C=(e.url||"").toLowerCase().startsWith("https");if(o.protocol==="https"&&!C||o.protocol==="http"&&C)return!1;if(T.trim().length>0){const _=T.toLowerCase();if(!(e.url||"").toLowerCase().includes(_))return!1}return!0}).length,[S,o,T]),z=e=>{k(t=>{const C=new Set(t.statusCodes);return e==="all"?{...t,statusCodes:new Set(["all"])}:(C.delete("all"),C.has(e)?(C.delete(e),C.size===0&&C.add("all")):C.add(e),{...t,statusCodes:C})})},V=e=>{k(t=>{const C=new Set(t.methods);return e==="all"?{...t,methods:new Set(["all"])}:(C.delete("all"),C.has(e)?(C.delete(e),C.size===0&&C.add("all")):C.add(e),{...t,methods:C})})},M=()=>{k({statusCodes:new Set(["all"]),methods:new Set(["all"]),latency:"all",protocol:"all",sortBy:"time_desc"})},R=()=>{b(o),x()},O=(0,react_1.useMemo)(()=>{let e=0;return!o.statusCodes.has("all")&&o.statusCodes.size>0&&(e+=o.statusCodes.size),!o.methods.has("all")&&o.methods.size>0&&(e+=o.methods.size),o.latency!=="all"&&e++,o.protocol!=="all"&&e++,o.sortBy!=="time_desc"&&e++,e},[o]);return<react_native_1.Modal visible={h}transparent animationType="fade"onRequestClose={x}>
-      <react_native_1.Pressable style={styles.overlay}onPress={x}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(h,f,x,b){b===void 0&&(b=x);var T=Object.getOwnPropertyDescriptor(f,x);(!T||("get"in T?!f.__esModule:T.writable||T.configurable))&&(T={enumerable:!0,get:function(){return f[x]}}),Object.defineProperty(h,b,T)}):(function(h,f,x,b){b===void 0&&(b=x),h[b]=f[x]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(h,f){Object.defineProperty(h,"default",{enumerable:!0,value:f})}):function(h,f){h.default=f}),__importStar=this&&this.__importStar||(function(){var h=function(f){return h=Object.getOwnPropertyNames||function(x){var b=[];for(var T in x)Object.prototype.hasOwnProperty.call(x,T)&&(b[b.length]=T);return b},h(f)};return function(f){if(f&&f.__esModule)return f;var x={};if(f!=null)for(var b=h(f),T=0;T<b.length;T++)b[T]!=="default"&&__createBinding(x,f,b[T]);return __setModuleDefault(x,f),x}})(),__importDefault=this&&this.__importDefault||function(h){return h&&h.__esModule?h:{default:h}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.NetworkFilterModal=exports.isNetworkFiltersDefault=exports.DEFAULT_NETWORK_FILTERS=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),NetworkIcons_1=require("../NetworkIcons"),TouchableScale_1=__importDefault(require("../TouchableScale")),i18n_1=require("../../i18n");exports.DEFAULT_NETWORK_FILTERS={statusCodes:new Set(["all"]),methods:new Set(["all"]),latency:"all",protocol:"all",sortBy:"time_desc"};const isNetworkFiltersDefault=h=>(h.statusCodes.has("all")||h.statusCodes.size===0)&&(h.methods.has("all")||h.methods.size===0)&&h.latency==="all"&&h.protocol==="all"&&h.sortBy==="time_desc";exports.isNetworkFiltersDefault=isNetworkFiltersDefault;const NetworkFilterModal=({visible:h,onClose:f,filters:x,onApply:b,searchQuery:T=""})=>{const{logs:m}=(0,InspectorContext_1.useInspector)(),{t:w}=(0,i18n_1.useTranslation)(),[o,S]=(0,react_1.useState)(()=>({...x,statusCodes:new Set(x.statusCodes),methods:new Set(x.methods)}));(0,react_1.useEffect)(()=>{h&&S({...x,statusCodes:new Set(x.statusCodes),methods:new Set(x.methods)})},[h,x]);const g=(0,react_1.useMemo)(()=>{const e={all:m.length,"2xx":0,"3xx":0,"4xx":0,"5xx":0,failed:0},t={all:m.length};let C=0,_=0,A=0,O=0,B=0;for(const v of m){const k=typeof v.status=="number"?v.status:parseInt(String(v.status),10);v.status===0||v.status==null?e.failed=(e.failed||0)+1:isNaN(k)||(k>=200&&k<300?e["2xx"]=(e["2xx"]||0)+1:k>=300&&k<400?e["3xx"]=(e["3xx"]||0)+1:k>=400&&k<500?e["4xx"]=(e["4xx"]||0)+1:k>=500&&(e["5xx"]=(e["5xx"]||0)+1));const P=(v.method||"GET").toUpperCase();t[P]=(t[P]||0)+1;const I=v.duration||0;I<200?C++:I<=500?_++:A++,(v.url||"").toLowerCase().startsWith("https")?O++:B++}return{statusMap:e,methodMap:t,fastCount:C,normalCount:_,slowCount:A,httpsCount:O,httpCount:B}},[m]),z=(0,react_1.useMemo)(()=>m.filter(e=>{if(!o.statusCodes.has("all")&&o.statusCodes.size>0){const _=typeof e.status=="number"?e.status:parseInt(String(e.status),10);let A=!1;if(o.statusCodes.has("failed")&&(e.status===0||e.status==null)&&(A=!0),o.statusCodes.has("2xx")&&!isNaN(_)&&_>=200&&_<300&&(A=!0),o.statusCodes.has("3xx")&&!isNaN(_)&&_>=300&&_<400&&(A=!0),o.statusCodes.has("4xx")&&!isNaN(_)&&_>=400&&_<500&&(A=!0),o.statusCodes.has("5xx")&&!isNaN(_)&&_>=500&&(A=!0),!A)return!1}if(!o.methods.has("all")&&o.methods.size>0){const _=(e.method||"GET").toUpperCase();if(!o.methods.has(_))return!1}const t=e.duration||0;if(o.latency==="fast"&&t>=200||o.latency==="normal"&&(t<200||t>500)||o.latency==="slow"&&t<=500)return!1;const C=(e.url||"").toLowerCase().startsWith("https");if(o.protocol==="https"&&!C||o.protocol==="http"&&C)return!1;if(T.trim().length>0){const _=T.toLowerCase();if(!(e.url||"").toLowerCase().includes(_))return!1}return!0}).length,[m,o,T]),M=e=>{S(t=>{const C=new Set(t.statusCodes);return e==="all"?{...t,statusCodes:new Set(["all"])}:(C.delete("all"),C.has(e)?(C.delete(e),C.size===0&&C.add("all")):C.add(e),{...t,statusCodes:C})})},V=e=>{S(t=>{const C=new Set(t.methods);return e==="all"?{...t,methods:new Set(["all"])}:(C.delete("all"),C.has(e)?(C.delete(e),C.size===0&&C.add("all")):C.add(e),{...t,methods:C})})},R=()=>{S({statusCodes:new Set(["all"]),methods:new Set(["all"]),latency:"all",protocol:"all",sortBy:"time_desc"})},L=()=>{b(o),f()},F=(0,react_1.useMemo)(()=>{let e=0;return!o.statusCodes.has("all")&&o.statusCodes.size>0&&(e+=o.statusCodes.size),!o.methods.has("all")&&o.methods.size>0&&(e+=o.methods.size),o.latency!=="all"&&e++,o.protocol!=="all"&&e++,o.sortBy!=="time_desc"&&e++,e},[o]);return<react_native_1.Modal visible={h}transparent animationType="fade"onRequestClose={f}>
+      <react_native_1.Pressable style={styles.overlay}onPress={f}>
         <react_native_1.Pressable style={styles.modalCard}onPress={e=>e.stopPropagation()}>
           
           <react_native_1.View style={styles.header}>
@@ -9,15 +9,15 @@
               </react_native_1.View>
               <react_native_1.View>
                 <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6}}>
-                  <react_native_1.Text style={styles.title}>Network Filters</react_native_1.Text>
-                  {O>0&&<react_native_1.View style={styles.activeBadge}>
-                      <react_native_1.Text style={styles.activeBadgeText}>{O} active</react_native_1.Text>
+                  <react_native_1.Text style={styles.title}>{w("filters.networkFiltersTitle","Network Filters")}</react_native_1.Text>
+                  {F>0&&<react_native_1.View style={styles.activeBadge}>
+                      <react_native_1.Text style={styles.activeBadgeText}>{F} {w("common.active","active")}</react_native_1.Text>
                     </react_native_1.View>}
                 </react_native_1.View>
-                <react_native_1.Text style={styles.subtitle}>Filter requests by status, method & speed</react_native_1.Text>
+                <react_native_1.Text style={styles.subtitle}>{w("filters.networkFiltersSubtitle","Filter requests by status, method & speed")}</react_native_1.Text>
               </react_native_1.View>
             </react_native_1.View>
-            <react_native_1.TouchableOpacity onPress={x}hitSlop={10}style={styles.closeBtn}>
+            <react_native_1.TouchableOpacity onPress={f}hitSlop={10}style={styles.closeBtn}>
               <NetworkIcons_1.CloseWhite size={14}color={AppColors_1.AppColors.grayText}/>
             </react_native_1.TouchableOpacity>
           </react_native_1.View>
@@ -25,9 +25,9 @@
           <react_native_1.ScrollView style={styles.scrollArea}contentContainerStyle={styles.scrollContent}showsVerticalScrollIndicator={!1}>
             
             <react_native_1.View style={styles.section}>
-              <react_native_1.Text style={styles.sectionTitle}>HTTP STATUS CODE</react_native_1.Text>
+              <react_native_1.Text style={styles.sectionTitle}>{w("filters.httpStatusCode","HTTP STATUS CODE")}</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
-                {[{key:"all",label:"All Statuses",color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.LayersIcon,count:g.statusMap.all},{key:"2xx",label:"2xx Success",color:AppColors_1.AppColors.greenColor,icon:NetworkIcons_1.CircleCheckIcon,count:g.statusMap["2xx"]||0},{key:"3xx",label:"3xx Redirect",color:AppColors_1.AppColors.warningIconGold,icon:NetworkIcons_1.RepeatIcon,count:g.statusMap["3xx"]||0},{key:"4xx",label:"4xx Client Error",color:AppColors_1.AppColors.darkOrange,icon:NetworkIcons_1.CircleAlertIcon,count:g.statusMap["4xx"]||0},{key:"5xx",label:"5xx Server Error",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.CircleXIcon,count:g.statusMap["5xx"]||0},{key:"failed",label:"Network Failed / 0",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.ShieldAlertIcon,count:g.statusMap.failed||0}].map(e=>{const t=o.statusCodes.has(e.key),C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>z(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
+                {[{key:"all",label:w("common.all","All Statuses"),color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.LayersIcon,count:g.statusMap.all},{key:"2xx",label:"2xx Success",color:AppColors_1.AppColors.greenColor,icon:NetworkIcons_1.CircleCheckIcon,count:g.statusMap["2xx"]||0},{key:"3xx",label:"3xx Redirect",color:AppColors_1.AppColors.warningIconGold,icon:NetworkIcons_1.RepeatIcon,count:g.statusMap["3xx"]||0},{key:"4xx",label:"4xx Client Error",color:AppColors_1.AppColors.darkOrange,icon:NetworkIcons_1.CircleAlertIcon,count:g.statusMap["4xx"]||0},{key:"5xx",label:"5xx Server Error",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.CircleXIcon,count:g.statusMap["5xx"]||0},{key:"failed",label:"Network Failed / 0",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.ShieldAlertIcon,count:g.statusMap.failed||0}].map(e=>{const t=o.statusCodes.has(e.key),C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>M(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
                       <C size={13}color={t?e.color:AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[styles.chipLabel,t&&{color:e.color,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                         {e.label}
@@ -43,12 +43,12 @@
 
             
             <react_native_1.View style={styles.section}>
-              <react_native_1.Text style={styles.sectionTitle}>HTTP METHOD</react_native_1.Text>
+              <react_native_1.Text style={styles.sectionTitle}>{w("filters.httpMethod","HTTP METHOD")}</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
                 <react_native_1.TouchableOpacity activeOpacity={.7}onPress={()=>V("all")}style={[styles.chip,o.methods.has("all")&&{backgroundColor:`${AppColors_1.AppColors.purple}15`,borderColor:AppColors_1.AppColors.purple}]}>
                   <NetworkIcons_1.LayersIcon size={12}color={o.methods.has("all")?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextWeak}/>
                   <react_native_1.Text style={[styles.chipLabel,o.methods.has("all")&&{color:AppColors_1.AppColors.purple,fontFamily:AppFonts_1.AppFonts.interBold}]}>
-                    All Methods
+                    {w("common.all","All Methods")}
                   </react_native_1.Text>
                   <react_native_1.View style={[styles.countPill,o.methods.has("all")&&{backgroundColor:`${AppColors_1.AppColors.purple}25`}]}>
                     <react_native_1.Text style={[styles.countPillText,o.methods.has("all")&&{color:AppColors_1.AppColors.purple}]}>
@@ -73,9 +73,9 @@
 
             
             <react_native_1.View style={styles.section}>
-              <react_native_1.Text style={styles.sectionTitle}>LATENCY & SPEED</react_native_1.Text>
+              <react_native_1.Text style={styles.sectionTitle}>{w("filters.latencySpeed","LATENCY & SPEED")}</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
-                {[{key:"all",label:"All Speeds",color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.LayersIcon},{key:"fast",label:"Fast (<200ms)",color:AppColors_1.AppColors.greenColor,icon:NetworkIcons_1.BoltIcon,count:g.fastCount},{key:"normal",label:"Normal (200-500ms)",color:AppColors_1.AppColors.skyBlue,icon:NetworkIcons_1.ClockIcon,count:g.normalCount},{key:"slow",label:"Slow (>500ms)",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.CircleAlertIcon,count:g.slowCount}].map(e=>{const t=o.latency===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>k(_=>({..._,latency:e.key}))}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
+                {[{key:"all",label:w("common.all","All Speeds"),color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.LayersIcon},{key:"fast",label:"Fast (<200ms)",color:AppColors_1.AppColors.greenColor,icon:NetworkIcons_1.BoltIcon,count:g.fastCount},{key:"normal",label:"Normal (200-500ms)",color:AppColors_1.AppColors.skyBlue,icon:NetworkIcons_1.ClockIcon,count:g.normalCount},{key:"slow",label:"Slow (>500ms)",color:AppColors_1.AppColors.errorColor,icon:NetworkIcons_1.CircleAlertIcon,count:g.slowCount}].map(e=>{const t=o.latency===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>S(_=>({..._,latency:e.key}))}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
                       <C size={13}color={t?e.color:AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[styles.chipLabel,t&&{color:e.color,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                         {e.label}
@@ -91,9 +91,9 @@
 
             
             <react_native_1.View style={styles.section}>
-              <react_native_1.Text style={styles.sectionTitle}>PROTOCOL</react_native_1.Text>
+              <react_native_1.Text style={styles.sectionTitle}>{w("filters.protocol","PROTOCOL")}</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
-                {[{key:"all",label:"All Protocols",color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.GlobeIcon},{key:"https",label:"HTTPS Secure",color:AppColors_1.AppColors.mintGreenText,icon:NetworkIcons_1.LockIcon,count:g.httpsCount},{key:"http",label:"HTTP Insecure",color:AppColors_1.AppColors.amber700,icon:NetworkIcons_1.UnlockIcon,count:g.httpCount}].map(e=>{const t=o.protocol===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>k(_=>({..._,protocol:e.key}))}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
+                {[{key:"all",label:w("common.all","All Protocols"),color:AppColors_1.AppColors.purple,icon:NetworkIcons_1.GlobeIcon},{key:"https",label:"HTTPS Secure",color:AppColors_1.AppColors.mintGreenText,icon:NetworkIcons_1.LockIcon,count:g.httpsCount},{key:"http",label:"HTTP Insecure",color:AppColors_1.AppColors.amber700,icon:NetworkIcons_1.UnlockIcon,count:g.httpCount}].map(e=>{const t=o.protocol===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>S(_=>({..._,protocol:e.key}))}style={[styles.chip,t&&{backgroundColor:`${e.color}15`,borderColor:e.color}]}>
                       <C size={13}color={t?e.color:AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[styles.chipLabel,t&&{color:e.color,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                         {e.label}
@@ -109,9 +109,9 @@
 
             
             <react_native_1.View style={styles.section}>
-              <react_native_1.Text style={styles.sectionTitle}>SORT BY</react_native_1.Text>
+              <react_native_1.Text style={styles.sectionTitle}>{w("filters.sortBy","SORT BY")}</react_native_1.Text>
               <react_native_1.View style={styles.chipsWrap}>
-                {[{key:"time_desc",label:"Newest First (Default)",icon:NetworkIcons_1.ClockIcon},{key:"time_asc",label:"Oldest First",icon:NetworkIcons_1.HourglassIcon},{key:"duration_desc",label:"Slowest Response",icon:NetworkIcons_1.TurtleIcon},{key:"duration_asc",label:"Fastest Response",icon:NetworkIcons_1.RocketIcon},{key:"size_desc",label:"Largest Response Size",icon:NetworkIcons_1.PackageIcon}].map(e=>{const t=o.sortBy===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>k(_=>({..._,sortBy:e.key}))}style={[styles.chip,t&&{backgroundColor:`${AppColors_1.AppColors.purple}15`,borderColor:AppColors_1.AppColors.purple}]}>
+                {[{key:"time_desc",label:"Newest First",icon:NetworkIcons_1.ClockIcon},{key:"time_asc",label:"Oldest First",icon:NetworkIcons_1.HourglassIcon},{key:"duration_desc",label:"Slowest Response",icon:NetworkIcons_1.TurtleIcon},{key:"duration_asc",label:"Fastest Response",icon:NetworkIcons_1.RocketIcon},{key:"size_desc",label:"Largest Response Size",icon:NetworkIcons_1.PackageIcon}].map(e=>{const t=o.sortBy===e.key,C=e.icon;return<react_native_1.TouchableOpacity key={e.key}activeOpacity={.7}onPress={()=>S(_=>({..._,sortBy:e.key}))}style={[styles.chip,t&&{backgroundColor:`${AppColors_1.AppColors.purple}15`,borderColor:AppColors_1.AppColors.purple}]}>
                       <C size={13}color={t?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextWeak}/>
                       <react_native_1.Text style={[styles.chipLabel,t&&{color:AppColors_1.AppColors.purple,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                         {e.label}
@@ -123,13 +123,13 @@
 
           
           <react_native_1.View style={styles.footer}>
-            <TouchableScale_1.default onPress={M}style={styles.resetBtn}>
-              <react_native_1.Text style={styles.resetBtnText}>Reset All</react_native_1.Text>
+            <TouchableScale_1.default onPress={R}style={styles.resetBtn}>
+              <react_native_1.Text style={styles.resetBtnText}>{w("filters.resetAll","Reset All")}</react_native_1.Text>
             </TouchableScale_1.default>
 
-            <TouchableScale_1.default onPress={R}style={styles.applyBtn}>
+            <TouchableScale_1.default onPress={L}style={styles.applyBtn}>
               <react_native_1.Text style={styles.applyBtnText}>
-                Apply ({m} Request{m===1?"":"s"})
+                {w("filters.applyFilters","Apply")} ({z})
               </react_native_1.Text>
             </TouchableScale_1.default>
           </react_native_1.View>

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

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,e,o,t){t===void 0&&(t=o);var n=Object.getOwnPropertyDescriptor(e,o);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[o]}}),Object.defineProperty(r,t,n)}):(function(r,e,o,t){t===void 0&&(t=o),r[t]=e[o]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,e){Object.defineProperty(r,"default",{enumerable:!0,value:e})}):function(r,e){r.default=e}),__importStar=this&&this.__importStar||(function(){var r=function(e){return r=Object.getOwnPropertyNames||function(o){var t=[];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[t.length]=n);return t},r(e)};return function(e){if(e&&e.__esModule)return e;var o={};if(e!=null)for(var t=r(e),n=0;n<t.length;n++)t[n]!=="default"&&__createBinding(o,e,t[n]);return __setModuleDefault(o,e),o}})(),__importDefault=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.SecondaryTelemetryStrip=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),react_native_linear_gradient_1=__importDefault(require("react-native-linear-gradient")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),NativeInspector_1=require("../../native/NativeInspector"),networkLogger_1=require("../../customHooks/networkLogger"),InspectorContext_1=require("./InspectorContext"),i18n_1=require("../../i18n"),SecondaryTelemetryStrip=()=>{const{t:r}=(0,i18n_1.useTranslation)(),{switchActiveTab:e,peekMode:o}=(0,InspectorContext_1.useInspector)(),[t,n]=(0,react_1.useState)(60),[a,I]=(0,react_1.useState)(null),[f,y]=(0,react_1.useState)(0),g=(0,react_1.useRef)(0),S=(0,react_1.useRef)(Date.now());(0,react_1.useEffect)(()=>{let i;const c=()=>{g.current++;const l=Date.now(),u=l-S.current;if(u>=1e3){const h=Math.min(60,Math.round(g.current*1e3/u));n(h),g.current=0,S.current=l}i=requestAnimationFrame(c)};return i=requestAnimationFrame(c),()=>cancelAnimationFrame(i)},[]);const p=(0,react_1.useRef)(0),v=(0,react_1.useRef)(Date.now());(0,react_1.useEffect)(()=>{const i=(0,networkLogger_1.subscribeNetworkLogs)(l=>{if(!l||l.length===0){y(0);return}const u=Date.now(),h=l.slice(0,10);let w=0,A=0,_=0;for(const s of h){let B=0,F=0;s.request&&(B=typeof s.request=="string"?s.request.length:JSON.stringify(s.request).length),s.response&&(F=typeof s.response=="string"?s.response.length:JSON.stringify(s.response).length);const m=B+F;if(m>0&&s.duration&&s.duration>0){const x=m*8/(s.duration/1e3)/1e3;x>0&&_===0&&(_=x),w+=m,A+=s.duration}}let d=0;A>0&&w>0?d=w*8/(A/1e3)/1e3:_>0&&(d=_),d>0?(p.current=d,v.current=u,y(Math.round(d*10)/10)):p.current>0&&u-v.current<12e3&&y(Math.round(p.current*10)/10)}),c=setInterval(()=>{Date.now()-v.current>15e3&&p.current>0&&(p.current=0,y(0))},3e3);return()=>{i(),clearInterval(c)}},[]),(0,react_1.useEffect)(()=>{let i=!0;const c=async()=>{try{const u=await(0,NativeInspector_1.getNativeDeviceMetrics)();i&&u&&I(u)}catch{}};c();const l=setInterval(c,4e3);return()=>{i=!1,clearInterval(l)}},[]);const M=t>=55?AppColors_1.AppColors.emerald400:t>=30?AppColors_1.AppColors.amber400:AppColors_1.AppColors.rose400,C=(0,react_1.useMemo)(()=>{if(a?.usedRAM&&a?.totalRAM){const i=(a.usedRAM/1073741824).toFixed(2),c=(a.totalRAM/(1024*1024*1024)).toFixed(1);return`${i} / ${c} GB RAM`}return a?.residentMemory?`${(a.residentMemory/1073741824).toFixed(2)} GB RAM`:a?.usedRAM?`${(a.usedRAM/1073741824).toFixed(2)} GB RAM`:null},[a]),b=a?.batteryPercent,T=a?.isCharging;return<react_native_linear_gradient_1.default colors={[AppColors_1.AppColors.telemetrySubHeaderGradStart||"#0B0F1C",AppColors_1.AppColors.telemetrySubHeaderGradMid||"#111524",AppColors_1.AppColors.telemetrySubHeaderGradEnd||"#0B0F1C"]}start={{x:0,y:0}}end={{x:1,y:0}}style={stripStyles.container}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,e,o,t){t===void 0&&(t=o);var n=Object.getOwnPropertyDescriptor(e,o);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[o]}}),Object.defineProperty(r,t,n)}):(function(r,e,o,t){t===void 0&&(t=o),r[t]=e[o]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,e){Object.defineProperty(r,"default",{enumerable:!0,value:e})}):function(r,e){r.default=e}),__importStar=this&&this.__importStar||(function(){var r=function(e){return r=Object.getOwnPropertyNames||function(o){var t=[];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[t.length]=n);return t},r(e)};return function(e){if(e&&e.__esModule)return e;var o={};if(e!=null)for(var t=r(e),n=0;n<t.length;n++)t[n]!=="default"&&__createBinding(o,e,t[n]);return __setModuleDefault(o,e),o}})(),__importDefault=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.SecondaryTelemetryStrip=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),react_native_linear_gradient_1=__importDefault(require("react-native-linear-gradient")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),NativeInspector_1=require("../../native/NativeInspector"),networkLogger_1=require("../../customHooks/networkLogger"),InspectorContext_1=require("./InspectorContext"),i18n_1=require("../../i18n"),SecondaryTelemetryStrip=()=>{const{t:r}=(0,i18n_1.useTranslation)(),{switchActiveTab:e,peekMode:o}=(0,InspectorContext_1.useInspector)(),[t,n]=(0,react_1.useState)(60),[a,F]=(0,react_1.useState)(null),[f,y]=(0,react_1.useState)(0),v=(0,react_1.useRef)(0),S=(0,react_1.useRef)(Date.now());(0,react_1.useEffect)(()=>{let s;const c=()=>{v.current++;const l=Date.now(),u=l-S.current;if(u>=1e3){const h=Math.min(60,Math.round(v.current*1e3/u));n(h),v.current=0,S.current=l}s=requestAnimationFrame(c)};return s=requestAnimationFrame(c),()=>cancelAnimationFrame(s)},[]);const p=(0,react_1.useRef)(0),g=(0,react_1.useRef)(Date.now());(0,react_1.useEffect)(()=>{const s=(0,networkLogger_1.subscribeNetworkLogs)(l=>{if(!l||l.length===0){y(0);return}const u=Date.now(),h=l.slice(0,10);let m=0,w=0,_=0;for(const i of h){let x=0,B=0;i.request&&(x=typeof i.request=="string"?i.request.length:JSON.stringify(i.request).length),i.response&&(B=typeof i.response=="string"?i.response.length:JSON.stringify(i.response).length);const A=x+B;if(A>0&&i.duration&&i.duration>0){const I=A*8/(i.duration/1e3)/1e3;I>0&&_===0&&(_=I),m+=A,w+=i.duration}}let d=0;w>0&&m>0?d=m*8/(w/1e3)/1e3:_>0&&(d=_),d>0?(p.current=d,g.current=u,y(Math.round(d*10)/10)):p.current>0&&u-g.current<12e3&&y(Math.round(p.current*10)/10)}),c=setInterval(()=>{Date.now()-g.current>15e3&&p.current>0&&(p.current=0,y(0))},3e3);return()=>{s(),clearInterval(c)}},[]),(0,react_1.useEffect)(()=>{let s=!0;const c=async()=>{try{const u=await(0,NativeInspector_1.getNativeDeviceMetrics)();s&&u&&F(u)}catch{}};c();const l=setInterval(c,4e3);return()=>{s=!1,clearInterval(l)}},[]);const M=t>=55?AppColors_1.AppColors.emerald400:t>=30?AppColors_1.AppColors.amber400:AppColors_1.AppColors.rose400,C=(0,react_1.useMemo)(()=>{if(a?.usedRAM&&a?.totalRAM){const s=(a.usedRAM/1073741824).toFixed(2),c=(a.totalRAM/(1024*1024*1024)).toFixed(1);return`${s} / ${c} GB RAM`}return a?.residentMemory?`${(a.residentMemory/1073741824).toFixed(2)} GB RAM`:a?.usedRAM?`${(a.usedRAM/1073741824).toFixed(2)} GB RAM`:null},[a]),b=a?.batteryPercent,T=a?.isCharging;return<react_native_linear_gradient_1.default colors={[AppColors_1.AppColors.telemetrySubHeaderGradStart,AppColors_1.AppColors.telemetrySubHeaderGradMid,AppColors_1.AppColors.telemetrySubHeaderGradEnd]}start={{x:0,y:0}}end={{x:1,y:0}}style={stripStyles.container}>
       <react_native_1.TouchableOpacity activeOpacity={.8}onPress={()=>e?.("device")}style={stripStyles.inner}>
         
         <react_native_1.View style={stripStyles.item}>
@@ -12,8 +12,8 @@
 
         
         <react_native_1.View style={stripStyles.item}>
-          <NetworkIcons_1.SpeedIcon size={11.5}color={AppColors_1.AppColors.sky300||"#7DD3FC"}/>
-          <react_native_1.Text style={[stripStyles.label,{color:AppColors_1.AppColors.sky300||"#7DD3FC"}]}>
+          <NetworkIcons_1.SpeedIcon size={11.5}color={AppColors_1.AppColors.sky300}/>
+          <react_native_1.Text style={[stripStyles.label,{color:AppColors_1.AppColors.sky300}]}>
             {f>=1e3?`${(f/1e3).toFixed(2)} Mbps`:f>0?`${f.toFixed(1)} kbps`:"0.0 kbps"}
           </react_native_1.Text>
         </react_native_1.View>
@@ -22,8 +22,8 @@
         {C&&<>
             <react_native_1.View style={stripStyles.divider}/>
             <react_native_1.View style={stripStyles.item}>
-              <NetworkIcons_1.BoltIcon size={11}color={AppColors_1.AppColors.purple400||"#A78BFA"}/>
-              <react_native_1.Text style={[stripStyles.label,{color:AppColors_1.AppColors.purple400||"#A78BFA"}]}>
+              <NetworkIcons_1.BoltIcon size={11}color={AppColors_1.AppColors.purple400}/>
+              <react_native_1.Text style={[stripStyles.label,{color:AppColors_1.AppColors.purple400}]}>
                 {C}
               </react_native_1.Text>
             </react_native_1.View>
@@ -40,4 +40,4 @@
             </react_native_1.View>
           </>}
       </react_native_1.TouchableOpacity>
-    </react_native_linear_gradient_1.default>};exports.SecondaryTelemetryStrip=SecondaryTelemetryStrip;const stripStyles=react_native_1.StyleSheet.create({container:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth,borderBottomColor:AppColors_1.AppColors.telemetrySubHeaderBorder||"rgba(255, 255, 255, 0.07)",borderTopWidth:react_native_1.StyleSheet.hairlineWidth,borderTopColor:"rgba(0, 0, 0, 0.25)",zIndex:9},inner:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:3.5,minHeight:23},item:{flexDirection:"row",alignItems:"center",gap:4},divider:{width:1,height:10,backgroundColor:"rgba(255, 255, 255, 0.08)"},label:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:9,lineHeight:11.5,color:"rgba(255, 255, 255, 0.85)",letterSpacing:.1}});
+    </react_native_linear_gradient_1.default>};exports.SecondaryTelemetryStrip=SecondaryTelemetryStrip;const stripStyles=react_native_1.StyleSheet.create({container:{width:"100%",borderBottomWidth:react_native_1.StyleSheet.hairlineWidth,borderBottomColor:AppColors_1.AppColors.telemetrySubHeaderBorder,borderTopWidth:react_native_1.StyleSheet.hairlineWidth,borderTopColor:AppColors_1.AppColors.telemetrySubHeaderBorder,zIndex:9},inner:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:3.5,minHeight:23},item:{flexDirection:"row",alignItems:"center",gap:4},divider:{width:1,height:10,backgroundColor:AppColors_1.AppColors.borderSubtle},label:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:9,lineHeight:11.5,color:AppColors_1.AppColors.textPrimary,letterSpacing:.1}});

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

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(o,r,l,n){n===void 0&&(n=l);var a=Object.getOwnPropertyDescriptor(r,l);(!a||("get"in a?!r.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return r[l]}}),Object.defineProperty(o,n,a)}):(function(o,r,l,n){n===void 0&&(n=l),o[n]=r[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(o,r){Object.defineProperty(o,"default",{enumerable:!0,value:r})}):function(o,r){o.default=r}),__importStar=this&&this.__importStar||(function(){var o=function(r){return o=Object.getOwnPropertyNames||function(l){var n=[];for(var a in l)Object.prototype.hasOwnProperty.call(l,a)&&(n[n.length]=a);return n},o(r)};return function(r){if(r&&r.__esModule)return r;var l={};if(r!=null)for(var n=o(r),a=0;a<n.length;a++)n[a]!=="default"&&__createBinding(l,r,n[a]);return __setModuleDefault(l,r),l}})(),__importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.SocketFilterModal=exports.isSocketFiltersDefault=exports.DEFAULT_SOCKET_FILTERS=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),TouchableScale_1=__importDefault(require("../TouchableScale"));exports.DEFAULT_SOCKET_FILTERS={search:"",status:new Set(["all"]),types:new Set(["all"]),sortBy:"time_desc"};const isSocketFiltersDefault=o=>(o.status.has("all")||o.status.size===0)&&(o.types.has("all")||o.types.size===0)&&o.sortBy==="time_desc";exports.isSocketFiltersDefault=isSocketFiltersDefault;const SocketFilterModal=({visible:o,onClose:r,filters:l,onApply:n,records:a})=>{const[c,p]=(0,react_1.useState)(()=>({...l,status:new Set(l.status),types:new Set(l.types)}));(0,react_1.useEffect)(()=>{o&&p({...l,status:new Set(l.status),types:new Set(l.types)})},[o,l]);const s=(0,react_1.useMemo)(()=>{let e=0,t=0,i=0,y=0,_=0,b=0,f=0;return a.forEach(d=>{const u=d.status||"open";u==="open"?e++:u==="closed"?t++:u==="connecting"?i++:u==="error"&&y++,d.client==="socket.io"||d.url.includes("/socket.io")?f++:d.url.startsWith("wss://")?_++:b++}),{all:a.length,open:e,closed:t,connecting:i,error:y,wss:_,ws:b,sio:f}},[a]),h=e=>{const t=new Set(c.status);e==="all"?(t.clear(),t.add("all")):(t.delete("all"),t.has(e)?t.delete(e):t.add(e),t.size===0&&t.add("all")),p(i=>({...i,status:t}))},T=e=>{const t=new Set(c.types);e==="all"?(t.clear(),t.add("all")):(t.delete("all"),t.has(e)?t.delete(e):t.add(e),t.size===0&&t.add("all")),p(i=>({...i,types:t}))},g=()=>{p({search:c.search,status:new Set(["all"]),types:new Set(["all"]),sortBy:"time_desc"})},w=()=>{n(c),r()};return<react_native_1.Modal visible={o}transparent animationType="fade"onRequestClose={r}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(o,r,l,n){n===void 0&&(n=l);var a=Object.getOwnPropertyDescriptor(r,l);(!a||("get"in a?!r.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return r[l]}}),Object.defineProperty(o,n,a)}):(function(o,r,l,n){n===void 0&&(n=l),o[n]=r[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(o,r){Object.defineProperty(o,"default",{enumerable:!0,value:r})}):function(o,r){o.default=r}),__importStar=this&&this.__importStar||(function(){var o=function(r){return o=Object.getOwnPropertyNames||function(l){var n=[];for(var a in l)Object.prototype.hasOwnProperty.call(l,a)&&(n[n.length]=a);return n},o(r)};return function(r){if(r&&r.__esModule)return r;var l={};if(r!=null)for(var n=o(r),a=0;a<n.length;a++)n[a]!=="default"&&__createBinding(l,r,n[a]);return __setModuleDefault(l,r),l}})(),__importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.SocketFilterModal=exports.isSocketFiltersDefault=exports.DEFAULT_SOCKET_FILTERS=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),TouchableScale_1=__importDefault(require("../TouchableScale")),i18n_1=require("../../i18n");exports.DEFAULT_SOCKET_FILTERS={search:"",status:new Set(["all"]),types:new Set(["all"]),sortBy:"time_desc"};const isSocketFiltersDefault=o=>(o.status.has("all")||o.status.size===0)&&(o.types.has("all")||o.types.size===0)&&o.sortBy==="time_desc";exports.isSocketFiltersDefault=isSocketFiltersDefault;const SocketFilterModal=({visible:o,onClose:r,filters:l,onApply:n,records:a})=>{const{t:c}=(0,i18n_1.useTranslation)(),[d,p]=(0,react_1.useState)(()=>({...l,status:new Set(l.status),types:new Set(l.types)}));(0,react_1.useEffect)(()=>{o&&p({...l,status:new Set(l.status),types:new Set(l.types)})},[o,l]);const i=(0,react_1.useMemo)(()=>{const e={all:a.length,open:0,closed:0,connecting:0,error:0,wss:0,ws:0,sio:0};return a.forEach(t=>{t.status==="open"?e.open++:t.status==="closed"?e.closed++:t.status==="connecting"?e.connecting++:t.status==="error"&&e.error++,t.client==="socket.io"?e.sio++:t.url&&t.url.startsWith("wss://")?e.wss++:e.ws++}),e},[a]),u=e=>{p(t=>{const s=new Set(t.status);return e==="all"?{...t,status:new Set(["all"])}:(s.delete("all"),s.has(e)?(s.delete(e),s.size===0&&s.add("all")):s.add(e),{...t,status:s})})},y=e=>{p(t=>{const s=new Set(t.types);return e==="all"?{...t,types:new Set(["all"])}:(s.delete("all"),s.has(e)?(s.delete(e),s.size===0&&s.add("all")):s.add(e),{...t,types:s})})},_=()=>{p({search:"",status:new Set(["all"]),types:new Set(["all"]),sortBy:"time_desc"})},f=()=>{n(d),r()};return<react_native_1.Modal visible={o}transparent animationType="fade"onRequestClose={r}>
       <react_native_1.View style={styles.backdrop}>
         <react_native_1.Pressable style={styles.backdropPress}onPress={r}/>
         <react_native_1.View style={styles.container}>
@@ -6,7 +6,7 @@
           <react_native_1.View style={styles.header}>
             <react_native_1.View style={styles.headerLeft}>
               <NetworkIcons_1.FilterIcon size={18}color={AppColors_1.AppColors.brandPurple}/>
-              <react_native_1.Text style={styles.headerTitle}>Filter WebSockets</react_native_1.Text>
+              <react_native_1.Text style={styles.headerTitle}>{c("filters.filterWebSocketsTitle","Filter WebSockets")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.TouchableOpacity onPress={r}hitSlop={{top:8,bottom:8,left:8,right:8}}style={styles.closeBtn}>
               <NetworkIcons_1.CloseWhite size={14}color={AppColors_1.AppColors.grayTextWeak}/>
@@ -15,9 +15,9 @@
 
           <react_native_1.ScrollView style={styles.content}showsVerticalScrollIndicator={!1}>
             
-            <react_native_1.Text style={styles.sectionTitle}>CONNECTION STATUS</react_native_1.Text>
+            <react_native_1.Text style={styles.sectionTitle}>{c("filters.connectionStatus","CONNECTION STATUS")}</react_native_1.Text>
             <react_native_1.View style={styles.chipRow}>
-              {[{key:"all",label:"All",count:s.all,color:AppColors_1.AppColors.brandPurple},{key:"open",label:"Open",count:s.open,color:AppColors_1.AppColors.greenColor},{key:"closed",label:"Closed",count:s.closed,color:AppColors_1.AppColors.slate500},{key:"connecting",label:"Connecting",count:s.connecting,color:AppColors_1.AppColors.amber600},{key:"error",label:"Error",count:s.error,color:AppColors_1.AppColors.errorColor}].map(e=>{const t=c.status.has(e.key);return<react_native_1.TouchableOpacity key={e.key}onPress={()=>h(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}18`,borderColor:e.color}]}>
+              {[{key:"all",label:c("common.all","All"),count:i.all,color:AppColors_1.AppColors.brandPurple},{key:"open",label:"Open",count:i.open,color:AppColors_1.AppColors.greenColor},{key:"closed",label:"Closed",count:i.closed,color:AppColors_1.AppColors.slate500},{key:"connecting",label:"Connecting",count:i.connecting,color:AppColors_1.AppColors.amber600},{key:"error",label:"Error",count:i.error,color:AppColors_1.AppColors.errorColor}].map(e=>{const t=d.status.has(e.key);return<react_native_1.TouchableOpacity key={e.key}onPress={()=>u(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}18`,borderColor:e.color}]}>
                     <react_native_1.Text style={[styles.chipText,t&&{color:e.color,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                       {e.label}
                     </react_native_1.Text>
@@ -30,9 +30,9 @@
             </react_native_1.View>
 
             
-            <react_native_1.Text style={styles.sectionTitle}>PROTOCOL & CLIENT</react_native_1.Text>
+            <react_native_1.Text style={styles.sectionTitle}>{c("filters.protocolClient","PROTOCOL & CLIENT")}</react_native_1.Text>
             <react_native_1.View style={styles.chipRow}>
-              {[{key:"all",label:"All Protocols",count:s.all,color:AppColors_1.AppColors.brandPurple},{key:"wss",label:"Secure (WSS)",count:s.wss,color:AppColors_1.AppColors.emerald600},{key:"ws",label:"Standard (WS)",count:s.ws,color:AppColors_1.AppColors.blue600},{key:"sio",label:"Socket.IO",count:s.sio,color:AppColors_1.AppColors.violet600}].map(e=>{const t=c.types.has(e.key);return<react_native_1.TouchableOpacity key={e.key}onPress={()=>T(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}18`,borderColor:e.color}]}>
+              {[{key:"all",label:c("common.all","All Protocols"),count:i.all,color:AppColors_1.AppColors.brandPurple},{key:"wss",label:"Secure (WSS)",count:i.wss,color:AppColors_1.AppColors.emerald600},{key:"ws",label:"Standard (WS)",count:i.ws,color:AppColors_1.AppColors.blue600},{key:"sio",label:"Socket.IO",count:i.sio,color:AppColors_1.AppColors.violet600}].map(e=>{const t=d.types.has(e.key);return<react_native_1.TouchableOpacity key={e.key}onPress={()=>y(e.key)}style={[styles.chip,t&&{backgroundColor:`${e.color}18`,borderColor:e.color}]}>
                     <react_native_1.Text style={[styles.chipText,t&&{color:e.color,fontFamily:AppFonts_1.AppFonts.interBold}]}>
                       {e.label}
                     </react_native_1.Text>
@@ -45,9 +45,9 @@
             </react_native_1.View>
 
             
-            <react_native_1.Text style={styles.sectionTitle}>SORT BY</react_native_1.Text>
+            <react_native_1.Text style={styles.sectionTitle}>{c("filters.sortBy","SORT BY")}</react_native_1.Text>
             <react_native_1.View style={styles.chipRow}>
-              {[{key:"time_desc",label:"Newest First"},{key:"time_asc",label:"Oldest First"},{key:"frames_desc",label:"Most Frames"},{key:"duration_desc",label:"Longest Duration"}].map(e=>{const t=c.sortBy===e.key;return<react_native_1.TouchableOpacity key={e.key}onPress={()=>p(i=>({...i,sortBy:e.key}))}style={[styles.chip,t&&styles.chipActiveSort]}>
+              {[{key:"time_desc",label:"Newest First"},{key:"time_asc",label:"Oldest First"},{key:"frames_desc",label:"Most Frames"},{key:"duration_desc",label:"Longest Duration"}].map(e=>{const t=d.sortBy===e.key;return<react_native_1.TouchableOpacity key={e.key}onPress={()=>p(s=>({...s,sortBy:e.key}))}style={[styles.chip,t&&styles.chipActiveSort]}>
                     <react_native_1.Text style={[styles.chipText,t&&styles.chipTextActiveSort]}>
                       {e.label}
                     </react_native_1.Text>
@@ -57,11 +57,11 @@
 
           
           <react_native_1.View style={styles.footer}>
-            <react_native_1.TouchableOpacity onPress={g}style={styles.resetBtn}>
-              <react_native_1.Text style={styles.resetBtnText}>Reset</react_native_1.Text>
+            <react_native_1.TouchableOpacity onPress={_}style={styles.resetBtn}>
+              <react_native_1.Text style={styles.resetBtnText}>{c("common.reset","Reset")}</react_native_1.Text>
             </react_native_1.TouchableOpacity>
-            <TouchableScale_1.default onPress={w}style={styles.applyBtn}>
-              <react_native_1.Text style={styles.applyBtnText}>Apply Filters</react_native_1.Text>
+            <TouchableScale_1.default onPress={f}style={styles.applyBtn}>
+              <react_native_1.Text style={styles.applyBtnText}>{c("filters.applyFilters","Apply Filters")}</react_native_1.Text>
             </TouchableScale_1.default>
           </react_native_1.View>
         </react_native_1.View>

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

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,t,i,o){o===void 0&&(o=i);var n=Object.getOwnPropertyDescriptor(t,i);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(r,o,n)}):(function(r,t,i,o){o===void 0&&(o=i),r[o]=t[i]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,t){Object.defineProperty(r,"default",{enumerable:!0,value:t})}):function(r,t){r.default=t}),__importStar=this&&this.__importStar||(function(){var r=function(t){return r=Object.getOwnPropertyNames||function(i){var o=[];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(o[o.length]=n);return o},r(t)};return function(t){if(t&&t.__esModule)return t;var i={};if(t!=null)for(var o=r(t),n=0;n<o.length;n++)o[n]!=="default"&&__createBinding(i,t,o[n]);return __setModuleDefault(i,t),i}})(),__importDefault=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),i18n_1=require("../../i18n"),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),NetworkIcons_1=require("../NetworkIcons"),reduxLogger_1=require("../../customHooks/reduxLogger"),analyticsLogger_1=require("../../customHooks/analyticsLogger"),helpers_1=require("../../helpers"),HEADER_TAB_THEME={themeColor:AppColors_1.AppColors.brandPurple,bgInactive:`${AppColors_1.AppColors.brandPurple}0D`,borderInactive:`${AppColors_1.AppColors.brandPurple}2B`,iconInactive:AppColors_1.AppColors.brandPurple,idBadgeBg:`${AppColors_1.AppColors.brandPurple}1C`,idBadgeBorder:`${AppColors_1.AppColors.brandPurple}3D`,idBadgeText:AppColors_1.AppColors.brandPurple},TAB_THEMES={apis:HEADER_TAB_THEME,logs:HEADER_TAB_THEME,analytics:HEADER_TAB_THEME,redux:HEADER_TAB_THEME,storage:HEADER_TAB_THEME,device:HEADER_TAB_THEME,crash:HEADER_TAB_THEME,push:HEADER_TAB_THEME,socket:HEADER_TAB_THEME,debugging:HEADER_TAB_THEME,media:HEADER_TAB_THEME},TabBar=react_1.default.memo(()=>{const{t:r}=(0,i18n_1.useTranslation)(),{activeTab:t,switchActiveTab:i,tabVisibility:o,logs:n,consoleLogs:f,analyticsEvents:m,crashRecords:y,pushRecords:C,socketRecords:b,unreadPushCount:S,unreadSocketCount:I,lastReadApisCount:T,lastReadLogsCount:x,lastReadCrashesCount:R,lastReadSocketCount:B,mediaCount:_}=(0,InspectorContext_1.useInspector)(),P=(0,reduxLogger_1.isReduxConnected)(),O=(0,analyticsLogger_1.isAnalyticsConnected)(),c=t==="media",g=(o?.media??!0)&&_>0,w=(0,react_1.useRef)(null),[h,z]=(0,react_1.useState)(!1),[v,L]=(0,react_1.useState)(!0),A=(0,react_1.useRef)(0),V=e=>{const{contentOffset:s,layoutMeasurement:a,contentSize:l}=e.nativeEvent,d=s.x;A.current=d;const u=d>8,p=d<l.width-a.width-8;h!==u&&z(u),v!==p&&L(p)},k=e=>{w.current?.scrollTo({x:Math.max(0,A.current+e),animated:!0})};return<react_native_1.View style={[styles_1.default.tabBarContainer,{flexDirection:"row",alignItems:"center",paddingHorizontal:0}]}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,t,i,o){o===void 0&&(o=i);var n=Object.getOwnPropertyDescriptor(t,i);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(r,o,n)}):(function(r,t,i,o){o===void 0&&(o=i),r[o]=t[i]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,t){Object.defineProperty(r,"default",{enumerable:!0,value:t})}):function(r,t){r.default=t}),__importStar=this&&this.__importStar||(function(){var r=function(t){return r=Object.getOwnPropertyNames||function(i){var o=[];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(o[o.length]=n);return o},r(t)};return function(t){if(t&&t.__esModule)return t;var i={};if(t!=null)for(var o=r(t),n=0;n<o.length;n++)o[n]!=="default"&&__createBinding(i,t,o[n]);return __setModuleDefault(i,t),i}})(),__importDefault=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),i18n_1=require("../../i18n"),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),NetworkIcons_1=require("../NetworkIcons"),reduxLogger_1=require("../../customHooks/reduxLogger"),analyticsLogger_1=require("../../customHooks/analyticsLogger"),helpers_1=require("../../helpers"),HEADER_TAB_THEME={themeColor:AppColors_1.AppColors.brandPurple,bgInactive:`${AppColors_1.AppColors.brandPurple}0D`,borderInactive:`${AppColors_1.AppColors.brandPurple}2B`,iconInactive:AppColors_1.AppColors.brandPurple,idBadgeBg:`${AppColors_1.AppColors.brandPurple}1C`,idBadgeBorder:`${AppColors_1.AppColors.brandPurple}3D`,idBadgeText:AppColors_1.AppColors.brandPurple},TAB_THEMES={apis:HEADER_TAB_THEME,logs:HEADER_TAB_THEME,analytics:HEADER_TAB_THEME,redux:HEADER_TAB_THEME,storage:HEADER_TAB_THEME,device:HEADER_TAB_THEME,crash:HEADER_TAB_THEME,push:HEADER_TAB_THEME,socket:HEADER_TAB_THEME,debugging:HEADER_TAB_THEME,media:HEADER_TAB_THEME},TabBar=react_1.default.memo(()=>{const{t:r}=(0,i18n_1.useTranslation)(),{activeTab:t,switchActiveTab:i,tabVisibility:o,logs:n,consoleLogs:y,analyticsEvents:m,crashRecords:f,pushRecords:C,socketRecords:b,unreadPushCount:S,unreadSocketCount:I,lastReadApisCount:T,lastReadLogsCount:x,lastReadCrashesCount:R,lastReadSocketCount:B,mediaCount:_}=(0,InspectorContext_1.useInspector)(),P=(0,reduxLogger_1.isReduxConnected)(),O=(0,analyticsLogger_1.isAnalyticsConnected)(),c=t==="media",g=(o?.media??!0)&&_>0,w=(0,react_1.useRef)(null),[h,z]=(0,react_1.useState)(!1),[v,L]=(0,react_1.useState)(!0),A=(0,react_1.useRef)(0),V=e=>{const{contentOffset:s,layoutMeasurement:a,contentSize:l}=e.nativeEvent,d=s.x;A.current=d;const u=d>8,p=d<l.width-a.width-8;h!==u&&z(u),v!==p&&L(p)},k=e=>{w.current?.scrollTo({x:Math.max(0,A.current+e),animated:!0})};return<react_native_1.View style={[styles_1.default.tabBarContainer,{flexDirection:"row",alignItems:"center",paddingHorizontal:0}]}>
       
       {h&&<react_native_1.TouchableOpacity onPress={()=>k(-160)}hitSlop={{top:6,bottom:6,left:6,right:6}}activeOpacity={.7}style={{paddingLeft:6,paddingRight:2,justifyContent:"center",alignItems:"center"}}>
           <react_native_1.View style={{width:22,height:22,borderRadius:11,backgroundColor:AppColors_1.AppColors.grayBorderSecondary,alignItems:"center",justifyContent:"center"}}>
@@ -8,7 +8,7 @@
 
       
       <react_native_1.ScrollView ref={w}horizontal showsHorizontalScrollIndicator={!1}onScroll={V}scrollEventThrottle={16}style={{flex:1}}contentContainerStyle={{paddingLeft:h?4:12,paddingRight:g?6:12}}>
-        {[{id:1,key:"apis",label:"APIs",count:n.length,icon:"apis"},{id:2,key:"logs",label:"Logs",count:f.length,icon:"logs"},{id:3,key:"analytics",label:"Analytics",count:m.length,icon:"analytics"},{id:4,key:"redux",label:"Redux",count:0,icon:"redux"},{id:5,key:"storage",label:"Storage",count:0,icon:"storage"},{id:6,key:"device",label:"Device",count:0,icon:"device"},{id:7,key:"crash",label:"Crash",count:y?.length||0,icon:"crash"},{id:8,key:"push",label:"Push",count:C?.length||0,icon:"push"},{id:9,key:"socket",label:"WebSocket",count:b?.length||0,icon:"socket"},{id:10,key:"debugging",label:"Debugging",count:0,icon:"debugging"}].filter(e=>e.key==="debugging"?react_native_1.Platform.OS==="android"&&(0,helpers_1.isLocalDebugEnvironment)()&&!!o?.debugging:!(!o?.[e.key]||e.key==="redux"&&!P||e.key==="analytics"&&!O)).map(e=>{const s=t===e.key,a=TAB_THEMES[e.key]||TAB_THEMES.apis,l=s?AppColors_1.AppColors.white:a.iconInactive,d=e.count>99?"99+":String(e.count),u=t!=="apis"&&n.length>T,p=t!=="logs"&&f.length>x,j=t!=="crash"&&(y?.length||0)>(R||0),D=t!=="socket"&&((b?.length||0)>(B||0)||I>0);return<TouchableScale_1.default key={e.key}onPress={()=>{i(e.key)}}style={[styles_1.default.contentTabButton,{backgroundColor:s?a.themeColor:a.bgInactive,borderColor:s?a.themeColor:a.borderInactive},s&&{shadowColor:a.themeColor,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
+        {[{id:1,key:"apis",label:"APIs",count:n.length,icon:"apis"},{id:2,key:"logs",label:"Logs",count:y.length,icon:"logs"},{id:3,key:"analytics",label:"Analytics",count:m.length,icon:"analytics"},{id:4,key:"redux",label:"Redux",count:0,icon:"redux"},{id:5,key:"storage",label:"Storage",count:0,icon:"storage"},{id:6,key:"device",label:"Device",count:0,icon:"device"},{id:7,key:"crash",label:"Crash",count:f?.length||0,icon:"crash"},{id:8,key:"push",label:"Push",count:C?.length||0,icon:"push"},{id:9,key:"socket",label:"WebSocket",count:b?.length||0,icon:"socket"},{id:10,key:"debugging",label:"Debugging",count:0,icon:"debugging"}].filter(e=>e.key==="debugging"?react_native_1.Platform.OS==="android"&&(0,helpers_1.isLocalDebugEnvironment)()&&!!o?.debugging:!(!o?.[e.key]||e.key==="redux"&&!P||e.key==="analytics"&&!O)).map(e=>{const s=t===e.key,a=TAB_THEMES[e.key]||TAB_THEMES.apis,l=s?AppColors_1.AppColors.white:a.iconInactive,d=e.count>99?"99+":String(e.count),u=t!=="apis"&&n.length>T,p=t!=="logs"&&y.length>x,j=t!=="crash"&&(f?.length||0)>(R||0),D=t!=="socket"&&((b?.length||0)>(B||0)||I>0);return<TouchableScale_1.default key={e.key}onPress={()=>{i(e.key)}}style={[styles_1.default.contentTabButton,{backgroundColor:s?a.themeColor:a.bgInactive,borderColor:s?a.themeColor:a.borderInactive},s&&{shadowColor:a.themeColor,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
                 <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6}}>
                   {e.icon==="apis"&&<NetworkIcons_1.SignalIcon color={l}size={14}/>}
                   {e.icon==="logs"&&<NetworkIcons_1.TerminalIcon color={l}size={14}/>}
@@ -28,7 +28,7 @@
                   <react_native_1.Text numberOfLines={1}ellipsizeMode="tail"style={[styles_1.default.contentTabButtonText,{color:s?AppColors_1.AppColors.white:AppColors_1.AppColors.grayTextStrong,fontFamily:s?AppFonts_1.AppFonts.interBold:AppFonts_1.AppFonts.interSemiBold}]}>
                     {r(`tabs.${e.key}`,e.label)}
                   </react_native_1.Text>
-                  {e.count>0&&e.key!=="push"&&<react_native_1.View style={{paddingHorizontal:5,paddingVertical:1,borderRadius:8,backgroundColor:s?"rgba(255,255,255,0.25)":a.idBadgeBg,borderWidth:.5,borderColor:s?"rgba(255,255,255,0.45)":a.idBadgeBorder,marginLeft:1,alignItems:"center",justifyContent:"center"}}>
+                  {e.count>0&&e.key!=="push"&&<react_native_1.View style={{paddingHorizontal:5,paddingVertical:1,borderRadius:8,backgroundColor:s?AppColors_1.AppColors.overlayWhite25:a.idBadgeBg,borderWidth:.5,borderColor:s?AppColors_1.AppColors.overlayWhite45:a.idBadgeBorder,marginLeft:1,alignItems:"center",justifyContent:"center"}}>
                       <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12,color:s?AppColors_1.AppColors.white:a.themeColor}}>
                         {d}
                       </react_native_1.Text>

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

@@ -38,7 +38,7 @@
           
           <react_native_1.View style={styles.versionComparisonCard}>
             <react_native_1.View style={styles.versionColumn}>
-              <react_native_1.Text style={styles.versionLabel}>INSTALLED</react_native_1.Text>
+              <react_native_1.Text style={styles.versionLabel}>{(0,i18n_1.t)("modals.installed","INSTALLED")}</react_native_1.Text>
               <react_native_1.View style={styles.installedChip}>
                 <react_native_1.Text style={styles.installedText}>v{constants_1.LIB_VERSION}</react_native_1.Text>
               </react_native_1.View>
@@ -49,7 +49,7 @@
             </react_native_1.View>
 
             <react_native_1.View style={styles.versionColumn}>
-              <react_native_1.Text style={styles.versionLabel}>LATEST</react_native_1.Text>
+              <react_native_1.Text style={styles.versionLabel}>{(0,i18n_1.t)("modals.latest","LATEST")}</react_native_1.Text>
               <react_native_1.View style={styles.latestChip}>
                 <NetworkIcons_1.NpmIcon size={12}color={AppColors_1.AppColors.npmRed}/>
                 <react_native_1.Text style={styles.latestText}>v{t}</react_native_1.Text>

package/dist/commonjs/components/MetaAccordion.js

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(a,t,e,r){r===void 0&&(r=e);var l=Object.getOwnPropertyDescriptor(t,e);(!l||("get"in l?!t.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(a,r,l)}):(function(a,t,e,r){r===void 0&&(r=e),a[r]=t[e]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}):function(a,t){a.default=t}),__importStar=this&&this.__importStar||(function(){var a=function(t){return a=Object.getOwnPropertyNames||function(e){var r=[];for(var l in e)Object.prototype.hasOwnProperty.call(e,l)&&(r[r.length]=l);return r},a(t)};return function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r=a(t),l=0;l<r.length;l++)r[l]!=="default"&&__createBinding(e,t,r[l]);return __setModuleDefault(e,t),e}})(),__importDefault=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),i18n_1=require("../i18n"),react_native_1=require("react-native"),constants_1=require("../constants"),useAccordion_1=__importDefault(require("../customHooks/useAccordion")),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),TouchableScale_1=__importDefault(require("./TouchableScale")),CopyButton_1=__importDefault(require("./CopyButton")),AppColors_1=require("../styles/AppColors"),AppFonts_1=require("../styles/AppFonts"),styles_1=__importDefault(require("../styles")),MetaAccordion=({status:a,statusColor:t,duration:e,size:r,triggeredAt:l,method:y,contentType:x,url:n})=>{const{t:o}=(0,i18n_1.useTranslation)(),[T,V]=(0,react_1.useState)(!1),{isOpen:g,toggleOpen:b,chevronStyle:C}=(0,useAccordion_1.default)(!0),s=a===0||a==null,A=i=>{if(!i)return"\u2014";try{const u=i.indexOf("//");let c=i,p="";u!==-1&&(p=i.substring(0,u+2),c=i.substring(u+2));const f=c.indexOf("/");let v=c,_="";f!==-1&&(v=c.substring(0,f),_=c.substring(f));const d=_.indexOf("?");let m=_,w="";return d!==-1&&(m=_.substring(0,d),w=_.substring(d)),<react_native_1.Text style={{lineHeight:16}}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(a,t,e,o){o===void 0&&(o=e);var l=Object.getOwnPropertyDescriptor(t,e);(!l||("get"in l?!t.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return t[e]}}),Object.defineProperty(a,o,l)}):(function(a,t,e,o){o===void 0&&(o=e),a[o]=t[e]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}):function(a,t){a.default=t}),__importStar=this&&this.__importStar||(function(){var a=function(t){return a=Object.getOwnPropertyNames||function(e){var o=[];for(var l in e)Object.prototype.hasOwnProperty.call(e,l)&&(o[o.length]=l);return o},a(t)};return function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var o=a(t),l=0;l<o.length;l++)o[l]!=="default"&&__createBinding(e,t,o[l]);return __setModuleDefault(e,t),e}})(),__importDefault=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),i18n_1=require("../i18n"),react_native_1=require("react-native"),constants_1=require("../constants"),useAccordion_1=__importDefault(require("../customHooks/useAccordion")),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),TouchableScale_1=__importDefault(require("./TouchableScale")),CopyButton_1=__importDefault(require("./CopyButton")),AppColors_1=require("../styles/AppColors"),AppFonts_1=require("../styles/AppFonts"),styles_1=__importDefault(require("../styles")),MetaAccordion=({status:a,statusColor:t,duration:e,size:o,triggeredAt:l,method:y,contentType:x,url:n})=>{const{t:r}=(0,i18n_1.useTranslation)(),[T,V]=(0,react_1.useState)(!1),{isOpen:g,toggleOpen:b,chevronStyle:C}=(0,useAccordion_1.default)(!0),s=a===0||a==null,A=i=>{if(!i)return"\u2014";try{const u=i.indexOf("//");let c=i,p="";u!==-1&&(p=i.substring(0,u+2),c=i.substring(u+2));const f=c.indexOf("/");let v=c,_="";f!==-1&&(v=c.substring(0,f),_=c.substring(f));const d=_.indexOf("?");let m=_,w="";return d!==-1&&(m=_.substring(0,d),w=_.substring(d)),<react_native_1.Text style={{lineHeight:16}}>
           {p?<react_native_1.Text style={{color:AppColors_1.AppColors.slate400,fontFamily:AppFonts_1.AppFonts.interRegular}}>{p}</react_native_1.Text>:null}
           <react_native_1.Text style={{color:AppColors_1.AppColors.purple,fontFamily:AppFonts_1.AppFonts.interBold}}>{v}</react_native_1.Text>
           <react_native_1.Text style={{color:AppColors_1.AppColors.slate700,fontFamily:AppFonts_1.AppFonts.interMedium}}>{m}</react_native_1.Text>
@@ -6,9 +6,9 @@
         </react_native_1.Text>}catch{return i}};return<react_native_1.View style={styles_1.default.metaContainer}>
       <react_native_1.Pressable onPress={b}hitSlop={12}>
         <react_native_1.View style={styles_1.default.metaHeader}>
-          <react_native_1.Text style={styles_1.default.metaTitle}>Metadata</react_native_1.Text>
+          <react_native_1.Text style={styles_1.default.metaTitle}>{r("errorBoundary.metadata","Metadata")}</react_native_1.Text>
           <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:8}}>
-            <CopyButton_1.default value={{status:a??0,duration:e!=null?`${e} ms`:"\u2014",size:r||"\u2014",triggeredAt:l||"",method:y||"GET",contentType:x||"application/json",url:n||""}}label="Metadata"/>
+            <CopyButton_1.default value={{status:a??0,duration:e!=null?`${e} ms`:"\u2014",size:o||"\u2014",triggeredAt:l||"",method:y||"GET",contentType:x||"application/json",url:n||""}}label="Metadata"/>
             <react_native_1.View style={C}>
               <NetworkIcons_1.ChevronIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
             </react_native_1.View>
@@ -20,7 +20,7 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.triggeredAt")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.triggeredAt")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.Text style={[styles_1.default.metaValue,{color:AppColors_1.AppColors.purple,fontSize:12}]}>
               {l}
@@ -31,7 +31,7 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.methodHeader")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.methodHeader")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.View style={[styles_1.default.statusChip,{borderColor:`${AppColors_1.AppColors.brandPurple}40`,backgroundColor:`${AppColors_1.AppColors.brandPurple}14`}]}>
               <react_native_1.Text style={[styles_1.default.statusText,{color:AppColors_1.AppColors.purple,fontFamily:AppFonts_1.AppFonts.interBold}]}>
@@ -44,11 +44,11 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.StatusIcon color={AppColors_1.AppColors.grayTextWeak}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.statusHeader")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.statusHeader")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.View style={[styles_1.default.statusChip,{borderColor:s?`${AppColors_1.AppColors.errorColor}40`:`${t}40`,backgroundColor:s?`${AppColors_1.AppColors.errorColor}15`:`${t}15`}]}>
               <react_native_1.Text style={[styles_1.default.statusText,{color:s?AppColors_1.AppColors.errorColor:t}]}>
-                {s?o("network.failedNetworkError"):String(a)}
+                {s?r("network.failedNetworkError"):String(a)}
               </react_native_1.Text>
             </react_native_1.View>
           </react_native_1.View>
@@ -57,7 +57,7 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.contentType")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.contentType")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.Text style={styles_1.default.metaValue}>
               {x||"application/json"}
@@ -68,12 +68,12 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.durationHeader")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.durationHeader")}</react_native_1.Text>
             </react_native_1.View>
             <react_native_1.View style={styles_1.default.metaValueRow}>
               {e!=null&&!s&&<react_native_1.View style={[styles_1.default.perfBadge,{backgroundColor:`${(0,helpers_1.getDurationColor)(e)}15`,borderColor:`${(0,helpers_1.getDurationColor)(e)}40`}]}>
                   <react_native_1.Text style={[styles_1.default.perfBadgeText,{color:(0,helpers_1.getDurationColor)(e)}]}>
-                    {e<constants_1.DURATION_FAST_MS?o("network.perf.fast"):e<constants_1.DURATION_SLOW_MS?o("network.perf.moderate"):o("network.perf.slow")}
+                    {e<constants_1.DURATION_FAST_MS?r("network.perf.fast"):e<constants_1.DURATION_SLOW_MS?r("network.perf.moderate"):r("network.perf.slow")}
                   </react_native_1.Text>
                 </react_native_1.View>}
               <react_native_1.Text style={styles_1.default.metaValue}>
@@ -86,10 +86,10 @@
           {e!=null&&!s&&<react_native_1.View style={{paddingVertical:8,gap:6}}>
               <react_native_1.View style={{flexDirection:"row",justifyContent:"space-between",alignItems:"center"}}>
                 <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11,color:AppColors_1.AppColors.primaryBlack}}>
-                  {o("network.timingWaterfall")}
+                  {r("network.timingWaterfall")}
                 </react_native_1.Text>
                 <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:(0,helpers_1.getDurationColor)(e)}}>
-                  {e<constants_1.DURATION_FAST_MS?o("network.perf.fast"):e<constants_1.DURATION_SLOW_MS?o("network.perf.moderate"):o("network.perf.slow")}
+                  {e<constants_1.DURATION_FAST_MS?r("network.perf.fast"):e<constants_1.DURATION_SLOW_MS?r("network.perf.moderate"):r("network.perf.slow")}
                 </react_native_1.Text>
               </react_native_1.View>
 
@@ -114,9 +114,9 @@
           <react_native_1.View style={styles_1.default.metaRow}>
             <react_native_1.View style={styles_1.default.metaLabelRow}>
               <NetworkIcons_1.SizeIcon color={AppColors_1.AppColors.grayTextWeak}/>
-              <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.sizeHeader")}</react_native_1.Text>
+              <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.sizeHeader")}</react_native_1.Text>
             </react_native_1.View>
-            <react_native_1.Text style={styles_1.default.metaValue}>{r}</react_native_1.Text>
+            <react_native_1.Text style={styles_1.default.metaValue}>{o}</react_native_1.Text>
           </react_native_1.View>
           <react_native_1.View style={styles_1.default.metaDivider}/>
 
@@ -124,19 +124,19 @@
             <react_native_1.View style={{flexDirection:"row",justifyContent:"space-between",width:"100%",alignItems:"center"}}>
               <react_native_1.View style={styles_1.default.metaLabelRow}>
                 <NetworkIcons_1.GlobeIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
-                <react_native_1.Text style={styles_1.default.metaLabel}>{o("network.fullUrl")}</react_native_1.Text>
+                <react_native_1.Text style={styles_1.default.metaLabel}>{r("network.fullUrl")}</react_native_1.Text>
               </react_native_1.View>
               
               <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:10}}>
                 {n&&n.length>50&&<TouchableScale_1.default onPress={()=>V(i=>!i)}hitSlop={8}>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.purple}}>
-                      {o(T?"network.showLess":"network.showMore")}
+                      {r(T?"network.showLess":"network.showMore")}
                     </react_native_1.Text>
                   </TouchableScale_1.default>}
                 
                 {n&&<TouchableScale_1.default onPress={()=>(0,helpers_1.handleOpenExternalLink)(n)}hitSlop={8}>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.purple,textDecorationLine:"underline"}}>
-                      {o("network.open")}
+                      {r("network.open")}
                     </react_native_1.Text>
                   </TouchableScale_1.default>}
               </react_native_1.View>

package/dist/commonjs/components/ModuleErrorBoundary.js

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(i,e,t,r){r===void 0&&(r=t);var o=Object.getOwnPropertyDescriptor(e,t);(!o||("get"in o?!e.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return e[t]}}),Object.defineProperty(i,r,o)}):(function(i,e,t,r){r===void 0&&(r=t),i[r]=e[t]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(i,e){Object.defineProperty(i,"default",{enumerable:!0,value:e})}):function(i,e){i.default=e}),__importStar=this&&this.__importStar||(function(){var i=function(e){return i=Object.getOwnPropertyNames||function(t){var r=[];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(r[r.length]=o);return r},i(e)};return function(e){if(e&&e.__esModule)return e;var t={};if(e!=null)for(var r=i(e),o=0;o<r.length;o++)r[o]!=="default"&&__createBinding(t,e,r[o]);return __setModuleDefault(t,e),t}})();Object.defineProperty(exports,"__esModule",{value:!0}),exports.ModuleErrorBoundary=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppFonts_1=require("../styles/AppFonts"),AppColors_1=require("../styles/AppColors"),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),crashHandler_1=require("../customHooks/crashHandler"),enums_1=require("../types/enums");class ModuleErrorBoundary extends react_1.Component{constructor(){super(...arguments),this.state={hasError:!1,error:null,copied:!1},this.handleRetry=()=>{this.setState({hasError:!1,error:null,copied:!1}),this.props.onRetry&&this.props.onRetry()},this.handleCopy=()=>{if(!this.state.error)return;const e=`[Module Error: ${this.props.moduleName||"Micro-Feature"}]
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(n,e,t,r){r===void 0&&(r=t);var o=Object.getOwnPropertyDescriptor(e,t);(!o||("get"in o?!e.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return e[t]}}),Object.defineProperty(n,r,o)}):(function(n,e,t,r){r===void 0&&(r=t),n[r]=e[t]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(n,e){Object.defineProperty(n,"default",{enumerable:!0,value:e})}):function(n,e){n.default=e}),__importStar=this&&this.__importStar||(function(){var n=function(e){return n=Object.getOwnPropertyNames||function(t){var r=[];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(r[r.length]=o);return r},n(e)};return function(e){if(e&&e.__esModule)return e;var t={};if(e!=null)for(var r=n(e),o=0;o<r.length;o++)r[o]!=="default"&&__createBinding(t,e,r[o]);return __setModuleDefault(t,e),t}})();Object.defineProperty(exports,"__esModule",{value:!0}),exports.ModuleErrorBoundary=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppFonts_1=require("../styles/AppFonts"),AppColors_1=require("../styles/AppColors"),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),crashHandler_1=require("../customHooks/crashHandler"),enums_1=require("../types/enums"),i18n_1=require("../i18n");class ModuleErrorBoundary extends react_1.Component{constructor(){super(...arguments),this.state={hasError:!1,error:null,copied:!1},this.handleRetry=()=>{this.setState({hasError:!1,error:null,copied:!1}),this.props.onRetry&&this.props.onRetry()},this.handleCopy=()=>{if(!this.state.error)return;const e=`[Module Error: ${this.props.moduleName||"Micro-Feature"}]
 Message: ${this.state.error.message}
 Stack: ${this.state.error.stack||"N/A"}`;(0,helpers_1.copyToClipboard)(e),this.setState({copied:!0}),setTimeout(()=>{this.setState({copied:!1})},2e3)}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}componentDidCatch(e,t){try{(0,crashHandler_1.handleInterceptedCrash)(e,e?.stack,!1,enums_1.CrashType.Js,t.componentStack||void 0)}catch{}this.props.onError&&this.props.onError(e,t)}render(){if(this.state.hasError&&this.state.error){const{fallback:e,moduleName:t="UI Module",containerStyle:r}=this.props;return typeof e=="function"?e(this.state.error,this.handleRetry):e||<react_native_1.View style={[styles.card,r]}>
           <react_native_1.View style={styles.headerRow}>
@@ -9,7 +9,7 @@ Stack: ${this.state.error.stack||"N/A"}`;(0,helpers_1.copyToClipboard)(e),this.s
               </react_native_1.Text>
             </react_native_1.View>
             <react_native_1.View style={styles.badge}>
-              <react_native_1.Text style={styles.badgeText}>FAULT ISOLATED</react_native_1.Text>
+              <react_native_1.Text style={styles.badgeText}>{(0,i18n_1.t)("errorBoundary.faultIsolated","FAULT ISOLATED")}</react_native_1.Text>
             </react_native_1.View>
           </react_native_1.View>
 
@@ -20,13 +20,13 @@ Stack: ${this.state.error.stack||"N/A"}`;(0,helpers_1.copyToClipboard)(e),this.s
           <react_native_1.View style={styles.actionsRow}>
             <react_native_1.TouchableOpacity style={styles.retryButton}onPress={this.handleRetry}activeOpacity={.7}>
               <NetworkIcons_1.RefreshCcwIcon color={AppColors_1.AppColors.white}size={12}/>
-              <react_native_1.Text style={styles.retryText}>Retry Module</react_native_1.Text>
+              <react_native_1.Text style={styles.retryText}>{(0,i18n_1.t)("errorBoundary.retryModule","Retry Module")}</react_native_1.Text>
             </react_native_1.TouchableOpacity>
 
             <react_native_1.TouchableOpacity style={styles.copyButton}onPress={this.handleCopy}activeOpacity={.7}>
               <NetworkIcons_1.CopyIcon color={AppColors_1.AppColors.slate600}size={12}/>
               <react_native_1.Text style={styles.copyText}>
-                {this.state.copied?"Copied":"Copy Error"}
+                {this.state.copied?(0,i18n_1.t)("common.copied","Copied"):(0,i18n_1.t)("common.copy","Copy Error")}
               </react_native_1.Text>
             </react_native_1.TouchableOpacity>
           </react_native_1.View>

package/dist/commonjs/components/NetworkIcons.d.ts

@@ -222,3 +222,10 @@ export declare const PixelateIcon: ({ color, size }: IconProps) => React.JSX.Ele
 export declare const HighlighterIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const ArrowRightIcon: ({ color, size }: IconProps) => React.JSX.Element;
 export declare const EyeCompareIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const BrightnessIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const ContrastIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const SaturationIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const WarmthIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const ExposureIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const VignetteIcon: ({ color, size }: IconProps) => React.JSX.Element;
+export declare const ArrowForwardIcon: ({ color, size }: IconProps) => React.JSX.Element;