react-native-inapp-inspector 2.4.1 → 2.4.2

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

@@ -9,7 +9,7 @@ import{useState as N,useEffect as G,useRef as R}from"react";import{Animated as r
     <C d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"stroke={i}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <C d="M15 3h6v6"stroke={i}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <C d="M10 14L21 3"stroke={i}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>,H=7e3;export const NpmUpdateToast=()=>{const{t}=ie(),{updateAvailable:i,latestNpmVersion:V,showUpdateToast:O}=Q(),[_,U]=N(!1),[F,j]=N(!1),[W,E]=N(!1),I=R(new r.Value(60)).current,D=R(new r.Value(0)).current,z=R(new r.Value(1)).current,A=R(null);G(()=>(O&&i&&V&&!_&&(j(!0),r.parallel([r.spring(I,{toValue:0,friction:8,tension:40,useNativeDriver:!0}),r.timing(D,{toValue:1,duration:250,useNativeDriver:!0})]).start(),z.setValue(1),r.timing(z,{toValue:0,duration:H,useNativeDriver:!1}).start(),A.current=setTimeout(()=>{M()},H)),()=>{A.current&&clearTimeout(A.current)}),[O,i,V,_]);const M=()=>{r.parallel([r.timing(D,{toValue:0,duration:180,useNativeDriver:!0}),r.timing(I,{toValue:60,duration:180,useNativeDriver:!0})]).start(()=>{j(!1),U(!0)})},$=()=>{ee("npm install react-native-inapp-inspector@latest","Install Command"),E(!0),te("Copied npm install command!"),setTimeout(()=>{E(!1)},2e3)},Y=()=>{J.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),M()};if(typeof __DEV__>"u"||!__DEV__||!O||!F||!i||!V)return null;const q=z.interpolate({inputRange:[0,1],outputRange:["0%","100%"]});return<r.View style={[o.container,{opacity:D,transform:[{translateY:I}]}]}>
+  </B>,H=7e3;export const NpmUpdateToast=()=>{const{t}=ie(),{updateAvailable:i,latestNpmVersion:V,showUpdateToast:O}=Q(),[_,U]=N(!1),[F,j]=N(!1),[W,E]=N(!1),I=R(new r.Value(60)).current,D=R(new r.Value(0)).current,z=R(new r.Value(1)).current,A=R(null);G(()=>(O&&i&&V&&!_&&(j(!0),r.parallel([r.spring(I,{toValue:0,friction:8,tension:40,useNativeDriver:!0}),r.timing(D,{toValue:1,duration:250,useNativeDriver:!0})]).start(),z.setValue(1),r.timing(z,{toValue:0,duration:H,useNativeDriver:!1}).start(),A.current=setTimeout(()=>{M()},H)),()=>{A.current&&clearTimeout(A.current)}),[O,i,V,_]);const M=()=>{r.parallel([r.timing(D,{toValue:0,duration:180,useNativeDriver:!0}),r.timing(I,{toValue:60,duration:180,useNativeDriver:!0})]).start(()=>{j(!1),U(!0)})},$=()=>{ee("npm install react-native-inapp-inspector@latest","Install Command"),E(!0),te(t("about.copiedInstallCommand","Copied npm install command!")),setTimeout(()=>{E(!1)},2e3)},Y=()=>{J.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),M()};if(typeof __DEV__>"u"||!__DEV__||!O||!F||!i||!V)return null;const q=z.interpolate({inputRange:[0,1],outputRange:["0%","100%"]});return<r.View style={[o.container,{opacity:D,transform:[{translateY:I}]}]}>
       <T style={o.contentRow}>
         
         <T style={o.npmIconContainer}>

package/dist/esm/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;

package/dist/esm/components/Inspector/PushCard.js

@@ -1,4 +1,4 @@
-import O,{useMemo as $}from"react";import{StyleSheet as F,Text as T,View as C}from"react-native";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as k}from"../../styles/AppFonts";import{formatTime as W}from"../../helpers";import{BellIcon as N,ClockIcon as E,ForwardChevronIcon as A,KeyIcon as U,SunIcon as M,MoonIcon as G,ExternalLinkIcon as K,CloudPushIcon as _}from"../NetworkIcons";import D from"../HighlightText";import X from"../TouchableScale";const q=B=>{const r=(B||"").toLowerCase();return r.includes("salesforce")||r==="sfmc"?{badgeColor:e.sky600,border:e.sky600,cardBg:`${e.sky600}04`,label:"SALESFORCE"}:r.includes("fcm")||r.includes("firebase")?{badgeColor:e.firebaseOrange,border:e.firebaseOrange,cardBg:`${e.firebaseOrange}04`,label:"FCM"}:r.includes("apns")||r.includes("apple")?{badgeColor:e.slate700,border:e.slate700,cardBg:`${e.slate700}04`,label:"APNS"}:r.includes("expo")?{badgeColor:e.brandPurple,border:e.brandPurple,cardBg:`${e.brandPurple}04`,label:"EXPO"}:r.includes("notifee")?{badgeColor:e.pink500,border:e.pink500,cardBg:`${e.pink500}04`,label:"NOTIFEE"}:r.includes("onesignal")?{badgeColor:e.errorColor,border:e.errorColor,cardBg:`${e.errorColor}04`,label:"ONESIGNAL"}:{badgeColor:e.purple,border:e.purple,cardBg:`${e.purple}04`,label:(B||"PUSH").toUpperCase()}},J=(B,r)=>{if(r==="opened")return{label:"OPENED",text:e.brandPurple,bg:`${e.brandPurple}14`,border:`${e.brandPurple}30`,Icon:K};const P=(B||"").toLowerCase();return P==="foreground"?{label:"FOREGROUND",text:e.greenColor,bg:`${e.greenColor}14`,border:`${e.greenColor}30`,Icon:M}:P==="background"?{label:"BACKGROUND",text:e.amber600,bg:`${e.amber600}14`,border:`${e.amber600}30`,Icon:G}:{label:(B||"RECEIVED").toUpperCase(),text:e.grayTextWeak,bg:`${e.grayTextWeak}14`,border:`${e.grayTextWeak}30`,Icon:_}},V=O.memo(function({item:r,onPress:P,searchStr:R=""}){const S=$(()=>q(r.source),[r.source]),H=$(()=>J(r.appState,r.action),[r.appState,r.action]),I=$(()=>r.data?Object.keys(r.data).length:0,[r.data]),z=$(()=>!!(r.data?.deepLink||r.data?.openDirectUrl||r.data?._od||r.customDomainAttributes?.openDirectUrl),[r.data,r.customDomainAttributes]),L=H.Icon;return<X onPress={P}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:S.border,backgroundColor:S.cardBg}]}accessibilityRole="button"accessibilityLabel={`Push Notification: ${r.title||"Notification"}`}>
+import O,{useMemo as R}from"react";import{StyleSheet as F,Text as T,View as C}from"react-native";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as S}from"../../styles/AppFonts";import{useTranslation as W}from"../../i18n";import{formatTime as E}from"../../helpers";import{BellIcon as N,ClockIcon as A,ForwardChevronIcon as U,SunIcon as v,MoonIcon as M,CloudPushIcon as G,LinkChainIcon as K,ExternalLinkIcon as _,KeyIcon as X}from"../NetworkIcons";import $ from"../HighlightText";import J from"../TouchableScale";const Q=r=>{const t=(r||"").toLowerCase();return t.includes("salesforce")||t==="sfmc"?{badgeColor:e.sky600,border:e.sky600,cardBg:`${e.sky600}04`,label:"SALESFORCE"}:t.includes("fcm")||t.includes("firebase")?{badgeColor:e.firebaseOrange,border:e.firebaseOrange,cardBg:`${e.firebaseOrange}04`,label:"FCM"}:t.includes("apns")||t.includes("apple")?{badgeColor:e.slate700,border:e.slate700,cardBg:`${e.slate700}04`,label:"APNS"}:t.includes("expo")?{badgeColor:e.brandPurple,border:e.brandPurple,cardBg:`${e.brandPurple}04`,label:"EXPO"}:t.includes("notifee")?{badgeColor:e.pink500,border:e.pink500,cardBg:`${e.pink500}04`,label:"NOTIFEE"}:t.includes("onesignal")?{badgeColor:e.errorColor,border:e.errorColor,cardBg:`${e.errorColor}04`,label:"ONESIGNAL"}:{badgeColor:e.purple,border:e.purple,cardBg:`${e.purple}04`,label:(r||"PUSH").toUpperCase()}},Y=(r,t)=>{if(t==="opened")return{label:"OPENED",text:e.brandPurple,bg:`${e.brandPurple}14`,border:`${e.brandPurple}30`,Icon:_};const B=(r||"").toLowerCase();return B==="foreground"?{label:"FOREGROUND",text:e.greenColor,bg:`${e.greenColor}14`,border:`${e.greenColor}30`,Icon:v}:B==="background"?{label:"BACKGROUND",text:e.amber600,bg:`${e.amber600}14`,border:`${e.amber600}30`,Icon:M}:{label:(r||"RECEIVED").toUpperCase(),text:e.grayTextWeak,bg:`${e.grayTextWeak}14`,border:`${e.grayTextWeak}30`,Icon:G}};function Z({item:r,onPress:t,searchStr:B=""}){const{t:D}=W(),I=R(()=>Q(r.source),[r.source]),P=R(()=>Y(r.appState,r.action),[r.appState,r.action]),H=R(()=>r.data?Object.keys(r.data).length:0,[r.data]),V=R(()=>!!(r.data?.deepLink||r.data?.openDirectUrl||r.data?._od||r.customDomainAttributes?.openDirectUrl),[r.data,r.customDomainAttributes]),L=P.Icon;return<J onPress={t}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:I.border,backgroundColor:I.cardBg}]}accessibilityRole="button"accessibilityLabel={`Push Notification: ${r.title||"Notification"}`}>
       <C style={o.cardBody}>
         
         <C style={o.cardHeaderRow}>
@@ -8,57 +8,58 @@ import O,{useMemo as $}from"react";import{StyleSheet as F,Text as T,View as C}fr
             </T>
 
             
-            <C style={[o.methodBadge,{backgroundColor:S.badgeColor}]}>
-              <T style={o.methodBadgeText}>{S.label}</T>
+            <C style={[o.methodBadge,{backgroundColor:I.badgeColor}]}>
+              <T style={o.methodBadgeText}>{I.label}</T>
             </C>
 
             
-            <C style={[o.chip,{backgroundColor:`${S.badgeColor}12`,borderColor:`${S.badgeColor}2E`}]}>
-              <T style={[o.chipText,{color:S.badgeColor}]}numberOfLines={1}>
+            <C style={[o.chip,{backgroundColor:`${I.badgeColor}12`,borderColor:`${I.badgeColor}2E`}]}>
+              <T style={[o.chipText,{color:I.badgeColor}]}numberOfLines={1}>
                 push.{(r.source||"remote").toLowerCase()}
               </T>
             </C>
 
             
-            {I>0&&<C style={[o.chip,{backgroundColor:`${e.teal600}14`,borderColor:`${e.teal600}33`}]}>
+            {H>0&&<C style={[o.chip,{backgroundColor:`${e.teal600}14`,borderColor:`${e.teal600}33`}]}>
                 <T style={[o.chipText,{color:e.teal600}]}>
-                  Payload{`{${I}}`}
+                  Payload{`{${H}}`}
                 </T>
               </C>}
 
             
-            {z&&<C style={[o.chip,{backgroundColor:`${e.brandPurple}14`,borderColor:`${e.brandPurple}33`}]}>
+            {V&&<C style={[o.chip,{backgroundColor:`${e.brandPurple}14`,borderColor:`${e.brandPurple}33`,flexDirection:"row",alignItems:"center",gap:3}]}>
+                <K size={10}color={e.brandPurple}/>
                 <T style={[o.chipText,{color:e.brandPurple}]}>
-                  🔗 Link
+                  {D("push.link","Link")}
                 </T>
               </C>}
           </C>
 
           
           <C style={o.cardHeaderRight}>
-            <C style={[o.statusPill,{backgroundColor:H.bg,borderColor:H.border}]}>
-              <L color={H.text}size={9.5}/>
-              <T style={[o.statusPillText,{color:H.text}]}>
-                {H.label}
+            <C style={[o.statusPill,{backgroundColor:P.bg,borderColor:P.border}]}>
+              <L color={P.text}size={9.5}/>
+              <T style={[o.statusPillText,{color:P.text}]}>
+                {P.label}
               </T>
             </C>
-            <A color={e.grayTextWeak}size={13}/>
+            <U color={e.grayTextWeak}size={13}/>
           </C>
         </C>
 
         
         <C style={o.messageBox}>
-          <D text={r.title||"(No Title)"}searchWords={R?[R]:[]}numberOfLines={1}style={o.messageTitle}highlightStyle={o.highlight}/>
-          <D text={r.body||"(No message body)"}searchWords={R?[R]:[]}numberOfLines={2}style={o.messageBody}highlightStyle={o.highlight}/>
+          <$ text={r.title||"(No Title)"}searchWords={B?[B]:[]}numberOfLines={1}style={o.messageTitle}highlightStyle={o.highlight}/>
+          <$ text={r.body||"(No message body)"}searchWords={B?[B]:[]}numberOfLines={2}style={o.messageBody}highlightStyle={o.highlight}/>
         </C>
 
         
         <C style={o.cardFooterRow}>
           <C style={o.footerLeft}>
             <C style={o.cardDateRow}>
-              <E color={e.slate400}size={10}/>
+              <A color={e.slate400}size={10}/>
               <T style={o.cardDateText}numberOfLines={1}>
-                {W(r.timestamp)}
+                {E(r.timestamp)}
               </T>
             </C>
 
@@ -77,13 +78,13 @@ import O,{useMemo as $}from"react";import{StyleSheet as F,Text as T,View as C}fr
           </C>
 
           <C style={o.footerRight}>
-            {I>0&&<C style={o.metaStatChip}>
-                <U color={e.purple}size={8.5}/>
+            {H>0&&<C style={o.metaStatChip}>
+                <X color={e.purple}size={8.5}/>
                 <T style={o.metaStatText}>
-                  {I} {I===1?"key":"keys"}
+                  {H} {H===1?"key":"keys"}
                 </T>
               </C>}
           </C>
         </C>
       </C>
-    </X>}),o=F.create({card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString,marginBottom:6},cardBody:{height:"100%",paddingHorizontal:12,paddingTop:10,paddingBottom:8,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:8,gap:6,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:k.interBold,color:e.grayTextWeak,fontSize:10},methodBadge:{paddingHorizontal:7,paddingVertical:2.5,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:k.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:e.white},chip:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},chipText:{fontFamily:k.interBold,fontSize:9,lineHeight:12},statusPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:7,paddingVertical:2.5,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:k.interBold,fontSize:10,lineHeight:13},messageBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:10,paddingVertical:6,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageTitle:{fontFamily:k.interBold,fontSize:12,color:e.primaryBlack,lineHeight:16},messageBody:{fontFamily:k.interRegular,fontSize:11,color:e.grayText,lineHeight:15},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3.5},cardDateText:{fontFamily:k.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.skySoftBg,borderColor:e.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:e.skySoftText,fontSize:9,lineHeight:12,fontFamily:k.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2B`,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{color:e.purple,fontSize:9,lineHeight:12,fontFamily:k.interBold}});V.displayName="PushCard";export default V;
+    </J>}const o=F.create({card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString,marginBottom:6},cardBody:{height:"100%",paddingHorizontal:12,paddingTop:10,paddingBottom:8,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:8,gap:6,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:S.interBold,color:e.grayTextWeak,fontSize:10},methodBadge:{paddingHorizontal:7,paddingVertical:2.5,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:S.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:e.white},chip:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},chipText:{fontFamily:S.interBold,fontSize:9,lineHeight:12},statusPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:7,paddingVertical:2.5,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:S.interBold,fontSize:10,lineHeight:13},messageBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:10,paddingVertical:6,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageTitle:{fontFamily:S.interBold,fontSize:12,color:e.primaryBlack,lineHeight:16},messageBody:{fontFamily:S.interRegular,fontSize:11,color:e.grayText,lineHeight:15},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3.5},cardDateText:{fontFamily:S.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.skySoftBg,borderColor:e.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:e.skySoftText,fontSize:9,lineHeight:12,fontFamily:S.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2B`,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{color:e.purple,fontSize:9,lineHeight:12,fontFamily:S.interBold}});function ee(r,t){return r.item===t.item&&r.searchStr===t.searchStr&&r.onPress===t.onPress}export default O.memo(Z,ee);

package/dist/esm/components/Inspector/PushDetail.js

@@ -1,37 +1,37 @@
-import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as P,StyleSheet as E,Text as T,View as C}from"react-native";import B from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as V}from"../../styles/AppFonts";import{formatDateTime as _}from"../../helpers";import{sharePushReport as Y}from"../../helpers/shareFormatter";import G from"../ShareButton";import R from"../CopyButton";import F from"../JsonViewer";import Q from"../SegmentedTabs";import{BellIcon as X,ClockIcon as Z,CloudPushIcon as Te,EyeIcon as Ce,LayersIcon as Ve,MetadataIcon as Se,RawJsonIcon as Be}from"../NetworkIcons";const A=j.memo(function({item:o}){const[z,N]=J("preview"),D=M(()=>o?_(o.timestamp):"",[o]);if(!o)return null;const W=async()=>{await Y(o)},H=[{key:"preview",label:"Preview",themeColor:e.brandPurple,icon:S=><Ce size={12}color={S?e.white:e.grayText}/>},{key:"payload",label:"Custom Payload",themeColor:e.violet600,icon:S=><Ve size={12}color={S?e.white:e.grayText}/>},{key:"headers",label:"Delivery Metadata",themeColor:e.teal600,icon:S=><Se size={12}color={S?e.white:e.grayText}/>},{key:"raw",label:"Raw Payload",themeColor:e.sky600,icon:S=><Be size={12}color={S?e.white:e.grayText}/>}],O=(o.source||"PUSH").toUpperCase(),L=(o.appState||"STATE").toUpperCase(),$=!!(o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl),U=o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl||"";return<C style={{flex:1}}>
+import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as P,StyleSheet as E,Text as T,View as C}from"react-native";import I from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as V}from"../../styles/AppFonts";import{useTranslation as _}from"../../i18n";import{formatDateTime as Y}from"../../helpers";import{sharePushReport as q}from"../../helpers/shareFormatter";import G from"../ShareButton";import R from"../CopyButton";import F from"../JsonViewer";import Q from"../SegmentedTabs";import{BellIcon as X,ClockIcon as Z,CloudPushIcon as Te,EyeIcon as Ce,LayersIcon as Ve,MetadataIcon as Se,RawJsonIcon as Be,LinkChainIcon as Ie,VolumeIcon as De,BoltIcon as Pe,BuildingIcon as Re,SettingsIcon as Fe}from"../NetworkIcons";const A=U.memo(function({item:o}){const{t:B}=_(),[z,N]=J("preview"),v=j(()=>o?Y(o.timestamp):"",[o]);if(!o)return null;const W=async()=>{await q(o)},H=[{key:"preview",label:B("push.preview","Preview"),themeColor:e.brandPurple,icon:S=><Ce size={12}color={S?e.white:e.grayText}/>},{key:"payload",label:B("push.payload","Custom Payload"),themeColor:e.violet600,icon:S=><Ve size={12}color={S?e.white:e.grayText}/>},{key:"headers",label:B("push.deliveryMetadata","Delivery Metadata"),themeColor:e.teal600,icon:S=><Se size={12}color={S?e.white:e.grayText}/>},{key:"raw",label:B("push.rawPayload","Raw Payload"),themeColor:e.sky600,icon:S=><Be size={12}color={S?e.white:e.grayText}/>}],O=(o.source||"PUSH").toUpperCase(),L=(o.appState||"STATE").toUpperCase(),$=!!(o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl),M=o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl||"";return<C style={{flex:1}}>
       
       <C style={{paddingHorizontal:8,paddingTop:4}}>
-        <C style={B.detailInfoBar}>
+        <C style={I.detailInfoBar}>
           
           <C style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",flexWrap:"wrap",gap:6,paddingBottom:8,borderBottomWidth:1,borderBottomColor:e.dividerColor}}>
             <C style={{flexDirection:"row",alignItems:"center",gap:5,flexWrap:"wrap",flex:1}}>
               
-              <C style={[B.methodBadge,{backgroundColor:e.brandPurple,paddingHorizontal:8,paddingVertical:3.5,borderRadius:6,flexDirection:"row",alignItems:"center",gap:4}]}>
+              <C style={[I.methodBadge,{backgroundColor:e.brandPurple,paddingHorizontal:8,paddingVertical:3.5,borderRadius:6,flexDirection:"row",alignItems:"center",gap:4}]}>
                 <Te size={10}color={e.white}/>
-                <T style={[B.methodBadgeText,{color:e.white,fontSize:10.5,fontFamily:V.interBold}]}>
+                <T style={[I.methodBadgeText,{color:e.white,fontSize:10.5,fontFamily:V.interBold}]}>
                   {O}
                 </T>
               </C>
 
               
-              <C style={[B.chip,{backgroundColor:o.appState==="foreground"?`${e.greenColor}18`:`${e.amber600}18`,borderColor:o.appState==="foreground"?`${e.greenColor}40`:`${e.amber600}40`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
-                <T style={[B.chipText,{fontFamily:V.interBold,fontSize:9.5,color:o.appState==="foreground"?e.greenColor:e.amber700}]}>
+              <C style={[I.chip,{backgroundColor:o.appState==="foreground"?`${e.greenColor}18`:`${e.amber600}18`,borderColor:o.appState==="foreground"?`${e.greenColor}40`:`${e.amber600}40`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
+                <T style={[I.chipText,{fontFamily:V.interBold,fontSize:9.5,color:o.appState==="foreground"?e.greenColor:e.amber700}]}>
                   {L}
                 </T>
               </C>
 
               
-              {o.action&&<C style={[B.chip,{backgroundColor:`${e.purple}14`,borderColor:`${e.purple}30`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
-                  <T style={[B.chipText,{fontFamily:V.interBold,fontSize:9.5,color:e.purple}]}>
+              {o.action&&<C style={[I.chip,{backgroundColor:`${e.purple}14`,borderColor:`${e.purple}30`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
+                  <T style={[I.chipText,{fontFamily:V.interBold,fontSize:9.5,color:e.purple}]}>
                     {o.action.toUpperCase()}
                   </T>
                 </C>}
 
               
-              <C style={[B.chip,{backgroundColor:`${e.brandPurple}10`,borderColor:`${e.brandPurple}25`,paddingHorizontal:7,paddingVertical:3,borderRadius:6,gap:4}]}>
+              <C style={[I.chip,{backgroundColor:`${e.brandPurple}10`,borderColor:`${e.brandPurple}25`,paddingHorizontal:7,paddingVertical:3,borderRadius:6,gap:4}]}>
                 <Z color={e.brandPurple}size={10}/>
-                <T style={[B.chipText,{color:e.brandPurple,fontFamily:V.interBold,fontSize:10.5}]}>
-                  {D}
+                <T style={[I.chipText,{color:e.brandPurple,fontFamily:V.interBold,fontSize:10.5}]}>
+                  {v}
                 </T>
               </C>
             </C>
@@ -64,11 +64,12 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
                   {o.body}
                 </T>:null}
               {$?<C style={{flexDirection:"row",alignItems:"center",gap:4,marginTop:2}}>
+                  <Ie size={11}color={e.brandPurple}/>
                   <T style={{fontSize:10,fontFamily:V.interBold,color:e.brandPurple}}>
-                    🔗 LINK:
+                    {B("push.link","LINK")}:
                   </T>
                   <T style={{fontSize:10.5,fontFamily:V.interRegular,color:e.sky600}}numberOfLines={1}>
-                    {U}
+                    {M}
                   </T>
                 </C>:null}
             </C>
@@ -91,9 +92,9 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
                   <X size={12}color={e.white}/>
                 </C>
                 <T style={t.mockupAppName}>
-                  {o.domain||"App Notification"}
+                  {o.domain||B("push.appNotification","App Notification")}
                 </T>
-                <T style={t.mockupTime}>• now</T>
+                <T style={t.mockupTime}>• {B("push.now","now")}</T>
               </C>
 
               
@@ -117,25 +118,30 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
                 {o.channelId?<C style={t.tagPill}>
                     <T style={t.tagPillText}>Channel: {o.channelId}</T>
                   </C>:null}
-                {o.sound?<C style={t.tagPill}>
-                    <T style={t.tagPillText}>🔊 {o.sound}</T>
+                {o.sound?<C style={[t.tagPill,{flexDirection:"row",alignItems:"center",gap:4}]}>
+                    <De size={11}color={e.violet600}/>
+                    <T style={t.tagPillText}>{o.sound}</T>
                   </C>:null}
                 {o.badge!=null?<C style={t.tagPill}>
                     <T style={t.tagPillText}>Badge: {o.badge}</T>
                   </C>:null}
-                {o.priority?<C style={t.tagPill}>
-                    <T style={t.tagPillText}>⚡ {o.priority}</T>
+                {o.priority?<C style={[t.tagPill,{flexDirection:"row",alignItems:"center",gap:4}]}>
+                    <Pe size={11}color={e.amber600}/>
+                    <T style={t.tagPillText}>{o.priority}</T>
                   </C>:null}
               </C>
             </C>
 
             
             {o.customDomainAttributes&&Object.keys(o.customDomainAttributes).length>0&&<C style={t.sectionCard}>
-                <T style={t.sectionTitle}>🏢 Domain Specific Fields</T>
-                {Object.entries(o.customDomainAttributes).map(([S,I])=><C key={S}style={t.keyValRow}>
+                <C style={{flexDirection:"row",alignItems:"center",gap:6,marginBottom:8}}>
+                  <Re size={13}color={e.blue600}/>
+                  <T style={t.sectionTitle}>{B("push.domainFields","Domain Specific Fields")}</T>
+                </C>
+                {Object.entries(o.customDomainAttributes).map(([S,D])=><C key={S}style={t.keyValRow}>
                     <T style={t.keyText}>{S}:</T>
                     <T style={t.valText}numberOfLines={2}>
-                      {typeof I=="object"?JSON.stringify(I):String(I)}
+                      {typeof D=="object"?JSON.stringify(D):String(D)}
                     </T>
                   </C>)}
               </C>}
@@ -145,7 +151,10 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
 
         {z==="headers"&&<P contentContainerStyle={t.scrollContent}>
             <C style={t.sectionCard}>
-              <T style={t.sectionTitle}>⚙️ Delivery & Message Metadata</T>
+              <C style={{flexDirection:"row",alignItems:"center",gap:6,marginBottom:8}}>
+                <Fe size={13}color={e.slate600}/>
+                <T style={t.sectionTitle}>{B("push.deliveryMetadata","Delivery & Message Metadata")}</T>
+              </C>
               <C style={t.keyValRow}>
                 <T style={t.keyText}>Message ID:</T>
                 <T style={t.valText}selectable>{o.id||"N/A"}</T>
@@ -164,7 +173,7 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
               </C>
               <C style={t.keyValRow}>
                 <T style={t.keyText}>Timestamp:</T>
-                <T style={t.valText}>{D}</T>
+                <T style={t.valText}>{v}</T>
               </C>
               <C style={t.keyValRow}>
                 <T style={t.keyText}>Channel ID:</T>
@@ -187,4 +196,4 @@ import j,{useMemo as M,useState as J}from"react";import{Image as K,ScrollView as
 
         {z==="raw"&&<F data={o.rawPayload||o}fullHeight={!0}/>}
       </C>
-    </C>}),t=E.create({container:{flex:1,backgroundColor:e.white},headerBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:10,borderBottomWidth:1,borderBottomColor:e.dividerColor,backgroundColor:e.white},headerLeft:{flexDirection:"row",alignItems:"center",gap:8,flex:1},backBtn:{width:32,height:32,borderRadius:8,backgroundColor:e.grayBackground,alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:e.dividerColor},titleWrap:{flex:1,gap:2},badgeRow:{flexDirection:"row",alignItems:"center",gap:5},sourceBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.brandPurple}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${e.brandPurple}30`},sourceBadgeText:{fontSize:9,fontFamily:V.interBold,color:e.brandPurple},stateBadge:{backgroundColor:`${e.greenColor}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${e.greenColor}30`},stateBadgeText:{fontSize:9,fontFamily:V.interBold,color:e.greenColor},headerTitle:{fontSize:13,fontFamily:V.interSemiBold,color:e.primaryBlack},headerActions:{flexDirection:"row",alignItems:"center",gap:6},tabsContainer:{paddingHorizontal:10,paddingVertical:6,backgroundColor:e.grayBackground,borderBottomWidth:1,borderBottomColor:e.dividerColor},bodyContainer:{flex:1},scrollContent:{padding:12,gap:12},mockupCard:{backgroundColor:e.white,borderRadius:14,borderWidth:1,borderColor:e.dividerColor,padding:14,gap:8,shadowColor:"#000",shadowOpacity:.05,shadowOffset:{width:0,height:2},shadowRadius:6,elevation:2},mockupHeader:{flexDirection:"row",alignItems:"center",gap:6},mockupAppIcon:{width:20,height:20,borderRadius:5,backgroundColor:e.brandPurple,alignItems:"center",justifyContent:"center"},mockupAppName:{fontSize:11,fontFamily:V.interSemiBold,color:e.primaryBlack,textTransform:"uppercase"},mockupTime:{fontSize:10,fontFamily:V.interRegular,color:e.grayTextWeak},mockupImage:{width:"100%",height:140,borderRadius:8,marginVertical:4},mockupTitle:{fontSize:14,fontFamily:V.interBold,color:e.primaryBlack},mockupSubtitle:{fontSize:12,fontFamily:V.interMedium,color:e.grayText},mockupBody:{fontSize:12.5,fontFamily:V.interRegular,color:e.grayText,lineHeight:18},mockupFooterTags:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:6,marginTop:6,paddingTop:8,borderTopWidth:1,borderTopColor:e.dividerColor},tagPill:{backgroundColor:e.grayBackground,paddingHorizontal:6,paddingVertical:3,borderRadius:4,borderWidth:1,borderColor:e.dividerColor},tagPillText:{fontSize:10,fontFamily:V.interMedium,color:e.grayText},sectionCard:{backgroundColor:e.white,borderRadius:12,borderWidth:1,borderColor:e.dividerColor,padding:12,gap:8},sectionTitle:{fontSize:12,fontFamily:V.interBold,color:e.primaryBlack,marginBottom:4},keyValRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:3,borderBottomWidth:.5,borderBottomColor:`${e.dividerColor}40`,gap:8},keyText:{fontSize:11,fontFamily:V.interMedium,color:e.grayTextWeak},valText:{fontSize:11,fontFamily:V.interSemiBold,color:e.primaryBlack,textAlign:"right",flexShrink:1}});A.displayName="PushDetail";export default A;
+    </C>}),t=E.create({container:{flex:1,backgroundColor:e.white},headerBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:10,borderBottomWidth:1,borderBottomColor:e.dividerColor,backgroundColor:e.white},headerLeft:{flexDirection:"row",alignItems:"center",gap:8,flex:1},backBtn:{width:32,height:32,borderRadius:8,backgroundColor:e.grayBackground,alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:e.dividerColor},titleWrap:{flex:1,gap:2},badgeRow:{flexDirection:"row",alignItems:"center",gap:5},sourceBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.brandPurple}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${e.brandPurple}30`},sourceBadgeText:{fontSize:9,fontFamily:V.interBold,color:e.brandPurple},stateBadge:{backgroundColor:`${e.greenColor}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${e.greenColor}30`},stateBadgeText:{fontSize:9,fontFamily:V.interBold,color:e.greenColor},headerTitle:{fontSize:13,fontFamily:V.interSemiBold,color:e.primaryBlack},headerActions:{flexDirection:"row",alignItems:"center",gap:6},tabsContainer:{paddingHorizontal:10,paddingVertical:6,backgroundColor:e.grayBackground,borderBottomWidth:1,borderBottomColor:e.dividerColor},bodyContainer:{flex:1},scrollContent:{padding:12,gap:12},mockupCard:{backgroundColor:e.white,borderRadius:14,borderWidth:1,borderColor:e.dividerColor,padding:14,gap:8,shadowColor:e.black,shadowOpacity:.05,shadowOffset:{width:0,height:2},shadowRadius:6,elevation:2},mockupHeader:{flexDirection:"row",alignItems:"center",gap:6},mockupAppIcon:{width:20,height:20,borderRadius:5,backgroundColor:e.brandPurple,alignItems:"center",justifyContent:"center"},mockupAppName:{fontSize:11,fontFamily:V.interSemiBold,color:e.primaryBlack,textTransform:"uppercase"},mockupTime:{fontSize:10,fontFamily:V.interRegular,color:e.grayTextWeak},mockupImage:{width:"100%",height:140,borderRadius:8,marginVertical:4},mockupTitle:{fontSize:14,fontFamily:V.interBold,color:e.primaryBlack},mockupSubtitle:{fontSize:12,fontFamily:V.interMedium,color:e.grayText},mockupBody:{fontSize:12.5,fontFamily:V.interRegular,color:e.grayText,lineHeight:18},mockupFooterTags:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:6,marginTop:6,paddingTop:8,borderTopWidth:1,borderTopColor:e.dividerColor},tagPill:{backgroundColor:e.grayBackground,paddingHorizontal:6,paddingVertical:3,borderRadius:4,borderWidth:1,borderColor:e.dividerColor},tagPillText:{fontSize:10,fontFamily:V.interMedium,color:e.grayText},sectionCard:{backgroundColor:e.white,borderRadius:12,borderWidth:1,borderColor:e.dividerColor,padding:12,gap:8},sectionTitle:{fontSize:12,fontFamily:V.interBold,color:e.primaryBlack,marginBottom:4},keyValRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:3,borderBottomWidth:.5,borderBottomColor:`${e.dividerColor}40`,gap:8},keyText:{fontSize:11,fontFamily:V.interMedium,color:e.grayTextWeak},valText:{fontSize:11,fontFamily:V.interSemiBold,color:e.primaryBlack,textAlign:"right",flexShrink:1}});A.displayName="PushDetail";export default A;

package/dist/esm/components/Inspector/PushTab.js

@@ -1,45 +1,45 @@
-import j,{useCallback as V,useMemo as E,useRef as le,useState as q}from"react";import{FlatList as Ce,Platform as K,Pressable as Se,ScrollView as Pe,StyleSheet as Te,Text as Ie,TextInput as Be,View as C}from"react-native";import{useInspector as Re}from"./InspectorContext";import Le from"./PushCard";import F from"../TouchableScale";import Ve from"../AnimatedEntrance";import Ee from"../EmptyState";import Fe from"../EndOfListFooter";import S from"../../styles";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as U}from"../../styles/AppFonts";import{ClearIcon as Ae,SearchIcon as Me,TrashIcon as Oe,BellIcon as We,SunIcon as $e,MoonIcon as He,ExternalLinkIcon as Ne,CloudPushIcon as _e,BoltIcon as De}from"../NetworkIcons";const G=10,J=j.memo(()=>{const{pushRecords:x,filteredPushRecords:P,pushSearch:r,setPushSearch:z,pushQuickFilter:T,setPushQuickFilter:A,setSelectedPush:M,clearAllPushLogs:X,simulatePush:O,maxPushLogs:B}=Re(),Y=B||50,W=le(null),[v,Z]=q(0),[$,H]=q(Y);j.useEffect(()=>{H(B||50),W.current?.scrollToOffset({offset:0,animated:!1})},[r,T,B]);const R=E(()=>P.slice(0,$),[P,$]),N=["salesforce","fcm","apns","deeplink","rich_media"],ee=V(()=>{const e=N[v%N.length];O(e),Z(o=>o+1)},[v,O]),_=E(()=>{let e=0,o=0,I=0;const k={};return x.forEach(L=>{const D=(L.appState||"").toLowerCase();D==="foreground"&&e++,D==="background"&&o++,L.action==="opened"&&I++;const Q=(L.source||"other").toLowerCase();k[Q]=(k[Q]||0)+1}),{all:x.length,foreground:e,background:o,opened:I,sources:k}},[x]),oe=E(()=>{const e=[{id:"all",label:"All",color:t.purple,icon:o=><We size={12}color={o}/>},{id:"foreground",label:"Foreground",color:t.greenColor,icon:o=><$e size={12}color={o}/>},{id:"background",label:"Background",color:t.darkOrange,icon:o=><He size={12}color={o}/>},{id:"opened",label:"Opened",color:t.brandPurple,icon:o=><Ne size={12}color={o}/>}];return Object.entries(_.sources).forEach(([o,I])=>{I>0&&o!=="all"&&e.push({id:`source:${o}`,label:o.toUpperCase(),color:o==="salesforce"?t.sky600:t.brandPurple,icon:k=><_e size={12}color={k}/>})}),e},[_]),te=V(({item:e,index:o})=><Ve index={o}distance={8}>
-        <Le item={e}searchStr={r}onPress={()=>M(e)}/>
-      </Ve>,[r,M]),re=V(e=>e.id||`push_${e.timestamp}`,[]);return<C style={{flex:1}}>
+import K,{useCallback as B,useMemo as F,useRef as ne,useState as U}from"react";import{FlatList as Ce,Platform as Se,Pressable as Pe,ScrollView as Te,StyleSheet as we,Text as Ie,TextInput as Be,View as C}from"react-native";import{useInspector as Re}from"./InspectorContext";import Le from"./PushCard";import A from"../TouchableScale";import Ve from"../AnimatedEntrance";import Ee from"../EmptyState";import Fe from"../EndOfListFooter";import S from"../../styles";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as G}from"../../styles/AppFonts";import{useTranslation as Ae}from"../../i18n";import{ClearIcon as Me,SearchIcon as Oe,TrashIcon as Ne,BellIcon as We,SunIcon as He,MoonIcon as $e,ExternalLinkIcon as De,CloudPushIcon as _e,BoltIcon as Qe}from"../NetworkIcons";const J=10,X=K.memo(()=>{const{t:x}=Ae(),{pushRecords:I,filteredPushRecords:P,pushSearch:r,setPushSearch:R,pushQuickFilter:T,setPushQuickFilter:M,setSelectedPush:O,clearAllPushLogs:Y,simulatePush:N,maxPushLogs:L}=Re(),Z=L||50,W=ne(null),[v,ee]=U(0),[H,$]=U(Z);K.useEffect(()=>{$(L||50),W.current?.scrollToOffset({offset:0,animated:!1})},[r,T,L]);const V=F(()=>P.slice(0,H),[P,H]),D=["salesforce","fcm","apns","deeplink","rich_media"],oe=B(()=>{const e=D[v%D.length];N(e),ee(o=>o+1)},[v,N]),_=F(()=>{let e=0,o=0,z=0;const w={};return I.forEach(E=>{const Q=(E.appState||"").toLowerCase();Q==="foreground"&&e++,Q==="background"&&o++,E.action==="opened"&&z++;const q=(E.source||"other").toLowerCase();w[q]=(w[q]||0)+1}),{all:I.length,foreground:e,background:o,opened:z,sources:w}},[I]),te=F(()=>{const e=[{id:"all",label:"All",color:t.purple,icon:o=><We size={12}color={o}/>},{id:"foreground",label:"Foreground",color:t.greenColor,icon:o=><He size={12}color={o}/>},{id:"background",label:"Background",color:t.darkOrange,icon:o=><$e size={12}color={o}/>},{id:"opened",label:"Opened",color:t.brandPurple,icon:o=><De size={12}color={o}/>}];return Object.entries(_.sources).forEach(([o,z])=>{z>0&&o!=="all"&&e.push({id:`source:${o}`,label:o.toUpperCase(),color:o==="salesforce"?t.sky600:t.brandPurple,icon:w=><_e size={12}color={w}/>})}),e},[_]),j=B(e=>{O(e)},[O]),re=B(({item:e,index:o})=><Ve index={o}distance={8}>
+        <Le item={e}searchStr={r}onPress={()=>j(e)}/>
+      </Ve>,[r,j]),le=B(e=>e.id||`push_${e.timestamp}`,[]);return<C style={{flex:1}}>
       
       <C style={{marginTop:6}}>
         <C style={S.toolbarRow}>
           <C style={[S.searchContainer,{flex:1,marginRight:8,height:38}]}>
             <C style={S.searchIcon}>
-              <Me color={t.grayTextWeak}size={15}/>
+              <Oe color={t.grayTextWeak}size={15}/>
             </C>
-            <Be style={[S.searchInput,{paddingVertical:0}]}placeholder="Search notifications..."placeholderTextColor={t.grayTextWeak}value={r}onChangeText={z}autoCapitalize="none"autoCorrect={!1}returnKeyType="search"clearButtonMode="while-editing"/>
-            {r.length>0&&K.OS==="android"&&<C style={{position:"absolute",right:8,top:0,bottom:0,justifyContent:"center"}}>
-                <Se onPress={()=>z("")}hitSlop={10}style={S.clearBtn}>
-                  <Ae color={t.grayTextWeak}size={13}/>
-                </Se>
+            <Be style={[S.searchInput,{paddingVertical:0}]}placeholder="Search notifications..."placeholderTextColor={t.grayTextWeak}value={r}onChangeText={R}autoCapitalize="none"autoCorrect={!1}returnKeyType="search"clearButtonMode="while-editing"/>
+            {r.length>0&&Se.OS==="android"&&<C style={{position:"absolute",right:8,top:0,bottom:0,justifyContent:"center"}}>
+                <Pe onPress={()=>R("")}hitSlop={10}style={S.clearBtn}>
+                  <Me color={t.grayTextWeak}size={13}/>
+                </Pe>
               </C>}
           </C>
 
           <C style={S.toolbarRight}>
-            <F style={[S.toolbarBtn,{backgroundColor:`${t.brandPurple}14`,borderColor:`${t.brandPurple}30`}]}onPress={ee}hitSlop={6}accessibilityRole="button"accessibilityLabel="Simulate incoming push notification">
-              <De color={t.brandPurple}size={15}/>
-            </F>
+            <A style={[S.toolbarBtn,{backgroundColor:`${t.brandPurple}14`,borderColor:`${t.brandPurple}30`}]}onPress={oe}hitSlop={6}accessibilityRole="button"accessibilityLabel="Simulate incoming push notification">
+              <Qe color={t.brandPurple}size={15}/>
+            </A>
 
-            {x.length>0&&<F style={[S.toolbarBtn,{borderColor:`${t.errorColor}38`,backgroundColor:`${t.errorColor}0F`}]}onPress={X}hitSlop={6}accessibilityRole="button"accessibilityLabel="Clear all push notification history">
-                <Oe color={t.errorColor}size={15}/>
-              </F>}
+            {I.length>0&&<A style={[S.toolbarBtn,{borderColor:`${t.errorColor}38`,backgroundColor:`${t.errorColor}0F`}]}onPress={Y}hitSlop={6}accessibilityRole="button"accessibilityLabel="Clear all push notification history">
+                <Ne color={t.errorColor}size={15}/>
+              </A>}
           </C>
         </C>
       </C>
 
       
-      <C style={w.carouselWrapper}>
-        <Pe horizontal showsHorizontalScrollIndicator={!1}contentContainerStyle={w.carouselContent}>
-          {oe.map(e=>{const o=T===e.id;return<F key={e.id}onPress={()=>A(e.id)}style={[w.filterPill,o&&{backgroundColor:e.color,borderColor:e.color}]}>
+      <C style={k.carouselWrapper}>
+        <Te horizontal showsHorizontalScrollIndicator={!1}contentContainerStyle={k.carouselContent}>
+          {te.map(e=>{const o=T===e.id;return<A key={e.id}onPress={()=>M(e.id)}style={[k.filterPill,o&&{backgroundColor:e.color,borderColor:e.color}]}>
                 {e.icon?e.icon(o?t.white:e.color):null}
-                <Ie style={[w.filterPillText,o&&{color:t.white}]}>
+                <Ie style={[k.filterPillText,o&&{color:t.white}]}>
                   {e.label}
                 </Ie>
-              </F>})}
-        </Pe>
+              </A>})}
+        </Te>
       </C>
 
       
-      <Ce ref={W}data={R}renderItem={te}keyExtractor={re}contentContainerStyle={w.listContent}initialNumToRender={15}maxToRenderPerBatch={20}windowSize={11}removeClippedSubviews={K.OS==="android"}ListEmptyComponent={<Ee isSearch={!!(r||T!=="all")}searchQuery={r}customTitle={r||T!=="all"?"No matching push notifications":"No push notifications captured yet"}customSub={r||T!=="all"?"Try adjusting your search query or filter chips.":"Incoming or opened push payloads from any domain (Salesforce, FCM, APNs, etc.) will appear here automatically."}onClearSearch={()=>{z(""),A("all")}}showReload={!1}/>}ListFooterComponent={P.length>0?<Fe count={R.length}totalCount={P.length}label="push notifications"loadMoreStep={G}hasMore={R.length<P.length}onLoadMore={()=>H(e=>e+G)}/>:null}/>
-    </C>}),w=Te.create({carouselWrapper:{paddingVertical:6,borderBottomWidth:1,borderBottomColor:t.dividerColor,backgroundColor:t.white},carouselContent:{paddingHorizontal:8,gap:6,flexDirection:"row",alignItems:"center"},filterPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:9,paddingVertical:4.5,borderRadius:20,backgroundColor:t.grayBackground,borderWidth:1,borderColor:t.dividerColor},filterPillText:{fontSize:11,fontFamily:U.interMedium,color:t.primaryBlack},countBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:10},countBadgeText:{fontSize:9.5,fontFamily:U.interBold},listContent:{padding:8,paddingBottom:24}});J.displayName="PushTab";export default J;
+      <Ce ref={W}data={V}renderItem={re}keyExtractor={le}contentContainerStyle={k.listContent}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}ListEmptyComponent={<Ee isSearch={!!(r||T!=="all")}searchQuery={r}customTitle={r||T!=="all"?x("push.noMatching","No matching push notifications"):x("push.noNotifications","No push notifications captured yet")}customSub={r||T!=="all"?x("push.adjustSearchFilter","Try adjusting your search query or filter chips."):x("push.noNotificationsDesc","Incoming or opened push payloads from any domain (Salesforce, FCM, APNs, etc.) will appear here automatically.")}onClearSearch={()=>{R(""),M("all")}}showReload={!1}/>}ListFooterComponent={P.length>0?<Fe count={V.length}totalCount={P.length}label="push notifications"loadMoreStep={J}hasMore={V.length<P.length}onLoadMore={()=>$(e=>e+J)}/>:null}/>
+    </C>}),k=we.create({carouselWrapper:{paddingVertical:6,borderBottomWidth:1,borderBottomColor:t.dividerColor,backgroundColor:t.white},carouselContent:{paddingHorizontal:8,gap:6,flexDirection:"row",alignItems:"center"},filterPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:9,paddingVertical:4.5,borderRadius:20,backgroundColor:t.grayBackground,borderWidth:1,borderColor:t.dividerColor},filterPillText:{fontSize:11,fontFamily:G.interMedium,color:t.primaryBlack},countBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:10},countBadgeText:{fontSize:9.5,fontFamily:G.interBold},listContent:{padding:8,paddingBottom:24}});X.displayName="PushTab";export default X;