react-native-inapp-inspector 2.4.0 → 2.4.2

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

@@ -1,15 +1,16 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,a,i){i===void 0&&(i=a);var r=Object.getOwnPropertyDescriptor(t,a);(!r||("get"in r?!t.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(e,i,r)}):(function(e,t,a,i){i===void 0&&(i=a),e[i]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(a){var i=[];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(i[i.length]=r);return i},e(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var i=e(t),r=0;r<i.length;r++)i[r]!=="default"&&__createBinding(a,t,i[r]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.MediaPreviewModal=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),NetworkIcons_1=require("../NetworkIcons"),capture_1=require("../../capture"),helpers_1=require("../../helpers"),toast_1=require("../../helpers/toast"),i18n_1=require("../../i18n"),MediaPreviewModal=({item:e,visible:t,onClose:a,onDelete:i,onConvertToGif:r})=>{const{t:o}=(0,i18n_1.useTranslation)(),[y,b]=(0,react_1.useState)(!1),[v,g]=(0,react_1.useState)(!1),[n,T]=(0,react_1.useState)(!1),[C,f]=(0,react_1.useState)(!1),[A,x]=(0,react_1.useState)("1.0x"),[c,S]=(0,react_1.useState)(!0),[h,k]=(0,react_1.useState)(.4);if(!e)return null;const u=()=>{e?.uri&&(0,helpers_1.copyImageOrMediaToClipboard)(e.uri,e.type==="image"?"Image":"Media")},w=async()=>{try{f(!0),await capture_1.ScreenCapture.playVideo(e.uri)}catch{(0,toast_1.showToast)(o("mediaGallery.playError","Unable to play video"))}finally{f(!1)}},I=()=>{react_native_1.Alert.alert(o("mediaGallery.deleteTitle"),o("mediaGallery.deleteMessage",{filename:e.filename}),[{text:o("common.cancel"),style:"cancel"},{text:o("mediaGallery.delete"),style:"destructive",onPress:()=>{i(e),a()}}])},P=async()=>{if(r){b(!0);try{await r(e),(0,toast_1.showToast)(o("mediaGallery.convertedSuccess"))}catch{(0,toast_1.showToast)(o("mediaGallery.convertFailed"))}finally{b(!1)}}},_=async()=>{try{const l=e.uri.startsWith("file://")||e.uri.startsWith("content://")||e.uri.startsWith("http")?e.uri:`file://${e.uri}`,F=react_native_1.Platform.select({ios:{url:l,title:e.filename},default:{title:e.filename,message:e.filename,url:l}});(await react_native_1.Share.share(F)).action===react_native_1.Share.sharedAction&&(0,toast_1.showToast)(o("mediaGallery.shareSuccess","Shared successfully"))}catch(l){l?.message!=="User did not share"&&(0,toast_1.showToast)(o("mediaGallery.shareUnavailable","Sharing not available on this device"))}},s=e.type==="video",d=e.type==="gif",p=e.durationMs?(e.durationMs/1e3).toFixed(1):null,V=p?`00:${Number(p)<10?"0":""}${p}`:"00:05.0",m=!0;return<react_native_1.Modal visible={t}transparent={!0}animationType="fade"onRequestClose={a}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,o,a,i){i===void 0&&(i=a);var r=Object.getOwnPropertyDescriptor(o,a);(!r||("get"in r?!o.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return o[a]}}),Object.defineProperty(e,i,r)}):(function(e,o,a,i){i===void 0&&(i=a),e[i]=o[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,o){Object.defineProperty(e,"default",{enumerable:!0,value:o})}):function(e,o){e.default=o}),__importStar=this&&this.__importStar||(function(){var e=function(o){return e=Object.getOwnPropertyNames||function(a){var i=[];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(i[i.length]=r);return i},e(o)};return function(o){if(o&&o.__esModule)return o;var a={};if(o!=null)for(var i=e(o),r=0;r<i.length;r++)i[r]!=="default"&&__createBinding(a,o,i[r]);return __setModuleDefault(a,o),a}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.MediaPreviewModal=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"),TouchableScale_1=__importDefault(require("../TouchableScale")),ConfirmationModal_1=require("./ConfirmationModal"),NetworkIcons_1=require("../NetworkIcons"),capture_1=require("../../capture"),helpers_1=require("../../helpers"),toast_1=require("../../helpers/toast"),i18n_1=require("../../i18n"),NativeInspector_1=require("../../native/NativeInspector"),MediaPreviewModal=({item:e,visible:o,onClose:a,onDelete:i,onConvertToGif:r})=>{const{t}=(0,i18n_1.useTranslation)(),[u,y]=(0,react_1.useState)(!1),[_,h]=(0,react_1.useState)(!1),[s,v]=(0,react_1.useState)(!1),[m,g]=(0,react_1.useState)(!1),[T,p]=(0,react_1.useState)(!1);if(!e)return null;const c=()=>{e?.uri&&(0,helpers_1.copyImageOrMediaToClipboard)(e.uri,e.type==="image"?"Image":"Media")},b=async()=>{try{g(!0),await capture_1.ScreenCapture.playVideo(e.uri)}catch{(0,toast_1.showToast)(t("mediaGallery.playError","Unable to play video"))}finally{g(!1)}},f=()=>{(0,NativeInspector_1.triggerNativeHaptic)("medium"),p(!0)},x=async()=>{if(r){y(!0);try{await r(e),(0,toast_1.showToast)(t("mediaGallery.convertedSuccess"))}catch{(0,toast_1.showToast)(t("mediaGallery.convertFailed"))}finally{y(!1)}}},w=async()=>{try{const d=e.uri.startsWith("file://")||e.uri.startsWith("content://")||e.uri.startsWith("http")?e.uri:`file://${e.uri}`,A=react_native_1.Platform.select({ios:{url:d,title:e.filename},default:{title:e.filename,message:e.filename,url:d}});(await react_native_1.Share.share(A)).action===react_native_1.Share.sharedAction&&(0,toast_1.showToast)(t("mediaGallery.shareSuccess","Shared successfully"))}catch(d){d?.message!=="User did not share"&&(0,toast_1.showToast)(t("mediaGallery.shareUnavailable","Sharing not available on this device"))}},l=e.type==="video",C=e.type==="gif",n=e.durationMs?(e.durationMs/1e3).toFixed(1):null,S=n?`00:${Number(n)<10?"0":""}${n}`:null;return<react_native_1.Modal visible={o}transparent={!0}animationType="fade"statusBarTranslucent={!0}onRequestClose={a}>
+      <react_native_1.StatusBar translucent backgroundColor="transparent"barStyle="light-content"/>
       <react_native_1.View style={previewStyles.overlay}>
         
-        <react_native_1.View style={previewStyles.header}>
-          <react_native_1.TouchableOpacity activeOpacity={.8}onPress={u}style={previewStyles.headerLeft}>
-            <react_native_1.View style={[previewStyles.badge,{borderColor:s?`${AppColors_1.AppColors.sky400}80`:d?`${AppColors_1.AppColors.warningAmber}80`:`${AppColors_1.AppColors.emerald500}80`,backgroundColor:s?`${AppColors_1.AppColors.sky400}20`:d?`${AppColors_1.AppColors.warningAmber}20`:`${AppColors_1.AppColors.emerald500}20`}]}>
-              {s?<NetworkIcons_1.FilmIcon size={13}color={AppColors_1.AppColors.sky400}/>:d?<NetworkIcons_1.GifIcon size={13}color={AppColors_1.AppColors.warningAmber}/>:<NetworkIcons_1.ImageIcon size={13}color={AppColors_1.AppColors.emerald500}/>}
-              <react_native_1.Text style={[previewStyles.badgeText,{color:s?AppColors_1.AppColors.sky400:d?AppColors_1.AppColors.warningAmber:AppColors_1.AppColors.emerald500}]}>
+        <react_native_linear_gradient_1.default colors={[AppColors_1.AppColors.indigo600,AppColors_1.AppColors.violet600]}start={{x:0,y:0}}end={{x:1,y:1}}style={previewStyles.header}>
+          <react_native_1.TouchableOpacity activeOpacity={.8}onPress={c}style={previewStyles.headerLeft}>
+            <react_native_1.View style={previewStyles.badge}>
+              {l?<NetworkIcons_1.FilmIcon size={12}color={AppColors_1.AppColors.white}/>:C?<NetworkIcons_1.GifIcon size={12}color={AppColors_1.AppColors.white}/>:<NetworkIcons_1.ImageIcon size={12}color={AppColors_1.AppColors.white}/>}
+              <react_native_1.Text style={previewStyles.badgeText}>
                 {e.format.toUpperCase()}
               </react_native_1.Text>
             </react_native_1.View>
-            <react_native_1.View style={{flex:1,minWidth:0}}>
+            <react_native_1.View style={previewStyles.headerTextCol}>
               <react_native_1.Text style={previewStyles.title}numberOfLines={1}>
                 {e.filename}
               </react_native_1.Text>
@@ -21,146 +22,129 @@
 
           
           <react_native_1.View style={previewStyles.headerRight}>
-            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.copyUri","Copy URI")}onPress={u}style={previewStyles.headerActionBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
-              <NetworkIcons_1.CopyIcon size={14}color={AppColors_1.AppColors.slate200}/>
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={t("mediaGallery.copyUri","Copy URI")}onPress={c}style={previewStyles.headerActionBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.CopyIcon size={13}color={AppColors_1.AppColors.white}/>
             </TouchableScale_1.default>
 
-            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.share","Share")}onPress={_}style={[previewStyles.headerActionBtn,{backgroundColor:`${AppColors_1.AppColors.sky400}20`,borderColor:`${AppColors_1.AppColors.sky400}60`}]}hitSlop={{top:10,bottom:10,left:10,right:10}}>
-              <NetworkIcons_1.ShareIcon size={14}color={AppColors_1.AppColors.sky400}/>
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={t("mediaGallery.share","Share")}onPress={w}style={previewStyles.headerActionBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ShareIcon size={13}color={AppColors_1.AppColors.white}/>
             </TouchableScale_1.default>
 
-            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.delete")}onPress={I}style={previewStyles.headerDeleteBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
-              <NetworkIcons_1.TrashIcon size={14}color={AppColors_1.AppColors.red500}/>
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={t("mediaGallery.delete")}onPress={f}style={previewStyles.headerDeleteBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.TrashIcon size={13}color={AppColors_1.AppColors.white}/>
             </TouchableScale_1.default>
 
-            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={n?o("mediaGallery.collapse","Exit Fullscreen"):o("mediaGallery.expand","Expand Fullscreen")}onPress={()=>T(!n)}style={[previewStyles.headerIconBtn,n&&{backgroundColor:`${AppColors_1.AppColors.sky400}30`,borderColor:`${AppColors_1.AppColors.sky400}70`}]}hitSlop={{top:10,bottom:10,left:10,right:10}}>
-              <NetworkIcons_1.ExpandCollapseIcon size={14}isExpanded={n}color={n?AppColors_1.AppColors.sky400:AppColors_1.AppColors.white}/>
+            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={s?t("mediaGallery.collapse","Exit Fullscreen"):t("mediaGallery.expand","Expand Fullscreen")}onPress={()=>v(!s)}style={previewStyles.headerIconBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ExpandCollapseIcon size={13}isExpanded={s}color={AppColors_1.AppColors.white}/>
             </react_native_1.TouchableOpacity>
 
-            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.minimize","Minimize")}onPress={a}style={previewStyles.headerIconBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
-              <NetworkIcons_1.ChevronDownIcon size={15}color={AppColors_1.AppColors.white}/>
+            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={t("mediaGallery.minimize","Minimize")}onPress={a}style={previewStyles.headerIconBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ChevronDownIcon size={14}color={AppColors_1.AppColors.white}/>
             </react_native_1.TouchableOpacity>
           </react_native_1.View>
-        </react_native_1.View>
+        </react_native_linear_gradient_1.default>
 
         
-        <react_native_1.View style={[previewStyles.stage,n&&previewStyles.stageExpanded,!m&&{paddingBottom:react_native_1.Platform.OS==="ios"?34:16}]}>
-          <react_native_1.TouchableOpacity activeOpacity={s?.9:1}onPress={s?w:void 0}style={[previewStyles.previewCard,n&&previewStyles.previewCardExpanded]}>
-            {s?e.thumbnailUri&&!v?<>
-                  <react_native_1.Image source={{uri:e.thumbnailUri}}style={previewStyles.image}resizeMode="contain"onError={()=>g(!0)}/>
+        <react_native_1.View style={[previewStyles.stage,s&&previewStyles.stageExpanded]}>
+          <react_native_1.TouchableOpacity activeOpacity={l?.92:1}onPress={l?b:void 0}style={[previewStyles.previewCard,s&&previewStyles.previewCardExpanded]}>
+            {l?e.thumbnailUri&&!_?<>
+                  <react_native_1.Image source={{uri:e.thumbnailUri}}style={previewStyles.image}resizeMode="contain"onError={()=>h(!0)}/>
                   <react_native_1.View style={previewStyles.videoImageOverlay}/>
                 </>:<react_native_1.View style={previewStyles.videoFallbackBackdrop}>
                   <react_native_1.View style={previewStyles.videoFallbackGlow}/>
-                  <NetworkIcons_1.FilmIcon size={44}color={AppColors_1.AppColors.sky400}/>
+                  <NetworkIcons_1.FilmIcon size={52}color={AppColors_1.AppColors.sky400}/>
+                  <react_native_1.Text style={previewStyles.videoFallbackTitle}>
+                    {e.width&&e.height?`${e.width} \xD7 ${e.height}`:"HD Video Recording"}
+                  </react_native_1.Text>
                   <react_native_1.Text style={previewStyles.videoFallbackSubtitle}>
-                    {e.width&&e.height?`${e.width} \xD7 ${e.height}`:"HD Video"} • MP4
+                    {n?`${n}s duration`:"MP4 Video"} • {(0,helpers_1.formatBytes)(e.sizeBytes)}
                   </react_native_1.Text>
-                </react_native_1.View>:<react_native_1.Image source={{uri:e.uri}}style={previewStyles.image}resizeMode="contain"onError={()=>g(!0)}/>}
+                </react_native_1.View>:<react_native_1.Image source={{uri:e.uri}}style={previewStyles.image}resizeMode="contain"onError={()=>h(!0)}/>}
 
             
-            {s&&<react_native_1.View style={previewStyles.centerPlayOverlay}>
+            {l&&<react_native_1.View style={previewStyles.centerPlayContainer}pointerEvents="box-none">
+                <react_native_1.View style={previewStyles.centerPlayGlow}/>
                 <react_native_1.View style={previewStyles.centerPlayCircle}>
                   <NetworkIcons_1.PlayIcon size={28}color={AppColors_1.AppColors.white}/>
                 </react_native_1.View>
-                <react_native_1.Text style={previewStyles.centerPlayText}>
-                  {o("mediaGallery.playVideo","Play Video")}
-                </react_native_1.Text>
+                <react_native_1.View style={previewStyles.centerPlayPill}>
+                  <react_native_1.Text style={previewStyles.centerPlayText}>
+                    {t("mediaGallery.playVideo","Play Video")}
+                  </react_native_1.Text>
+                </react_native_1.View>
               </react_native_1.View>}
 
             
-            {s&&<react_native_1.View style={previewStyles.videoBadgeOverlay}>
-                <react_native_1.View style={previewStyles.playPill}>
-                  <NetworkIcons_1.FilmIcon size={12}color={AppColors_1.AppColors.sky400}/>
-                  <react_native_1.Text style={previewStyles.playPillText}>
-                    {p?`${p}s`:"VIDEO"}
+            {l&&<react_native_1.View style={previewStyles.topLeftBadgeOverlay}pointerEvents="none">
+                <react_native_1.View style={previewStyles.metaPill}>
+                  <NetworkIcons_1.FilmIcon size={11}color={AppColors_1.AppColors.sky400}/>
+                  <react_native_1.Text style={previewStyles.metaPillText}>
+                    {S||(n?`${n}s`:"VIDEO")}
                   </react_native_1.Text>
                 </react_native_1.View>
               </react_native_1.View>}
 
-            
-            {d&&<react_native_1.View style={previewStyles.videoBadgeOverlay}>
-                <react_native_1.View style={[previewStyles.playPill,{backgroundColor:`${AppColors_1.AppColors.warningAmber}CC`}]}>
-                  <NetworkIcons_1.GifIcon size={12}color={AppColors_1.AppColors.white}/>
-                  <react_native_1.Text style={previewStyles.playPillText}>ANIMATED GIF</react_native_1.Text>
+            {C&&<react_native_1.View style={previewStyles.topLeftBadgeOverlay}pointerEvents="none">
+                <react_native_1.View style={[previewStyles.metaPill,{backgroundColor:"rgba(245, 158, 11, 0.85)"}]}>
+                  <NetworkIcons_1.GifIcon size={11}color={AppColors_1.AppColors.white}/>
+                  <react_native_1.Text style={previewStyles.metaPillText}>ANIMATED GIF</react_native_1.Text>
                 </react_native_1.View>
               </react_native_1.View>}
 
             
-            <react_native_1.TouchableOpacity activeOpacity={.8}onPress={u}style={previewStyles.floatingMetaBadge}>
-              <NetworkIcons_1.CopyIcon size={11}color={AppColors_1.AppColors.sky400}/>
-              <react_native_1.Text style={previewStyles.floatingMetaText}>
-                {e.width&&e.height?`${e.width} \xD7 ${e.height}  \u2022  `:""}
-                {(0,helpers_1.formatBytes)(e.sizeBytes)}
-              </react_native_1.Text>
+            <react_native_1.TouchableOpacity activeOpacity={.8}onPress={c}style={previewStyles.bottomRightBadgeOverlay}>
+              <react_native_1.View style={previewStyles.metaPill}>
+                <NetworkIcons_1.CopyIcon size={10}color={AppColors_1.AppColors.sky400}/>
+                <react_native_1.Text style={previewStyles.metaPillText}>
+                  {e.width&&e.height?`${e.width} \xD7 ${e.height} \u2022 `:""}
+                  {(0,helpers_1.formatBytes)(e.sizeBytes)}
+                </react_native_1.Text>
+              </react_native_1.View>
             </react_native_1.TouchableOpacity>
           </react_native_1.TouchableOpacity>
         </react_native_1.View>
 
         
-        {s&&<react_native_1.View style={previewStyles.videoControlsPanel}>
-            
-            <react_native_1.View style={previewStyles.progressSection}>
-              <react_native_1.Text style={previewStyles.timeLabel}>
-                00:0{Math.floor(h*(Number(p)||5))}
+        <react_native_1.View style={previewStyles.footer}>
+          {l&&<TouchableScale_1.default onPress={b}style={previewStyles.primaryPlayBtn}>
+              <NetworkIcons_1.PlayIcon size={16}color={AppColors_1.AppColors.white}/>
+              <react_native_1.Text style={previewStyles.primaryPlayText}>
+                {m?t("mediaGallery.playing","Playing Video..."):t("mediaGallery.playInPlayer","Play Fullscreen Video")}
               </react_native_1.Text>
-              <react_native_1.TouchableOpacity activeOpacity={.8}onPress={()=>k(l=>l>=.9?.1:l+.3)}style={previewStyles.progressTrack}>
-                <react_native_1.View style={[previewStyles.progressFill,{width:`${Math.max(10,Math.min(100,h*100))}%`}]}/>
-                <react_native_1.View style={[previewStyles.scrubberThumb,{left:`${Math.max(8,Math.min(96,h*100))}%`}]}/>
-              </react_native_1.TouchableOpacity>
-              <react_native_1.Text style={previewStyles.timeLabel}>{V}</react_native_1.Text>
-            </react_native_1.View>
+            </TouchableScale_1.default>}
 
-            
-            <react_native_1.View style={previewStyles.controlsRow}>
-              
-              <react_native_1.TouchableOpacity onPress={w}style={previewStyles.controlActionPill}>
-                {C?<NetworkIcons_1.PauseIcon size={14}color={AppColors_1.AppColors.sky400}/>:<NetworkIcons_1.PlayIcon size={14}color={AppColors_1.AppColors.sky400}/>}
-                <react_native_1.Text style={[previewStyles.controlActionText,{color:AppColors_1.AppColors.sky400}]}>
-                  {C?o("mediaGallery.pause","Pause"):o("mediaGallery.play","Play")}
-                </react_native_1.Text>
-              </react_native_1.TouchableOpacity>
-
-              
-              <react_native_1.View style={previewStyles.speedGroup}>
-                {["1.0x","1.5x","2.0x"].map(l=><react_native_1.TouchableOpacity key={l}onPress={()=>x(l)}style={[previewStyles.speedBtn,A===l&&previewStyles.speedBtnActive]}>
-                    <react_native_1.Text style={[previewStyles.speedText,A===l&&previewStyles.speedTextActive]}>
-                      {l}
-                    </react_native_1.Text>
-                  </react_native_1.TouchableOpacity>)}
-              </react_native_1.View>
-
-              
-              <react_native_1.TouchableOpacity onPress={()=>S(!c)}style={[previewStyles.loopPill,c&&previewStyles.loopPillActive]}>
-                <NetworkIcons_1.RepeatIcon size={12}color={c?AppColors_1.AppColors.sky400:AppColors_1.AppColors.whiteAlpha60}/>
-                <react_native_1.Text style={[previewStyles.loopText,c&&previewStyles.loopTextActive]}>
-                  {c?"Loop: ON":"Loop: OFF"}
-                </react_native_1.Text>
-              </react_native_1.TouchableOpacity>
-            </react_native_1.View>
-          </react_native_1.View>}
-
-        
-        {m&&<react_native_1.View style={previewStyles.footer}>
-            <TouchableScale_1.default onPress={u}style={[previewStyles.actionBtn,{backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderColor:AppColors_1.AppColors.whiteAlpha15}]}>
-              <NetworkIcons_1.CopyIcon size={14}color={AppColors_1.AppColors.slate200}/>
-              <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.slate200}]}>
-                {o("mediaGallery.copyUri","Copy URI")}
+          <react_native_1.View style={previewStyles.actionsRow}>
+            <TouchableScale_1.default onPress={c}style={previewStyles.actionBtn}>
+              <NetworkIcons_1.CopyIcon size={14}color={AppColors_1.AppColors.grayText}/>
+              <react_native_1.Text style={previewStyles.actionText}>
+                {t("mediaGallery.copyUri","Copy URI")}
               </react_native_1.Text>
             </TouchableScale_1.default>
 
-            {r&&s&&<TouchableScale_1.default onPress={P}disabled={y}style={[previewStyles.actionBtn,{backgroundColor:`${AppColors_1.AppColors.warningAmber}22`,borderColor:`${AppColors_1.AppColors.warningAmber}70`}]}>
-                <NetworkIcons_1.GifIcon size={15}color={AppColors_1.AppColors.warningAmber}/>
-                <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.warningAmber}]}>
-                  {o(y?"mediaGallery.converting":"mediaGallery.convertToGif")}
+            {r&&l&&<TouchableScale_1.default onPress={x}disabled={u}style={[previewStyles.actionBtn,{backgroundColor:AppColors_1.AppColors.amber100,borderColor:AppColors_1.AppColors.amber200}]}>
+                <NetworkIcons_1.GifIcon size={15}color={AppColors_1.AppColors.amber600}/>
+                <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.amber600,fontFamily:AppFonts_1.AppFonts.interBold}]}>
+                  {t(u?"mediaGallery.converting":"mediaGallery.convertToGif")}
                 </react_native_1.Text>
               </TouchableScale_1.default>}
 
-            <TouchableScale_1.default onPress={_}style={[previewStyles.actionBtn,{backgroundColor:`${AppColors_1.AppColors.sky400}22`,borderColor:`${AppColors_1.AppColors.sky400}70`}]}>
-              <NetworkIcons_1.ShareIcon size={14}color={AppColors_1.AppColors.sky400}/>
-              <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interSemiBold}]}>
-                {o("mediaGallery.share","Share")}
+            <TouchableScale_1.default onPress={w}style={[previewStyles.actionBtn,{backgroundColor:AppColors_1.AppColors.indigo600,borderColor:AppColors_1.AppColors.indigo600}]}>
+              <NetworkIcons_1.ShareIcon size={14}color={AppColors_1.AppColors.white}/>
+              <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.white,fontFamily:AppFonts_1.AppFonts.interBold}]}>
+                {t("mediaGallery.share","Share")}
               </react_native_1.Text>
             </TouchableScale_1.default>
-          </react_native_1.View>}
+
+            {!l&&<TouchableScale_1.default onPress={f}style={[previewStyles.actionBtn,{backgroundColor:AppColors_1.AppColors.red100,borderColor:`${AppColors_1.AppColors.red500}4D`}]}>
+                <NetworkIcons_1.TrashIcon size={14}color={AppColors_1.AppColors.red500}/>
+                <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.red500,fontFamily:AppFonts_1.AppFonts.interBold}]}>
+                  {t("mediaGallery.delete","Delete")}
+                </react_native_1.Text>
+              </TouchableScale_1.default>}
+          </react_native_1.View>
+        </react_native_1.View>
       </react_native_1.View>
-    </react_native_1.Modal>};exports.MediaPreviewModal=MediaPreviewModal;const previewStyles=react_native_1.StyleSheet.create({overlay:{flex:1,backgroundColor:AppColors_1.AppColors.mediaModalBg,justifyContent:"space-between"},header:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:16,paddingTop:react_native_1.Platform.OS==="ios"?52:20,paddingBottom:14,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.borderGlassLight,backgroundColor:AppColors_1.AppColors.headerGlassDark},headerLeft:{flexDirection:"row",alignItems:"center",gap:10,flex:1,minWidth:0,marginRight:10},headerRight:{flexDirection:"row",alignItems:"center",gap:8},badge:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,borderWidth:1},badgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,letterSpacing:.4},title:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13.5,color:AppColors_1.AppColors.white},subtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:11,color:AppColors_1.AppColors.whiteAlpha60,marginTop:1},headerActionBtn:{width:32,height:32,borderRadius:16,backgroundColor:AppColors_1.AppColors.whiteAlpha12,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20,alignItems:"center",justifyContent:"center"},headerShareBtn:{width:32,height:32,borderRadius:16,backgroundColor:`${AppColors_1.AppColors.sky400}20`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}60`,alignItems:"center",justifyContent:"center"},headerDeleteBtn:{width:32,height:32,borderRadius:16,backgroundColor:`${AppColors_1.AppColors.red500}20`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}60`,alignItems:"center",justifyContent:"center"},headerIconBtn:{width:32,height:32,borderRadius:16,backgroundColor:AppColors_1.AppColors.whiteAlpha12,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20,alignItems:"center",justifyContent:"center"},stage:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:10,paddingTop:10,paddingBottom:10},stageExpanded:{paddingHorizontal:0,paddingTop:0,paddingBottom:0},previewCard:{flex:1,width:"100%",borderRadius:14,overflow:"hidden",backgroundColor:AppColors_1.AppColors.mediaDarkTile,borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassLight,alignItems:"center",justifyContent:"center",position:"relative"},previewCardExpanded:{borderRadius:0,borderWidth:0},image:{width:"100%",height:"100%"},videoImageOverlay:{...react_native_1.StyleSheet.absoluteFillObject,backgroundColor:"rgba(5, 7, 13, 0.25)"},videoFallbackBackdrop:{flex:1,width:"100%",backgroundColor:AppColors_1.AppColors.mediaPlayerBg,alignItems:"center",justifyContent:"center",gap:8},videoFallbackGlow:{position:"absolute",width:140,height:140,borderRadius:70,backgroundColor:`${AppColors_1.AppColors.sky400}18`},videoFallbackTitle:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:15,color:AppColors_1.AppColors.white,marginTop:8},videoFallbackSubtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:12,color:AppColors_1.AppColors.whiteAlpha60},centerPlayOverlay:{position:"absolute",alignItems:"center",justifyContent:"center",gap:8},centerPlayCircle:{width:64,height:64,borderRadius:32,backgroundColor:`${AppColors_1.AppColors.sky400}E0`,alignItems:"center",justifyContent:"center",paddingLeft:3,shadowColor:AppColors_1.AppColors.sky400,shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:10,elevation:8},centerPlayText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13,color:AppColors_1.AppColors.white,letterSpacing:.3,textShadowColor:"rgba(0,0,0,0.7)",textShadowOffset:{width:0,height:1},textShadowRadius:3},videoBadgeOverlay:{position:"absolute",bottom:12,left:12},playPill:{flexDirection:"row",alignItems:"center",gap:6,backgroundColor:`${AppColors_1.AppColors.slate900}D9`,paddingHorizontal:10,paddingVertical:5,borderRadius:16,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20},playPillText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11,color:AppColors_1.AppColors.white,letterSpacing:.3},floatingMetaBadge:{position:"absolute",bottom:10,backgroundColor:`${AppColors_1.AppColors.slate900}D9`,paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha15,alignItems:"center",justifyContent:"center"},floatingMetaText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.slate200,letterSpacing:.2},videoControlsPanel:{paddingHorizontal:16,paddingTop:8,paddingBottom:6,backgroundColor:AppColors_1.AppColors.headerGlassDark,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.borderGlassLight,gap:8},progressSection:{flexDirection:"row",alignItems:"center",gap:10},timeLabel:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.whiteAlpha60,minWidth:42},progressTrack:{flex:1,height:6,borderRadius:3,backgroundColor:AppColors_1.AppColors.whiteAlpha15,justifyContent:"center",position:"relative"},progressFill:{height:"100%",borderRadius:3,backgroundColor:AppColors_1.AppColors.sky400},scrubberThumb:{position:"absolute",width:12,height:12,borderRadius:6,backgroundColor:AppColors_1.AppColors.white,borderWidth:2,borderColor:AppColors_1.AppColors.sky400,top:-3,marginLeft:-6},controlsRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:2},controlActionPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:10,paddingVertical:5,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.sky400}18`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}50`},controlActionText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11.5},speedGroup:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderRadius:6,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha12,padding:2,gap:2},speedBtn:{paddingHorizontal:7,paddingVertical:3,borderRadius:4},speedBtnActive:{backgroundColor:`${AppColors_1.AppColors.sky400}30`},speedText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.whiteAlpha60},speedTextActive:{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interBold},loopPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:5,borderRadius:6,backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha12},loopPillActive:{backgroundColor:`${AppColors_1.AppColors.sky400}18`,borderColor:`${AppColors_1.AppColors.sky400}50`},loopText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.whiteAlpha60},loopTextActive:{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interSemiBold},footer:{flexDirection:"row",alignItems:"center",justifyContent:"center",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:8,paddingBottom:react_native_1.Platform.OS==="ios"?34:16,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.borderGlassLight,backgroundColor:AppColors_1.AppColors.headerGlassDark},actionBtn:{flexDirection:"row",alignItems:"center",gap:6,paddingHorizontal:16,paddingVertical:9,borderRadius:8,backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha15},actionText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:12,color:AppColors_1.AppColors.white}});
+
+      
+      <ConfirmationModal_1.ConfirmationModal visible={T}title={t("mediaGallery.deleteTitle","Delete Media?")}message={t("mediaGallery.deleteMessage",{filename:e.filename})}confirmText={t("mediaGallery.delete","Delete")}cancelText={t("common.cancel","Cancel")}isDestructive={!0}icon="trash"onConfirm={()=>{p(!1),i(e),a()}}onCancel={()=>p(!1)}/>
+    </react_native_1.Modal>};exports.MediaPreviewModal=MediaPreviewModal;const previewStyles=react_native_1.StyleSheet.create({overlay:{flex:1,backgroundColor:AppColors_1.AppColors.slate900,justifyContent:"space-between"},header:{flexShrink:0,minHeight:react_native_1.Platform.OS==="ios"?96:66,flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:16,paddingTop:react_native_1.Platform.OS==="ios"?48:react_native_1.StatusBar.currentHeight?react_native_1.StatusBar.currentHeight+8:18,paddingBottom:14,borderBottomWidth:react_native_1.StyleSheet.hairlineWidth,borderBottomColor:"rgba(255, 255, 255, 0.25)",zIndex:10},headerLeft:{flexDirection:"row",alignItems:"center",gap:10,flex:1,minWidth:0,marginRight:8},headerTextCol:{flex:1,minWidth:0},headerRight:{flexDirection:"row",alignItems:"center",gap:7},badge:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:7,paddingVertical:3.5,borderRadius:6,backgroundColor:"rgba(255, 255, 255, 0.22)",borderWidth:1,borderColor:"rgba(255, 255, 255, 0.38)"},badgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,letterSpacing:.4,color:AppColors_1.AppColors.white},title:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13,color:AppColors_1.AppColors.white},subtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:11,color:"rgba(255, 255, 255, 0.6)",marginTop:1},headerActionBtn:{width:30,height:30,borderRadius:8,backgroundColor:"rgba(255, 255, 255, 0.22)",borderWidth:1,borderColor:"rgba(255, 255, 255, 0.38)",alignItems:"center",justifyContent:"center"},headerDeleteBtn:{width:30,height:30,borderRadius:8,backgroundColor:"rgba(239, 68, 68, 0.35)",borderWidth:1,borderColor:"rgba(252, 165, 165, 0.55)",alignItems:"center",justifyContent:"center"},headerIconBtn:{width:30,height:30,borderRadius:8,backgroundColor:"rgba(255, 255, 255, 0.22)",borderWidth:1,borderColor:"rgba(255, 255, 255, 0.38)",alignItems:"center",justifyContent:"center"},stage:{flex:1,minHeight:0,alignItems:"center",justifyContent:"center",paddingHorizontal:14,paddingVertical:12,overflow:"hidden"},stageExpanded:{paddingHorizontal:0,paddingVertical:0},previewCard:{flex:1,width:"100%",minHeight:0,borderRadius:16,overflow:"hidden",backgroundColor:AppColors_1.AppColors.slate900,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.1)",alignItems:"center",justifyContent:"center",position:"relative"},previewCardExpanded:{borderRadius:0,borderWidth:0},image:{width:"100%",height:"100%"},videoImageOverlay:{...react_native_1.StyleSheet.absoluteFillObject,backgroundColor:"rgba(10, 13, 20, 0.28)"},videoFallbackBackdrop:{flex:1,width:"100%",backgroundColor:AppColors_1.AppColors.slate900,alignItems:"center",justifyContent:"center",padding:24},videoFallbackGlow:{position:"absolute",width:150,height:150,borderRadius:75,backgroundColor:"rgba(56, 189, 248, 0.08)"},videoFallbackTitle:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:15,color:AppColors_1.AppColors.white,marginTop:12},videoFallbackSubtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:12,color:"rgba(255, 255, 255, 0.6)",marginTop:4},centerPlayContainer:{position:"absolute",alignItems:"center",justifyContent:"center",gap:8},centerPlayGlow:{position:"absolute",width:80,height:80,borderRadius:40,backgroundColor:"rgba(56, 189, 248, 0.22)"},centerPlayCircle:{width:62,height:62,borderRadius:31,backgroundColor:AppColors_1.AppColors.sky500,alignItems:"center",justifyContent:"center",paddingLeft:3,shadowColor:AppColors_1.AppColors.sky500,shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:10,elevation:8},centerPlayPill:{backgroundColor:"rgba(15, 23, 42, 0.90)",paddingHorizontal:12,paddingVertical:4,borderRadius:12,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.15)"},centerPlayText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11.5,color:AppColors_1.AppColors.white,letterSpacing:.3},topLeftBadgeOverlay:{position:"absolute",top:12,left:12},bottomRightBadgeOverlay:{position:"absolute",bottom:12,right:12},metaPill:{flexDirection:"row",alignItems:"center",gap:5,backgroundColor:"rgba(15, 23, 42, 0.90)",paddingHorizontal:10,paddingVertical:5,borderRadius:12,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.15)"},metaPillText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11,color:AppColors_1.AppColors.white,letterSpacing:.2},footer:{flexShrink:0,paddingHorizontal:16,paddingTop:12,paddingBottom:react_native_1.Platform.OS==="ios"?34:16,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.grayBorderSecondary,backgroundColor:AppColors_1.AppColors.white,gap:10,zIndex:10,...react_native_1.Platform.select({ios:{shadowColor:AppColors_1.AppColors.slate900,shadowOffset:{width:0,height:-3},shadowOpacity:.08,shadowRadius:8},android:{elevation:6}})},primaryPlayBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:8,width:"100%",paddingVertical:12,borderRadius:12,backgroundColor:AppColors_1.AppColors.indigo600,shadowColor:AppColors_1.AppColors.indigo600,shadowOffset:{width:0,height:3},shadowOpacity:.35,shadowRadius:6,elevation:4},primaryPlayText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:13.5,color:AppColors_1.AppColors.white,letterSpacing:.3},actionsRow:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:8},actionBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:10,paddingHorizontal:12,borderRadius:10,backgroundColor:AppColors_1.AppColors.graySurface,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary},actionText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:12,color:AppColors_1.AppColors.grayText}});

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

@@ -1,28 +1,28 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(a,r,o,l){l===void 0&&(l=o);var i=Object.getOwnPropertyDescriptor(r,o);(!i||("get"in i?!r.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return r[o]}}),Object.defineProperty(a,l,i)}):(function(a,r,o,l){l===void 0&&(l=o),a[l]=r[o]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(a,r){Object.defineProperty(a,"default",{enumerable:!0,value:r})}):function(a,r){a.default=r}),__importStar=this&&this.__importStar||(function(){var a=function(r){return a=Object.getOwnPropertyNames||function(o){var l=[];for(var i in o)Object.prototype.hasOwnProperty.call(o,i)&&(l[l.length]=i);return l},a(r)};return function(r){if(r&&r.__esModule)return r;var o={};if(r!=null)for(var l=a(r),i=0;i<l.length;i++)l[i]!=="default"&&__createBinding(o,r,l[i]);return __setModuleDefault(o,r),o}})(),__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")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),TouchableScale_1=__importDefault(require("../TouchableScale")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),DomainHeader_1=__importDefault(require("../DomainHeader")),LogCard_1=__importDefault(require("../LogCard")),EmptyState_1=__importDefault(require("../EmptyState")),EndOfListFooter_1=__importDefault(require("../EndOfListFooter")),NetworkFilterModal_1=__importDefault(require("./NetworkFilterModal")),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),i18n_1=require("../../i18n"),NetworkIcons_1=require("../NetworkIcons"),NetworkTab=react_1.default.memo(()=>{const{groupedData:a,loadMoreSection:r,search:o,setSearch:l,setSearchScope:i,quickFilter:A,setQuickFilter:V,handleDelete:D,selectedLogs:b,sortOrder:z,setSortOrder:m,statusFilters:c,setStatusFilters:C,methodFilters:d,setMethodFilters:_,filteredLogs:w,logs:h,toggleSectionFilter:I,toggleSectionCollapse:R,minStart:O,totalRange:q,newLogIds:k,toggleSelect:L,setSelected:B}=(0,InspectorContext_1.useInspector)(),{t:v}=(0,i18n_1.useTranslation)(),N=(0,react_1.useRef)(null),[$,x]=react_1.default.useState(!1),[P,M]=react_1.default.useState(!1),E=(0,react_1.useMemo)(()=>({statusCodes:c.size>0?new Set(c):new Set(["all"]),methods:d.size>0?new Set(d):new Set(["all"]),latency:"all",protocol:"all",sortBy:z==="newest"?"time_desc":"time_asc"}),[c,d,z]),H=(0,react_1.useCallback)(e=>{e.statusCodes.has("all")||e.statusCodes.size===0?C(new Set):C(new Set(e.statusCodes)),e.methods.has("all")||e.methods.size===0?_(new Set):_(new Set([...e.methods].map(n=>n))),e.sortBy==="time_asc"?m("oldest"):m("newest")},[C,_,m]),p=(0,react_1.useMemo)(()=>{let e=0,n=0,s=0,u=0,y=0,T=0;return h.forEach(t=>{const g=typeof t.status=="number"?t.status:parseInt(String(t.status),10);t.status===0||t.status==null||!isNaN(g)&&g>=400?e++:!isNaN(g)&&g>=200&&g<400&&n++,(t.duration||0)>=500&&s++;const f=(t.method||"").toUpperCase();f==="POST"&&u++,f==="GET"&&y++;const F=(t.url||"").toLowerCase(),S=(t.client||"").toLowerCase();(F.includes("graphql")||S.includes("graphql")||S.includes("apollo"))&&T++}),{all:h.length,errors:e,success:n,slow:s,post:u,get:y,graphql:T}},[h]),j=(0,react_1.useMemo)(()=>[{id:"all",label:"All",count:p.all,color:AppColors_1.AppColors.purple},{id:"errors",label:"Errors",count:p.errors,color:AppColors_1.AppColors.errorColor},{id:"success",label:"2xx OK",count:p.success,color:AppColors_1.AppColors.greenColor},{id:"slow",label:"Slow >500ms",count:p.slow,color:AppColors_1.AppColors.warningIconGold},{id:"POST",label:"POST",count:p.post,color:constants_1.METHOD_COLORS.POST||"#3B82F6"},{id:"GET",label:"GET",count:p.get,color:constants_1.METHOD_COLORS.GET||"#10B981"},{id:"graphql",label:"GraphQL",count:p.graphql,color:AppColors_1.AppColors.graphqlPink}],[p]),W=(0,react_1.useCallback)(({item:e,index:n})=>{if(e.type==="header")return<AnimatedEntrance_1.default index={n}distance={8}>
-            <DomainHeader_1.default pageName={e.pageName}color={e.color}stats={e.stats}activeFilters={e.activeFilters}onToggleFilter={I}isCollapsed={e.isCollapsed}onToggleCollapse={R}isFirst={e.isFirst}timestamp={e.timestamp}/>
-          </AnimatedEntrance_1.default>;if(e.type==="loadMore"){const{pageName:T,color:t,remainingCount:g,totalCount:f,loadedCount:F,loadMoreStep:S,hasMore:G}=e;return<react_native_1.View style={[styles_1.default.treeNodeRow,styles_1.default.treeNodeRowLast]}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(l,r,o,a){a===void 0&&(a=o);var i=Object.getOwnPropertyDescriptor(r,o);(!i||("get"in i?!r.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return r[o]}}),Object.defineProperty(l,a,i)}):(function(l,r,o,a){a===void 0&&(a=o),l[a]=r[o]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(l,r){Object.defineProperty(l,"default",{enumerable:!0,value:r})}):function(l,r){l.default=r}),__importStar=this&&this.__importStar||(function(){var l=function(r){return l=Object.getOwnPropertyNames||function(o){var a=[];for(var i in o)Object.prototype.hasOwnProperty.call(o,i)&&(a[a.length]=i);return a},l(r)};return function(r){if(r&&r.__esModule)return r;var o={};if(r!=null)for(var a=l(r),i=0;i<a.length;i++)a[i]!=="default"&&__createBinding(o,r,a[i]);return __setModuleDefault(o,r),o}})(),__importDefault=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),InspectorContext_1=require("./InspectorContext"),TouchableScale_1=__importDefault(require("../TouchableScale")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),DomainHeader_1=__importDefault(require("../DomainHeader")),LogCard_1=__importDefault(require("../LogCard")),EmptyState_1=__importDefault(require("../EmptyState")),EndOfListFooter_1=__importDefault(require("../EndOfListFooter")),NetworkFilterModal_1=__importDefault(require("./NetworkFilterModal")),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),constants_1=require("../../constants"),i18n_1=require("../../i18n"),NetworkIcons_1=require("../NetworkIcons"),NetworkTab=react_1.default.memo(()=>{const{groupedData:l,loadMoreSection:r,search:o,setSearch:a,setSearchScope:i,quickFilter:v,setQuickFilter:P,handleDelete:U,isGroupByPageEnabled:d,setIsGroupByPageEnabled:X,selectedLogs:x,sortOrder:J,setSortOrder:z,statusFilters:u,setStatusFilters:m,methodFilters:p,setMethodFilters:T,latencyFilter:h,setLatencyFilter:F,protocolFilter:y,setProtocolFilter:I,networkSortBy:b,setNetworkSortBy:L,filteredLogs:f,logs:A,toggleSectionFilter:M,toggleSectionCollapse:D,minStart:E,totalRange:N,newLogIds:H,toggleSelect:$,setSelected:j,maxNetworkLogs:q}=(0,InspectorContext_1.useInspector)(),{t:R}=(0,i18n_1.useTranslation)(),Y=(0,react_1.useRef)(null),[Z,W]=react_1.default.useState(!1),[G,Q]=react_1.default.useState(!1),[k,K]=react_1.default.useState(q||50);react_1.default.useEffect(()=>{K(q||50)},[o,v,q]);const ee=(0,react_1.useMemo)(()=>d?l:l.slice(0,k),[d,l,k]),te=(0,react_1.useCallback)(e=>e?.id?String(e.id):"",[]),C=(0,react_1.useMemo)(()=>u.size>0&&!u.has("all")||p.size>0&&!p.has("all")||h!=="all"||y!=="all"||b!=="time_desc",[u,p,h,y,b]),oe=(0,react_1.useMemo)(()=>{let e=0;return u.size>0&&!u.has("all")&&(e+=u.size),p.size>0&&!p.has("all")&&(e+=p.size),h!=="all"&&e++,y!=="all"&&e++,b!=="time_desc"&&e++,e},[u,p,h,y,b]),re=(0,react_1.useMemo)(()=>({statusCodes:u.size>0?new Set(u):new Set(["all"]),methods:p.size>0?new Set(p):new Set(["all"]),latency:h,protocol:y,sortBy:b}),[u,p,h,y,b]),le=(0,react_1.useCallback)(e=>{e.statusCodes.has("all")||e.statusCodes.size===0?m(new Set):m(new Set(e.statusCodes)),e.methods.has("all")||e.methods.size===0?T(new Set):T(new Set([...e.methods].map(n=>n))),F(e.latency||"all"),I(e.protocol||"all"),L(e.sortBy||"time_desc"),e.sortBy==="time_asc"?z("oldest"):z("newest")},[m,T,F,I,L,z]),g=(0,react_1.useMemo)(()=>{let e=0,n=0,s=0,c=0,V=0,O=0;return A.forEach(t=>{const _=typeof t.status=="number"?t.status:parseInt(String(t.status),10);t.status===0||t.status==null||!isNaN(_)&&_>=400?e++:!isNaN(_)&&_>=200&&_<400&&n++,(t.duration||0)>=500&&s++;const w=(t.method||"").toUpperCase();w==="POST"&&c++,w==="GET"&&V++;const B=(t.url||"").toLowerCase(),S=(t.client||"").toLowerCase();(B.includes("graphql")||S.includes("graphql")||S.includes("apollo"))&&O++}),{all:A.length,errors:e,success:n,slow:s,post:c,get:V,graphql:O}},[A]),ae=(0,react_1.useMemo)(()=>[{id:"all",label:"All",count:g.all,color:AppColors_1.AppColors.purple},{id:"errors",label:"Errors",count:g.errors,color:AppColors_1.AppColors.errorColor},{id:"success",label:"2xx OK",count:g.success,color:AppColors_1.AppColors.greenColor},{id:"slow",label:"Slow >500ms",count:g.slow,color:AppColors_1.AppColors.warningIconGold},{id:"POST",label:"POST",count:g.post,color:constants_1.METHOD_COLORS.POST||AppColors_1.AppColors.blue500},{id:"GET",label:"GET",count:g.get,color:constants_1.METHOD_COLORS.GET||AppColors_1.AppColors.emerald500},{id:"graphql",label:"GraphQL",count:g.graphql,color:AppColors_1.AppColors.graphqlPink}],[g]),ie=(0,react_1.useCallback)(({item:e,index:n})=>{if(e.type==="header")return<AnimatedEntrance_1.default index={n}distance={8}>
+            <DomainHeader_1.default pageName={e.pageName}color={e.color}stats={e.stats}activeFilters={e.activeFilters}onToggleFilter={M}isCollapsed={e.isCollapsed}onToggleCollapse={D}isFirst={e.isFirst}timestamp={e.timestamp}/>
+          </AnimatedEntrance_1.default>;if(e.type==="loadMore"){const{pageName:O,color:t,remainingCount:_,totalCount:w,loadedCount:B,loadMoreStep:S,hasMore:ne}=e;return<react_native_1.View style={[styles_1.default.treeNodeRow,styles_1.default.treeNodeRowLast]}>
             <react_native_1.View style={styles_1.default.treeLines}>
               <react_native_1.View style={[styles_1.default.modernTreeLine,{borderColor:t},styles_1.default.modernTreeLineLast]}/>
             </react_native_1.View>
             <react_native_1.View style={styles_1.default.treeCardWrapper}>
-              {G?<TouchableScale_1.default onPress={()=>r(T,50)}hitSlop={6}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:9,paddingHorizontal:12,marginVertical:3,marginRight:2,borderRadius:10,backgroundColor:`${t}14`,borderWidth:1.5,borderColor:`${t}40`,shadowColor:t,shadowOffset:{width:0,height:1.5},shadowOpacity:.1,shadowRadius:3,elevation:2}}>
+              {ne?<TouchableScale_1.default onPress={()=>r(O,S||10)}hitSlop={6}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:9,paddingHorizontal:12,marginVertical:3,marginRight:2,borderRadius:10,backgroundColor:`${t}14`,borderWidth:1.5,borderColor:`${t}40`,shadowColor:t,shadowOffset:{width:0,height:1.5},shadowOpacity:.1,shadowRadius:3,elevation:2}}>
                   <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:8}}>
                     <react_native_1.View style={{width:22,height:22,borderRadius:11,backgroundColor:t,alignItems:"center",justifyContent:"center",shadowColor:t,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1}}>
                       <NetworkIcons_1.ChevronIcon color={AppColors_1.AppColors.white}size={9}direction="down"/>
                     </react_native_1.View>
                     <react_native_1.View>
                       <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12,color:t}}>
-                        {v("footer.loadMoreRequests",{count:S,defaultValue:`Load ${S} More Requests`})}
+                        {R("footer.loadMoreRequests",{count:S,defaultValue:`Load ${S} More Requests`})}
                       </react_native_1.Text>
                       <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak,marginTop:1}}>
-                        Showing {F} of {f} requests
+                        Showing {B} of {w} requests
                       </react_native_1.Text>
                     </react_native_1.View>
                   </react_native_1.View>
 
                   <react_native_1.View style={{flexDirection:"row",alignItems:"center",backgroundColor:`${t}25`,paddingHorizontal:8,paddingVertical:4,borderRadius:8,borderWidth:1,borderColor:`${t}40`,gap:3}}>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:t}}>
-                      +{g}
+                      +{_}
                     </react_native_1.Text>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:9,color:t}}>
                       more
@@ -34,62 +34,62 @@
                       <NetworkIcons_1.CheckIcon color={t}size={8}/>
                     </react_native_1.View>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.grayTextStrong}}>
-                      {v("footer.allLoaded",{count:f,defaultValue:`All ${f} requests loaded`})}
+                      {R("footer.allLoaded",{count:w,defaultValue:`All ${w} requests loaded`})}
                     </react_native_1.Text>
                   </react_native_1.View>
 
                   <react_native_1.View style={{backgroundColor:`${t}18`,paddingHorizontal:7,paddingVertical:2,borderRadius:6}}>
                     <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:t}}>
-                      {f}/{f}
+                      {w}/{w}
                     </react_native_1.Text>
                   </react_native_1.View>
                 </react_native_1.View>}
             </react_native_1.View>
-          </react_native_1.View>}const{log:s,isLast:u,color:y}=e;return<AnimatedEntrance_1.default index={n}distance={8}style={[styles_1.default.treeNodeRow,u&&styles_1.default.treeNodeRowLast]}>
-          <react_native_1.View style={styles_1.default.treeLines}>
-            <react_native_1.View style={[styles_1.default.modernTreeLine,{borderColor:y},u&&styles_1.default.modernTreeLineLast]}/>
-            {!u&&<react_native_1.View style={[styles_1.default.modernTreeBranch,{borderColor:y}]}/>}
+          </react_native_1.View>}const{log:s,isLast:c,color:V}=e;return<AnimatedEntrance_1.default index={n}distance={8}style={d?[styles_1.default.treeNodeRow,c&&styles_1.default.treeNodeRowLast]:{marginBottom:6,marginHorizontal:2}}>
+          {d&&<react_native_1.View style={styles_1.default.treeLines}>
+              <react_native_1.View style={[styles_1.default.modernTreeLine,{borderColor:V},c&&styles_1.default.modernTreeLineLast]}/>
+              {!c&&<react_native_1.View style={[styles_1.default.modernTreeBranch,{borderColor:V}]}/>}
+            </react_native_1.View>}
+          <react_native_1.View style={d?styles_1.default.treeCardWrapper:{flex:1}}>
+            <LogCard_1.default item={s}isSelected={x.has(s.id)}onToggleSelect={$}onPress={()=>{j(s)}}timelineMinStart={E}timelineTotalRange={N}isNew={H.has(s.id)}searchStr={o}/>
           </react_native_1.View>
-          <react_native_1.View style={styles_1.default.treeCardWrapper}>
-            <LogCard_1.default item={s}isSelected={b.has(s.id)}onToggleSelect={L}onPress={()=>{B(s)}}timelineMinStart={O}timelineTotalRange={q}isNew={k.has(s.id)}searchStr={o}/>
-          </react_native_1.View>
-        </AnimatedEntrance_1.default>},[O,q,k,b,L,o,I,R,r,B,v]);return<react_native_1.View style={{flex:1}}>
+        </AnimatedEntrance_1.default>},[d,E,N,H,x,$,o,M,D,r,j,R]);return<react_native_1.View style={{flex:1}}>
       <react_native_1.View style={{marginTop:6}}>
             
             <react_native_1.View style={styles_1.default.toolbarRow}>
-              <react_native_1.View style={[styles_1.default.searchContainer,P&&{borderColor:AppColors_1.AppColors.purple,borderWidth:1.5}]}>
-                <NetworkIcons_1.SearchIcon color={P?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextWeak}size={15}/>
-                <react_native_1.TextInput placeholder="Search URL, status, method, headers, body..."placeholderTextColor={AppColors_1.AppColors.grayTextWeak}value={o}onChangeText={l}onFocus={()=>M(!0)}onBlur={()=>M(!1)}style={styles_1.default.searchInput}autoCorrect={!1}autoCapitalize="none"/>
+              <react_native_1.View style={[styles_1.default.searchContainer,G&&{borderColor:AppColors_1.AppColors.purple,borderWidth:1.5}]}>
+                <NetworkIcons_1.SearchIcon color={G?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextWeak}size={15}/>
+                <react_native_1.TextInput placeholder="Search URL, status, method, headers, body..."placeholderTextColor={AppColors_1.AppColors.grayTextWeak}value={o}onChangeText={a}onFocus={()=>Q(!0)}onBlur={()=>Q(!1)}style={styles_1.default.searchInput}autoCorrect={!1}autoCapitalize="none"/>
 
                 {o.length>0&&<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
                     <react_native_1.View style={{backgroundColor:`${AppColors_1.AppColors.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
                       <react_native_1.Text style={{color:AppColors_1.AppColors.purple,fontSize:9.5,fontFamily:AppFonts_1.AppFonts.interBold}}>
-                        {w.length}
+                        {f.length}
                       </react_native_1.Text>
                     </react_native_1.View>
-                    <react_native_1.Pressable onPress={()=>l("")}hitSlop={10}style={styles_1.default.clearBtn}>
+                    <react_native_1.Pressable onPress={()=>a("")}hitSlop={10}style={styles_1.default.clearBtn}>
                       <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak}size={13}/>
                     </react_native_1.Pressable>
                   </react_native_1.View>}
               </react_native_1.View>
 
               <react_native_1.View style={styles_1.default.toolbarRight}>
-                <TouchableScale_1.default style={[styles_1.default.toolbarBtn,{borderColor:`${AppColors_1.AppColors.errorColor}38`,backgroundColor:`${AppColors_1.AppColors.errorColor}0F`}]}onPress={D}hitSlop={6}>
+                <TouchableScale_1.default style={[styles_1.default.toolbarBtn,{borderColor:`${AppColors_1.AppColors.errorColor}38`,backgroundColor:`${AppColors_1.AppColors.errorColor}0F`}]}onPress={U}hitSlop={6}>
                   <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor}size={15}/>
-                  {b.size>0&&<react_native_1.View style={styles_1.default.trashBadge}>
+                  {x.size>0&&<react_native_1.View style={styles_1.default.trashBadge}>
                       <react_native_1.Text style={styles_1.default.trashBadgeText}>
-                        {b.size}
+                        {x.size}
                       </react_native_1.Text>
                     </react_native_1.View>}
                 </TouchableScale_1.default>
 
-                <TouchableScale_1.default style={styles_1.default.toolbarBtn}onPress={()=>m(e=>e==="newest"?"oldest":"newest")}hitSlop={10}>
-                  <NetworkIcons_1.SortArrowIcon direction={z==="newest"?"down":"up"}color={AppColors_1.AppColors.grayTextStrong}size={18}/>
+                <TouchableScale_1.default style={[styles_1.default.toolbarBtn,d&&{borderColor:AppColors_1.AppColors.purple,backgroundColor:`${AppColors_1.AppColors.purple}15`}]}onPress={()=>X(e=>!e)}hitSlop={6}accessibilityLabel={d?"Page Accordion Grouping Enabled (Tap for Plain List)":"Plain List Enabled (Tap for Page Accordion)"}accessibilityRole="button">
+                  <NetworkIcons_1.LayersIcon color={d?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextStrong}size={16}/>
+                  {d&&<react_native_1.View style={styles_1.default.activeFilterDot}/>}
                 </TouchableScale_1.default>
 
-                <TouchableScale_1.default style={[styles_1.default.toolbarBtn,(c.size>0||d.size>0)&&{borderColor:AppColors_1.AppColors.purple,backgroundColor:`${AppColors_1.AppColors.purple}15`}]}onPress={()=>x(!0)}hitSlop={6}>
-                  <NetworkIcons_1.FilterIcon color={c.size>0||d.size>0?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayTextStrong}size={16}/>
-                  {(c.size>0||d.size>0)&&<react_native_1.View style={styles_1.default.activeFilterDot}/>}
+                <TouchableScale_1.default style={styles_1.default.toolbarBtn}onPress={()=>z(e=>e==="newest"?"oldest":"newest")}hitSlop={10}>
+                  <NetworkIcons_1.SortArrowIcon direction={J==="newest"?"down":"up"}color={AppColors_1.AppColors.grayTextStrong}size={18}/>
                 </TouchableScale_1.default>
               </react_native_1.View>
             </react_native_1.View>
@@ -97,15 +97,15 @@
             
             <react_native_1.View style={{flexDirection:"row",alignItems:"center",marginBottom:8,paddingHorizontal:12,gap:6}}>
               <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!1}style={{flex:1}}contentContainerStyle={{flexDirection:"row",alignItems:"center",gap:6,paddingRight:6}}>
-                {j.map(e=>{const n=A===e.id,s=e.color||AppColors_1.AppColors.purple,u=n?AppColors_1.AppColors.white:s;return<TouchableScale_1.default key={e.id}onPress={()=>{V(n?"all":e.id)}}>
+                {ae.map(e=>{const n=v===e.id,s=e.color||AppColors_1.AppColors.purple,c=n?AppColors_1.AppColors.white:s;return<TouchableScale_1.default key={e.id}onPress={()=>{P(n?"all":e.id)}}>
                       <react_native_1.View style={{flexDirection:"row",alignItems:"center",paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:n?s:`${s}12`,borderWidth:1,borderColor:n?s:`${s}30`,gap:5}}>
-                        {e.id==="all"&&<NetworkIcons_1.LayersIcon size={11}color={u}/>}
-                        {e.id==="errors"&&<NetworkIcons_1.CircleXIcon size={11}color={u}/>}
-                        {e.id==="success"&&<NetworkIcons_1.CircleCheckIcon size={11}color={u}/>}
-                        {e.id==="slow"&&<NetworkIcons_1.ClockIcon size={11}color={u}/>}
-                        {e.id==="POST"&&<NetworkIcons_1.RequestIcon size={11}color={u}/>}
-                        {e.id==="GET"&&<NetworkIcons_1.ResponseIcon size={11}color={u}/>}
-                        {e.id==="graphql"&&<NetworkIcons_1.AtomIcon size={11}color={u}/>}
+                        {e.id==="all"&&<NetworkIcons_1.LayersIcon size={11}color={c}/>}
+                        {e.id==="errors"&&<NetworkIcons_1.CircleXIcon size={11}color={c}/>}
+                        {e.id==="success"&&<NetworkIcons_1.CircleCheckIcon size={11}color={c}/>}
+                        {e.id==="slow"&&<NetworkIcons_1.ClockIcon size={11}color={c}/>}
+                        {e.id==="POST"&&<NetworkIcons_1.RequestIcon size={11}color={c}/>}
+                        {e.id==="GET"&&<NetworkIcons_1.ResponseIcon size={11}color={c}/>}
+                        {e.id==="graphql"&&<NetworkIcons_1.AtomIcon size={11}color={c}/>}
                         <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:n?AppColors_1.AppColors.white:AppColors_1.AppColors.primaryBlack}}>
                           {e.label}
                         </react_native_1.Text>
@@ -118,15 +118,15 @@
                     </TouchableScale_1.default>})}
               </react_native_1.ScrollView>
 
-              <TouchableScale_1.default onPress={()=>x(!0)}style={{flexShrink:0}}>
-                <react_native_1.View style={{flexDirection:"row",alignItems:"center",paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,backgroundColor:c.size>0||d.size>0?`${AppColors_1.AppColors.purple}20`:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:c.size>0||d.size>0?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayBorderSecondary,gap:5,shadowColor:AppColors_1.AppColors.black,shadowOpacity:.04,shadowRadius:2,shadowOffset:{width:0,height:1},elevation:1}}>
-                  <NetworkIcons_1.FilterIcon size={11}color={c.size>0||d.size>0?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayText}/>
-                  <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:c.size>0||d.size>0?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayText}}>
-                    More Filters
+              <TouchableScale_1.default onPress={()=>W(!0)}style={{flexShrink:0}}>
+                <react_native_1.View style={{flexDirection:"row",alignItems:"center",paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,backgroundColor:C?`${AppColors_1.AppColors.purple}20`:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:C?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayBorderSecondary,gap:5,shadowColor:AppColors_1.AppColors.black,shadowOpacity:.04,shadowRadius:2,shadowOffset:{width:0,height:1},elevation:1}}>
+                  <NetworkIcons_1.FilterIcon size={11}color={C?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayText}/>
+                  <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:C?AppColors_1.AppColors.purple:AppColors_1.AppColors.grayText}}>
+                    {R("network.moreFilters","More Filters")}
                   </react_native_1.Text>
-                  {(c.size>0||d.size>0)&&<react_native_1.View style={{backgroundColor:AppColors_1.AppColors.purple,paddingHorizontal:4.5,paddingVertical:1,borderRadius:6}}>
+                  {C&&<react_native_1.View style={{backgroundColor:AppColors_1.AppColors.purple,paddingHorizontal:4.5,paddingVertical:1,borderRadius:6}}>
                       <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.white}}>
-                        {c.size+d.size}
+                        {oe}
                       </react_native_1.Text>
                     </react_native_1.View>}
                 </react_native_1.View>
@@ -134,11 +134,11 @@
             </react_native_1.View>
 
             
-            {(A!=="all"||o.trim().length>0||c.size>0||d.size>0||w.length!==h.length)&&<react_native_1.View style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginHorizontal:12,marginBottom:8,paddingHorizontal:10,paddingVertical:5.5,backgroundColor:`${AppColors_1.AppColors.purple}10`,borderRadius:8,borderWidth:1,borderColor:`${AppColors_1.AppColors.purple}25`}}>
+            {(v!=="all"||o.trim().length>0||C||f.length!==A.length)&&<react_native_1.View style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginHorizontal:12,marginBottom:8,paddingHorizontal:10,paddingVertical:5.5,backgroundColor:`${AppColors_1.AppColors.purple}10`,borderRadius:8,borderWidth:1,borderColor:`${AppColors_1.AppColors.purple}25`}}>
                 <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.purple}}>
-                  Showing {w.length} of {h.length} requests
+                  Showing {f.length} of {A.length} requests
                 </react_native_1.Text>
-                <TouchableScale_1.default onPress={()=>{l(""),V("all"),C(new Set),_(new Set)}}>
+                <TouchableScale_1.default onPress={()=>{a(""),P("all"),m(new Set),T(new Set),F("all"),I("all"),L("time_desc"),i("all")}}>
                   <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.errorColor}}>
                     Clear All Filters
                   </react_native_1.Text>
@@ -146,8 +146,8 @@
               </react_native_1.View>}
           </react_native_1.View>
 
-        <react_native_1.FlatList ref={N}data={a}keyExtractor={e=>e?.id?.toString()}renderItem={W}initialNumToRender={15}maxToRenderPerBatch={10}windowSize={9}removeClippedSubviews={react_native_1.Platform.OS==="android"}renderToHardwareTextureAndroid={!0}ListEmptyComponent={<EmptyState_1.default isSearch={o.length>0||c.size>0||d.size>0||A!=="all"}searchQuery={o}customTitle={o.length>0?"No matching API requests":"No network activity"}onClearSearch={()=>{l(""),C(new Set),_(new Set),V("all"),i("all")}}/>}ListFooterComponent={a.length>0?<EndOfListFooter_1.default count={w.length}totalCount={w.length}label="requests"/>:null}contentContainerStyle={[styles_1.default.listContent,w.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
+        <react_native_1.FlatList ref={Y}data={ee}keyExtractor={te}renderItem={ie}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}ListEmptyComponent={<EmptyState_1.default isSearch={o.length>0||C||v!=="all"}searchQuery={o}customTitle={o.length>0?"No matching API requests":"No network activity"}onClearSearch={()=>{a(""),m(new Set),T(new Set),F("all"),I("all"),L("time_desc"),P("all"),i("all")}}/>}ListFooterComponent={l.length>0?<EndOfListFooter_1.default count={d?f.length:Math.min(k,f.length)}totalCount={f.length}label="requests"hasMore={!d&&f.length>k}loadMoreStep={30}onLoadMore={()=>K(e=>e+30)}/>:null}contentContainerStyle={[styles_1.default.listContent,f.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
 
       
-      <NetworkFilterModal_1.default visible={$}onClose={()=>x(!1)}filters={E}onApply={H}searchQuery={o}/>
+      <NetworkFilterModal_1.default visible={Z}onClose={()=>W(!1)}filters={re}onApply={le}searchQuery={o}/>
     </react_native_1.View>});exports.default=NetworkTab;

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

@@ -9,7 +9,7 @@
     <react_native_svg_1.Path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"stroke={e}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <react_native_svg_1.Path d="M15 3h6v6"stroke={e}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <react_native_svg_1.Path d="M10 14L21 3"stroke={e}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
-  </react_native_svg_1.default>,TOAST_TIMEOUT_MS=7e3,NpmUpdateToast=()=>{const{t}=(0,i18n_1.useTranslation)(),{updateAvailable:e,latestNpmVersion:o,showUpdateToast:r}=(0,InspectorContext_1.useInspector)(),[i,h]=(0,react_1.useState)(!1),[f,d]=(0,react_1.useState)(!1),[n,u]=(0,react_1.useState)(!1),a=(0,react_1.useRef)(new react_native_1.Animated.Value(60)).current,s=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,l=(0,react_1.useRef)(new react_native_1.Animated.Value(1)).current,c=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>(r&&e&&o&&!i&&(d(!0),react_native_1.Animated.parallel([react_native_1.Animated.spring(a,{toValue:0,friction:8,tension:40,useNativeDriver:!0}),react_native_1.Animated.timing(s,{toValue:1,duration:250,useNativeDriver:!0})]).start(),l.setValue(1),react_native_1.Animated.timing(l,{toValue:0,duration:TOAST_TIMEOUT_MS,useNativeDriver:!1}).start(),c.current=setTimeout(()=>{p()},TOAST_TIMEOUT_MS)),()=>{c.current&&clearTimeout(c.current)}),[r,e,o,i]);const p=()=>{react_native_1.Animated.parallel([react_native_1.Animated.timing(s,{toValue:0,duration:180,useNativeDriver:!0}),react_native_1.Animated.timing(a,{toValue:60,duration:180,useNativeDriver:!0})]).start(()=>{d(!1),h(!0)})},v=()=>{(0,helpers_1.copyToClipboard)("npm install react-native-inapp-inspector@latest","Install Command"),u(!0),(0,toast_1.showToast)("Copied npm install command!"),setTimeout(()=>{u(!1)},2e3)},g=()=>{react_native_1.Linking.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),p()};if(typeof __DEV__>"u"||!__DEV__||!r||!f||!e||!o)return null;const _=l.interpolate({inputRange:[0,1],outputRange:["0%","100%"]});return<react_native_1.Animated.View style={[styles.container,{opacity:s,transform:[{translateY:a}]}]}>
+  </react_native_svg_1.default>,TOAST_TIMEOUT_MS=7e3,NpmUpdateToast=()=>{const{t}=(0,i18n_1.useTranslation)(),{updateAvailable:e,latestNpmVersion:o,showUpdateToast:r}=(0,InspectorContext_1.useInspector)(),[i,h]=(0,react_1.useState)(!1),[f,d]=(0,react_1.useState)(!1),[n,u]=(0,react_1.useState)(!1),a=(0,react_1.useRef)(new react_native_1.Animated.Value(60)).current,s=(0,react_1.useRef)(new react_native_1.Animated.Value(0)).current,l=(0,react_1.useRef)(new react_native_1.Animated.Value(1)).current,c=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>(r&&e&&o&&!i&&(d(!0),react_native_1.Animated.parallel([react_native_1.Animated.spring(a,{toValue:0,friction:8,tension:40,useNativeDriver:!0}),react_native_1.Animated.timing(s,{toValue:1,duration:250,useNativeDriver:!0})]).start(),l.setValue(1),react_native_1.Animated.timing(l,{toValue:0,duration:TOAST_TIMEOUT_MS,useNativeDriver:!1}).start(),c.current=setTimeout(()=>{p()},TOAST_TIMEOUT_MS)),()=>{c.current&&clearTimeout(c.current)}),[r,e,o,i]);const p=()=>{react_native_1.Animated.parallel([react_native_1.Animated.timing(s,{toValue:0,duration:180,useNativeDriver:!0}),react_native_1.Animated.timing(a,{toValue:60,duration:180,useNativeDriver:!0})]).start(()=>{d(!1),h(!0)})},v=()=>{(0,helpers_1.copyToClipboard)("npm install react-native-inapp-inspector@latest","Install Command"),u(!0),(0,toast_1.showToast)(t("about.copiedInstallCommand","Copied npm install command!")),setTimeout(()=>{u(!1)},2e3)},g=()=>{react_native_1.Linking.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),p()};if(typeof __DEV__>"u"||!__DEV__||!r||!f||!e||!o)return null;const _=l.interpolate({inputRange:[0,1],outputRange:["0%","100%"]});return<react_native_1.Animated.View style={[styles.container,{opacity:s,transform:[{translateY:a}]}]}>
       <react_native_1.View style={styles.contentRow}>
         
         <react_native_1.View style={styles.npmIconContainer}>

package/dist/commonjs/components/Inspector/PushCard.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import type { PushCardProps } from '../../types';
-declare const PushCard: React.NamedExoticComponent<PushCardProps>;
-export default PushCard;
+declare function PushCard({ item, onPress, searchStr, }: PushCardProps): React.JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof PushCard>;
+export default _default;