react-native-inapp-inspector 2.3.24 → 2.4.0

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

@@ -0,0 +1,190 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(o,e,t,r){r===void 0&&(r=t);var a=Object.getOwnPropertyDescriptor(e,t);(!a||("get"in a?!e.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return e[t]}}),Object.defineProperty(o,r,a)}):(function(o,e,t,r){r===void 0&&(r=t),o[r]=e[t]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(o,e){Object.defineProperty(o,"default",{enumerable:!0,value:e})}):function(o,e){o.default=e}),__importStar=this&&this.__importStar||(function(){var o=function(e){return o=Object.getOwnPropertyNames||function(t){var r=[];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(r[r.length]=a);return r},o(e)};return function(e){if(e&&e.__esModule)return e;var t={};if(e!=null)for(var r=o(e),a=0;a<r.length;a++)r[a]!=="default"&&__createBinding(t,e,r[a]);return __setModuleDefault(t,e),t}})(),__importDefault=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),helpers_1=require("../../helpers"),shareFormatter_1=require("../../helpers/shareFormatter"),ShareButton_1=__importDefault(require("../ShareButton")),CopyButton_1=__importDefault(require("../CopyButton")),JsonViewer_1=__importDefault(require("../JsonViewer")),SegmentedTabs_1=__importDefault(require("../SegmentedTabs")),NetworkIcons_1=require("../NetworkIcons"),PushDetail=react_1.default.memo(function({item:e}){const[t,r]=(0,react_1.useState)("preview"),a=(0,react_1.useMemo)(()=>e?(0,helpers_1.formatDateTime)(e.timestamp):"",[e]);if(!e)return null;const n=async()=>{await(0,shareFormatter_1.sharePushReport)(e)},p=[{key:"preview",label:"Preview",themeColor:AppColors_1.AppColors.brandPurple,icon:l=><NetworkIcons_1.EyeIcon size={12}color={l?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},{key:"payload",label:"Custom Payload",themeColor:AppColors_1.AppColors.violet600,icon:l=><NetworkIcons_1.LayersIcon size={12}color={l?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},{key:"headers",label:"Delivery Metadata",themeColor:AppColors_1.AppColors.teal600,icon:l=><NetworkIcons_1.MetadataIcon size={12}color={l?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>},{key:"raw",label:"Raw Payload",themeColor:AppColors_1.AppColors.sky600,icon:l=><NetworkIcons_1.RawJsonIcon size={12}color={l?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}/>}],s=(e.source||"PUSH").toUpperCase(),c=(e.appState||"STATE").toUpperCase(),d=!!(e.data?.deepLink||e.data?.openDirectUrl||e.data?._od||e.customDomainAttributes?.openDirectUrl),u=e.data?.deepLink||e.data?.openDirectUrl||e.data?._od||e.customDomainAttributes?.openDirectUrl||"";return<react_native_1.View style={{flex:1}}>
+      
+      <react_native_1.View style={{paddingHorizontal:8,paddingTop:4}}>
+        <react_native_1.View style={styles_1.default.detailInfoBar}>
+          
+          <react_native_1.View style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",flexWrap:"wrap",gap:6,paddingBottom:8,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor}}>
+            <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:5,flexWrap:"wrap",flex:1}}>
+              
+              <react_native_1.View style={[styles_1.default.methodBadge,{backgroundColor:AppColors_1.AppColors.brandPurple,paddingHorizontal:8,paddingVertical:3.5,borderRadius:6,flexDirection:"row",alignItems:"center",gap:4}]}>
+                <NetworkIcons_1.CloudPushIcon size={10}color={AppColors_1.AppColors.white}/>
+                <react_native_1.Text style={[styles_1.default.methodBadgeText,{color:AppColors_1.AppColors.white,fontSize:10.5,fontFamily:AppFonts_1.AppFonts.interBold}]}>
+                  {s}
+                </react_native_1.Text>
+              </react_native_1.View>
+
+              
+              <react_native_1.View style={[styles_1.default.chip,{backgroundColor:e.appState==="foreground"?`${AppColors_1.AppColors.greenColor}18`:`${AppColors_1.AppColors.amber600}18`,borderColor:e.appState==="foreground"?`${AppColors_1.AppColors.greenColor}40`:`${AppColors_1.AppColors.amber600}40`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
+                <react_native_1.Text style={[styles_1.default.chipText,{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:e.appState==="foreground"?AppColors_1.AppColors.greenColor:AppColors_1.AppColors.amber700}]}>
+                  {c}
+                </react_native_1.Text>
+              </react_native_1.View>
+
+              
+              {e.action&&<react_native_1.View style={[styles_1.default.chip,{backgroundColor:`${AppColors_1.AppColors.purple}14`,borderColor:`${AppColors_1.AppColors.purple}30`,paddingHorizontal:6,paddingVertical:3,borderRadius:6}]}>
+                  <react_native_1.Text style={[styles_1.default.chipText,{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:AppColors_1.AppColors.purple}]}>
+                    {e.action.toUpperCase()}
+                  </react_native_1.Text>
+                </react_native_1.View>}
+
+              
+              <react_native_1.View style={[styles_1.default.chip,{backgroundColor:`${AppColors_1.AppColors.brandPurple}10`,borderColor:`${AppColors_1.AppColors.brandPurple}25`,paddingHorizontal:7,paddingVertical:3,borderRadius:6,gap:4}]}>
+                <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.brandPurple}size={10}/>
+                <react_native_1.Text style={[styles_1.default.chipText,{color:AppColors_1.AppColors.brandPurple,fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5}]}>
+                  {a}
+                </react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
+          </react_native_1.View>
+
+          
+          <react_native_1.View style={{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:10,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,padding:10,marginTop:8,gap:8}}>
+            
+            <react_native_1.View style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",flexWrap:"nowrap",gap:6}}>
+              <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6,flexShrink:1,minWidth:0}}>
+                <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.grayTextWeak,letterSpacing:.4,textTransform:"uppercase"}}numberOfLines={1}>
+                  {e.domain?e.domain.toUpperCase():"NOTIFICATION PAYLOAD"}
+                </react_native_1.Text>
+              </react_native_1.View>
+
+              
+              <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0}}>
+                <ShareButton_1.default onShare={n}/>
+                <CopyButton_1.default value={typeof e.rawPayload=="object"?JSON.stringify(e.rawPayload,null,2):JSON.stringify(e.data,null,2)}label="JSON"iconType="copy"/>
+                <CopyButton_1.default value={e.id||""}label="ID"iconType="copy"/>
+              </react_native_1.View>
+            </react_native_1.View>
+
+            
+            <react_native_1.View style={{gap:2}}>
+              <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12.5,color:AppColors_1.AppColors.primaryBlack,lineHeight:18}}numberOfLines={2}selectable>
+                {e.title||"(No Title)"}
+              </react_native_1.Text>
+              {e.body?<react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:11.5,color:AppColors_1.AppColors.grayText,lineHeight:16}}numberOfLines={2}selectable>
+                  {e.body}
+                </react_native_1.Text>:null}
+              {d?<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4,marginTop:2}}>
+                  <react_native_1.Text style={{fontSize:10,fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.brandPurple}}>
+                    🔗 LINK:
+                  </react_native_1.Text>
+                  <react_native_1.Text style={{fontSize:10.5,fontFamily:AppFonts_1.AppFonts.interRegular,color:AppColors_1.AppColors.sky600}}numberOfLines={1}>
+                    {u}
+                  </react_native_1.Text>
+                </react_native_1.View>:null}
+            </react_native_1.View>
+          </react_native_1.View>
+        </react_native_1.View>
+      </react_native_1.View>
+
+      
+      <react_native_1.View style={{paddingHorizontal:8,paddingVertical:6}}>
+        <SegmentedTabs_1.default tabs={p}activeKey={t}onChange={l=>r(l)}scrollable={!0}/>
+      </react_native_1.View>
+
+      
+      <react_native_1.View style={{flex:1,paddingHorizontal:8,paddingBottom:10}}>
+        {t==="preview"&&<react_native_1.ScrollView contentContainerStyle={detailStyles.scrollContent}>
+            
+            <react_native_1.View style={detailStyles.mockupCard}>
+              <react_native_1.View style={detailStyles.mockupHeader}>
+                <react_native_1.View style={detailStyles.mockupAppIcon}>
+                  <NetworkIcons_1.BellIcon size={12}color={AppColors_1.AppColors.white}/>
+                </react_native_1.View>
+                <react_native_1.Text style={detailStyles.mockupAppName}>
+                  {e.domain||"App Notification"}
+                </react_native_1.Text>
+                <react_native_1.Text style={detailStyles.mockupTime}>• now</react_native_1.Text>
+              </react_native_1.View>
+
+              
+              {e.imageUrl?<react_native_1.Image source={{uri:e.imageUrl}}style={detailStyles.mockupImage}resizeMode="cover"/>:null}
+
+              
+              <react_native_1.View style={{gap:2}}>
+                <react_native_1.Text style={detailStyles.mockupTitle}numberOfLines={2}>
+                  {e.title||"(No Title)"}
+                </react_native_1.Text>
+                {e.subtitle?<react_native_1.Text style={detailStyles.mockupSubtitle}numberOfLines={1}>
+                    {e.subtitle}
+                  </react_native_1.Text>:null}
+                <react_native_1.Text style={detailStyles.mockupBody}>
+                  {e.body||"(No message body provided in notification payload)"}
+                </react_native_1.Text>
+              </react_native_1.View>
+
+              
+              <react_native_1.View style={detailStyles.mockupFooterTags}>
+                {e.channelId?<react_native_1.View style={detailStyles.tagPill}>
+                    <react_native_1.Text style={detailStyles.tagPillText}>Channel: {e.channelId}</react_native_1.Text>
+                  </react_native_1.View>:null}
+                {e.sound?<react_native_1.View style={detailStyles.tagPill}>
+                    <react_native_1.Text style={detailStyles.tagPillText}>🔊 {e.sound}</react_native_1.Text>
+                  </react_native_1.View>:null}
+                {e.badge!=null?<react_native_1.View style={detailStyles.tagPill}>
+                    <react_native_1.Text style={detailStyles.tagPillText}>Badge: {e.badge}</react_native_1.Text>
+                  </react_native_1.View>:null}
+                {e.priority?<react_native_1.View style={detailStyles.tagPill}>
+                    <react_native_1.Text style={detailStyles.tagPillText}>⚡ {e.priority}</react_native_1.Text>
+                  </react_native_1.View>:null}
+              </react_native_1.View>
+            </react_native_1.View>
+
+            
+            {e.customDomainAttributes&&Object.keys(e.customDomainAttributes).length>0&&<react_native_1.View style={detailStyles.sectionCard}>
+                <react_native_1.Text style={detailStyles.sectionTitle}>🏢 Domain Specific Fields</react_native_1.Text>
+                {Object.entries(e.customDomainAttributes).map(([l,i])=><react_native_1.View key={l}style={detailStyles.keyValRow}>
+                    <react_native_1.Text style={detailStyles.keyText}>{l}:</react_native_1.Text>
+                    <react_native_1.Text style={detailStyles.valText}numberOfLines={2}>
+                      {typeof i=="object"?JSON.stringify(i):String(i)}
+                    </react_native_1.Text>
+                  </react_native_1.View>)}
+              </react_native_1.View>}
+          </react_native_1.ScrollView>}
+
+        {t==="payload"&&<JsonViewer_1.default data={e.data&&Object.keys(e.data).length>0?e.data:{message:"No custom key-value data found in payload"}}fullHeight={!0}/>}
+
+        {t==="headers"&&<react_native_1.ScrollView contentContainerStyle={detailStyles.scrollContent}>
+            <react_native_1.View style={detailStyles.sectionCard}>
+              <react_native_1.Text style={detailStyles.sectionTitle}>⚙️ Delivery & Message Metadata</react_native_1.Text>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Message ID:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}selectable>{e.id||"N/A"}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Source / Domain:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.domain||e.source||"N/A"}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>App State:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.appState}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Action Type:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.action}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Timestamp:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{a}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Channel ID:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.channelId||"default"}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Sound:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.sound||"default"}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Badge Count:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.badge!=null?e.badge:"None"}</react_native_1.Text>
+              </react_native_1.View>
+              <react_native_1.View style={detailStyles.keyValRow}>
+                <react_native_1.Text style={detailStyles.keyText}>Collapse Key:</react_native_1.Text>
+                <react_native_1.Text style={detailStyles.valText}>{e.collapseKey||"None"}</react_native_1.Text>
+              </react_native_1.View>
+            </react_native_1.View>
+          </react_native_1.ScrollView>}
+
+        {t==="raw"&&<JsonViewer_1.default data={e.rawPayload||e}fullHeight={!0}/>}
+      </react_native_1.View>
+    </react_native_1.View>}),detailStyles=react_native_1.StyleSheet.create({container:{flex:1,backgroundColor:AppColors_1.AppColors.white},headerBar:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:10,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor,backgroundColor:AppColors_1.AppColors.white},headerLeft:{flexDirection:"row",alignItems:"center",gap:8,flex:1},backBtn:{width:32,height:32,borderRadius:8,backgroundColor:AppColors_1.AppColors.grayBackground,alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},titleWrap:{flex:1,gap:2},badgeRow:{flexDirection:"row",alignItems:"center",gap:5},sourceBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${AppColors_1.AppColors.brandPurple}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${AppColors_1.AppColors.brandPurple}30`},sourceBadgeText:{fontSize:9,fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.brandPurple},stateBadge:{backgroundColor:`${AppColors_1.AppColors.greenColor}14`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1,borderColor:`${AppColors_1.AppColors.greenColor}30`},stateBadgeText:{fontSize:9,fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.greenColor},headerTitle:{fontSize:13,fontFamily:AppFonts_1.AppFonts.interSemiBold,color:AppColors_1.AppColors.primaryBlack},headerActions:{flexDirection:"row",alignItems:"center",gap:6},tabsContainer:{paddingHorizontal:10,paddingVertical:6,backgroundColor:AppColors_1.AppColors.grayBackground,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor},bodyContainer:{flex:1},scrollContent:{padding:12,gap:12},mockupCard:{backgroundColor:AppColors_1.AppColors.white,borderRadius:14,borderWidth:1,borderColor:AppColors_1.AppColors.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:AppColors_1.AppColors.brandPurple,alignItems:"center",justifyContent:"center"},mockupAppName:{fontSize:11,fontFamily:AppFonts_1.AppFonts.interSemiBold,color:AppColors_1.AppColors.primaryBlack,textTransform:"uppercase"},mockupTime:{fontSize:10,fontFamily:AppFonts_1.AppFonts.interRegular,color:AppColors_1.AppColors.grayTextWeak},mockupImage:{width:"100%",height:140,borderRadius:8,marginVertical:4},mockupTitle:{fontSize:14,fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.primaryBlack},mockupSubtitle:{fontSize:12,fontFamily:AppFonts_1.AppFonts.interMedium,color:AppColors_1.AppColors.grayText},mockupBody:{fontSize:12.5,fontFamily:AppFonts_1.AppFonts.interRegular,color:AppColors_1.AppColors.grayText,lineHeight:18},mockupFooterTags:{flexDirection:"row",alignItems:"center",flexWrap:"wrap",gap:6,marginTop:6,paddingTop:8,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.dividerColor},tagPill:{backgroundColor:AppColors_1.AppColors.grayBackground,paddingHorizontal:6,paddingVertical:3,borderRadius:4,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},tagPillText:{fontSize:10,fontFamily:AppFonts_1.AppFonts.interMedium,color:AppColors_1.AppColors.grayText},sectionCard:{backgroundColor:AppColors_1.AppColors.white,borderRadius:12,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,padding:12,gap:8},sectionTitle:{fontSize:12,fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.primaryBlack,marginBottom:4},keyValRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:3,borderBottomWidth:.5,borderBottomColor:`${AppColors_1.AppColors.dividerColor}40`,gap:8},keyText:{fontSize:11,fontFamily:AppFonts_1.AppFonts.interMedium,color:AppColors_1.AppColors.grayTextWeak},valText:{fontSize:11,fontFamily:AppFonts_1.AppFonts.interSemiBold,color:AppColors_1.AppColors.primaryBlack,textAlign:"right",flexShrink:1}});PushDetail.displayName="PushDetail",exports.default=PushDetail;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const PushTab: React.MemoExoticComponent<() => React.JSX.Element>;
+export default PushTab;

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

@@ -0,0 +1,45 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(l,e,r,n){n===void 0&&(n=r);var a=Object.getOwnPropertyDescriptor(e,r);(!a||("get"in a?!e.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(l,n,a)}):(function(l,e,r,n){n===void 0&&(n=r),l[n]=e[r]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(l,e){Object.defineProperty(l,"default",{enumerable:!0,value:e})}):function(l,e){l.default=e}),__importStar=this&&this.__importStar||(function(){var l=function(e){return l=Object.getOwnPropertyNames||function(r){var n=[];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(n[n.length]=a);return n},l(e)};return function(e){if(e&&e.__esModule)return e;var r={};if(e!=null)for(var n=l(e),a=0;a<n.length;a++)n[a]!=="default"&&__createBinding(r,e,n[a]);return __setModuleDefault(r,e),r}})(),__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"),PushCard_1=__importDefault(require("./PushCard")),TouchableScale_1=__importDefault(require("../TouchableScale")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),EmptyState_1=__importDefault(require("../EmptyState")),EndOfListFooter_1=__importDefault(require("../EndOfListFooter")),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),PushTab=react_1.default.memo(()=>{const{pushRecords:l,filteredPushRecords:e,pushSearch:r,setPushSearch:n,pushQuickFilter:a,setPushQuickFilter:u,setSelectedPush:d,clearAllPushLogs:g,simulatePush:p}=(0,InspectorContext_1.useInspector)(),y=(0,react_1.useRef)(null),[f,m]=(0,react_1.useState)(0),h=["salesforce","fcm","apns","deeplink","rich_media"],S=(0,react_1.useCallback)(()=>{const o=h[f%h.length];p(o),m(t=>t+1)},[f,p]),C=(0,react_1.useMemo)(()=>{let o=0,t=0,s=0;const i={};return l.forEach(c=>{const b=(c.appState||"").toLowerCase();b==="foreground"&&o++,b==="background"&&t++,c.action==="opened"&&s++;const _=(c.source||"other").toLowerCase();i[_]=(i[_]||0)+1}),{all:l.length,foreground:o,background:t,opened:s,sources:i}},[l]),w=(0,react_1.useMemo)(()=>{const o=[{id:"all",label:"All",color:AppColors_1.AppColors.purple,icon:t=><NetworkIcons_1.BellIcon size={12}color={t}/>},{id:"foreground",label:"Foreground",color:AppColors_1.AppColors.greenColor,icon:t=><NetworkIcons_1.SunIcon size={12}color={t}/>},{id:"background",label:"Background",color:AppColors_1.AppColors.darkOrange,icon:t=><NetworkIcons_1.MoonIcon size={12}color={t}/>},{id:"opened",label:"Opened",color:AppColors_1.AppColors.brandPurple,icon:t=><NetworkIcons_1.ExternalLinkIcon size={12}color={t}/>}];return Object.entries(C.sources).forEach(([t,s])=>{s>0&&t!=="all"&&o.push({id:`source:${t}`,label:t.toUpperCase(),color:t==="salesforce"?AppColors_1.AppColors.sky600:AppColors_1.AppColors.brandPurple,icon:i=><NetworkIcons_1.CloudPushIcon size={12}color={i}/>})}),o},[C]),P=(0,react_1.useCallback)(({item:o,index:t})=><AnimatedEntrance_1.default index={t}distance={8}>
+        <PushCard_1.default item={o}searchStr={r}onPress={()=>d(o)}/>
+      </AnimatedEntrance_1.default>,[r,d]),A=(0,react_1.useCallback)(o=>o.id||`push_${o.timestamp}`,[]);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,{flex:1,marginRight:8,height:38}]}>
+            <react_native_1.View style={styles_1.default.searchIcon}>
+              <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak}size={15}/>
+            </react_native_1.View>
+            <react_native_1.TextInput style={[styles_1.default.searchInput,{paddingVertical:0}]}placeholder="Search notifications..."placeholderTextColor={AppColors_1.AppColors.grayTextWeak}value={r}onChangeText={n}autoCapitalize="none"autoCorrect={!1}returnKeyType="search"clearButtonMode="while-editing"/>
+            {r.length>0&&react_native_1.Platform.OS==="android"&&<react_native_1.View style={{position:"absolute",right:8,top:0,bottom:0,justifyContent:"center"}}>
+                <react_native_1.Pressable onPress={()=>n("")}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,{backgroundColor:`${AppColors_1.AppColors.brandPurple}14`,borderColor:`${AppColors_1.AppColors.brandPurple}30`}]}onPress={S}hitSlop={6}accessibilityRole="button"accessibilityLabel="Simulate incoming push notification">
+              <NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple}size={15}/>
+            </TouchableScale_1.default>
+
+            {l.length>0&&<TouchableScale_1.default style={[styles_1.default.toolbarBtn,{borderColor:`${AppColors_1.AppColors.errorColor}38`,backgroundColor:`${AppColors_1.AppColors.errorColor}0F`}]}onPress={g}hitSlop={6}accessibilityRole="button"accessibilityLabel="Clear all push notification history">
+                <NetworkIcons_1.TrashIcon color={AppColors_1.AppColors.errorColor}size={15}/>
+              </TouchableScale_1.default>}
+          </react_native_1.View>
+        </react_native_1.View>
+      </react_native_1.View>
+
+      
+      <react_native_1.View style={pushTabStyles.carouselWrapper}>
+        <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!1}contentContainerStyle={pushTabStyles.carouselContent}>
+          {w.map(o=>{const t=a===o.id;return<TouchableScale_1.default key={o.id}onPress={()=>u(o.id)}style={[pushTabStyles.filterPill,t&&{backgroundColor:o.color,borderColor:o.color}]}>
+                {o.icon?o.icon(t?AppColors_1.AppColors.white:o.color):null}
+                <react_native_1.Text style={[pushTabStyles.filterPillText,t&&{color:AppColors_1.AppColors.white}]}>
+                  {o.label}
+                </react_native_1.Text>
+              </TouchableScale_1.default>})}
+        </react_native_1.ScrollView>
+      </react_native_1.View>
+
+      
+      <react_native_1.FlatList ref={y}data={e}renderItem={P}keyExtractor={A}contentContainerStyle={pushTabStyles.listContent}initialNumToRender={15}maxToRenderPerBatch={20}windowSize={11}removeClippedSubviews={react_native_1.Platform.OS==="android"}ListEmptyComponent={<EmptyState_1.default isSearch={!!(r||a!=="all")}searchQuery={r}customTitle={r||a!=="all"?"No matching push notifications":"No push notifications captured yet"}customSub={r||a!=="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={()=>{n(""),u("all")}}showReload={!1}/>}ListFooterComponent={e.length>0?<EndOfListFooter_1.default totalCount={e.length}label="End of push notification history"/>:null}/>
+    </react_native_1.View>}),pushTabStyles=react_native_1.StyleSheet.create({carouselWrapper:{paddingVertical:6,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor,backgroundColor:AppColors_1.AppColors.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:AppColors_1.AppColors.grayBackground,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},filterPillText:{fontSize:11,fontFamily:AppFonts_1.AppFonts.interMedium,color:AppColors_1.AppColors.primaryBlack},countBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:10},countBadgeText:{fontSize:9.5,fontFamily:AppFonts_1.AppFonts.interBold},listContent:{padding:8,paddingBottom:24}});PushTab.displayName="PushTab",exports.default=PushTab;

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

@@ -1,4 +1,4 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,i,l,r){r===void 0&&(r=l);var t=Object.getOwnPropertyDescriptor(i,l);(!t||("get"in t?!i.__esModule:t.writable||t.configurable))&&(t={enumerable:!0,get:function(){return i[l]}}),Object.defineProperty(e,r,t)}):(function(e,i,l,r){r===void 0&&(r=l),e[r]=i[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,i){Object.defineProperty(e,"default",{enumerable:!0,value:i})}):function(e,i){e.default=i}),__importStar=this&&this.__importStar||(function(){var e=function(i){return e=Object.getOwnPropertyNames||function(l){var r=[];for(var t in l)Object.prototype.hasOwnProperty.call(l,t)&&(r[r.length]=t);return r},e(i)};return function(i){if(i&&i.__esModule)return i;var l={};if(i!=null)for(var r=e(i),t=0;t<r.length;t++)r[t]!=="default"&&__createBinding(l,i,r[t]);return __setModuleDefault(l,i),l}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),i18n_1=require("../../i18n"),InspectorContext_1=require("./InspectorContext"),SegmentedTabs_1=__importDefault(require("../SegmentedTabs")),JsonViewer_1=__importDefault(require("../JsonViewer")),DiffViewer_1=__importDefault(require("../DiffViewer")),CopyButton_1=__importDefault(require("../CopyButton")),TouchableScale_1=__importDefault(require("../TouchableScale")),HighlightText_1=__importDefault(require("../HighlightText")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),reduxLogger_1=require("../../customHooks/reduxLogger"),helpers_1=require("../../helpers"),settingsStore_1=require("../../helpers/settingsStore"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),getOriginBadge=e=>{switch(e){case"saga":return{label:"SAGA",renderIcon:(i,l=9)=><NetworkIcons_1.BoltIcon color={i}size={l}/>,bg:AppColors_1.AppColors.purple100,text:AppColors_1.AppColors.brandPurple,border:AppColors_1.AppColors.purple200};case"thunk":return{label:"THUNK",renderIcon:(i,l=9)=><NetworkIcons_1.AtomIcon color={i}size={l}/>,bg:AppColors_1.AppColors.amber100,text:AppColors_1.AppColors.amber800Warm,border:AppColors_1.AppColors.amber200};case"ui":return{label:"UI",renderIcon:(i,l=9)=><NetworkIcons_1.ScreenIcon color={i}size={l}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};case"listener":return{label:"LISTENER",renderIcon:(i,l=9)=><NetworkIcons_1.ListenerIcon color={i}size={l}/>,bg:AppColors_1.AppColors.teal100,text:AppColors_1.AppColors.teal700,border:AppColors_1.AppColors.teal400};default:return{label:"DIRECT",renderIcon:(i,l=9)=><NetworkIcons_1.BoltIcon color={i}size={l}/>,bg:AppColors_1.AppColors.slate100,text:AppColors_1.AppColors.slate700,border:AppColors_1.AppColors.slate200}}},ReduxDetail=react_1.default.memo(()=>{const{t:e}=(0,i18n_1.useTranslation)(),{reduxState:i,reduxLastActionMap:l,selectedReduxSlice:r,selectedReduxAction:t,setSelectedReduxSlice:R}=(0,InspectorContext_1.useInspector)(),[d,S]=(0,react_1.useState)(""),[y,V]=(0,react_1.useState)("live"),[b,F]=(0,react_1.useState)("payload"),[k,B]=(0,react_1.useState)("raw"),[P,W]=(0,react_1.useState)(null),[_,T]=(0,react_1.useState)(!1),[A,g]=(0,react_1.useState)(null),h=(0,react_1.useMemo)(()=>(0,reduxLogger_1.getActionHistory)(),[l]),x=(0,react_1.useMemo)(()=>r?h.filter(a=>!a.affectedSlices||a.affectedSlices.length===0?!0:a.affectedSlices.includes(r)):h,[h,r]),I=(0,react_1.useMemo)(()=>{if(!d.trim())return x;const a=d.toLowerCase();return x.filter(p=>p.type.toLowerCase().includes(a)||p.callerFile&&p.callerFile.toLowerCase().includes(a)||p.payload&&JSON.stringify(p.payload).toLowerCase().includes(a))},[x,d]);(0,react_1.useEffect)(()=>{if(!r)return;async function a(){try{const p=(0,settingsStore_1.getCustomStorage)();if(!p){T(!1),g(null);return}let c=await p.getItem(`persist:${r}`);if(c){try{g(JSON.parse(c))}catch{g(c)}T(!0);return}let n=await p.getItem("persist:root");if(n){const o=JSON.parse(n);if(o&&o[r]!==void 0){const s=o[r];try{g(typeof s=="string"?JSON.parse(s):s)}catch{g(s)}T(!0);return}}}catch{}T(!1),g(null)}a()},[r]);const z=()=>{r&&react_native_1.Alert.alert("Clear Persisted State",`Are you sure you want to delete persisted storage for slice "${r}"?`,[{text:"Cancel",style:"cancel"},{text:"Delete",style:"destructive",onPress:async()=>{try{const a=(0,settingsStore_1.getCustomStorage)();if(!a)return;typeof a.removeItem=="function"?await a.removeItem(`persist:${r}`):await a.setItem(`persist:${r}`,""),T(!1),g(null),V("live"),react_native_1.Platform.OS==="android"?react_native_1.ToastAndroid.show("Persisted state cleared",react_native_1.ToastAndroid.SHORT):react_native_1.Alert.alert("Cleared","Persisted state has been cleared.")}catch{react_native_1.Alert.alert("Error","Failed to clear persisted state.")}}}])};if(r!=null){const a=i?.[r],p=a&&typeof a=="object"?Object.keys(a).length:typeof a<"u"?1:0,c=l[r],n=[{key:"live",label:e("redux.liveState","Live State"),icon:o=><NetworkIcons_1.LiveStateIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"timeline",label:`${e("redux.timeline","Timeline")} (${x.length})`,icon:o=><NetworkIcons_1.TimelineIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"persisted",label:_?e("redux.persisted","Persisted"):e("redux.storage","Storage"),icon:o=><NetworkIcons_1.StorageIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"metadata",label:e("redux.metadata","Metadata"),icon:o=><NetworkIcons_1.MetadataIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>}];return<react_native_1.View style={{flex:1,backgroundColor:AppColors_1.AppColors.grayBackground}}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,i,l,r){r===void 0&&(r=l);var t=Object.getOwnPropertyDescriptor(i,l);(!t||("get"in t?!i.__esModule:t.writable||t.configurable))&&(t={enumerable:!0,get:function(){return i[l]}}),Object.defineProperty(e,r,t)}):(function(e,i,l,r){r===void 0&&(r=l),e[r]=i[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,i){Object.defineProperty(e,"default",{enumerable:!0,value:i})}):function(e,i){e.default=i}),__importStar=this&&this.__importStar||(function(){var e=function(i){return e=Object.getOwnPropertyNames||function(l){var r=[];for(var t in l)Object.prototype.hasOwnProperty.call(l,t)&&(r[r.length]=t);return r},e(i)};return function(i){if(i&&i.__esModule)return i;var l={};if(i!=null)for(var r=e(i),t=0;t<r.length;t++)r[t]!=="default"&&__createBinding(l,i,r[t]);return __setModuleDefault(l,i),l}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),i18n_1=require("../../i18n"),InspectorContext_1=require("./InspectorContext"),SegmentedTabs_1=__importDefault(require("../SegmentedTabs")),JsonViewer_1=__importDefault(require("../JsonViewer")),DiffViewer_1=__importDefault(require("../DiffViewer")),CopyButton_1=__importDefault(require("../CopyButton")),ShareButton_1=__importDefault(require("../ShareButton")),TouchableScale_1=__importDefault(require("../TouchableScale")),HighlightText_1=__importDefault(require("../HighlightText")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),reduxLogger_1=require("../../customHooks/reduxLogger"),helpers_1=require("../../helpers"),shareFormatter_1=require("../../helpers/shareFormatter"),settingsStore_1=require("../../helpers/settingsStore"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),NetworkIcons_1=require("../NetworkIcons"),getOriginBadge=e=>{switch(e){case"saga":return{label:"SAGA",renderIcon:(i,l=9)=><NetworkIcons_1.AtomIcon color={i}size={l}/>,bg:AppColors_1.AppColors.purple100,text:AppColors_1.AppColors.brandPurple,border:AppColors_1.AppColors.purple200};case"thunk":return{label:"THUNK",renderIcon:(i,l=9)=><NetworkIcons_1.BoltIcon color={i}size={l}/>,bg:AppColors_1.AppColors.amber100,text:AppColors_1.AppColors.amber800Warm,border:AppColors_1.AppColors.amber200};case"epic":return{label:"EPIC",renderIcon:(i,l=9)=><NetworkIcons_1.TerminalIcon color={i}size={l}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};case"listener":return{label:"LISTENER",renderIcon:(i,l=9)=><NetworkIcons_1.ListenerIcon color={i}size={l}/>,bg:AppColors_1.AppColors.teal100,text:AppColors_1.AppColors.teal700,border:AppColors_1.AppColors.teal400};case"component":return{label:"UI DISPATCH",renderIcon:(i,l=9)=><NetworkIcons_1.ScreenIcon color={i}size={l}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};default:return{label:"DISPATCH",renderIcon:(i,l=9)=><NetworkIcons_1.BoltIcon color={i}size={l}/>,bg:AppColors_1.AppColors.slate100,text:AppColors_1.AppColors.slate700,border:AppColors_1.AppColors.slate200}}},ReduxDetail=react_1.default.memo(()=>{const{t:e}=(0,i18n_1.useTranslation)(),{reduxState:i,reduxLastActionMap:l,selectedReduxSlice:r,selectedReduxAction:t}=(0,InspectorContext_1.useInspector)(),[d,S]=(0,react_1.useState)(""),[y,V]=(0,react_1.useState)("live"),[b,F]=(0,react_1.useState)("payload"),[k,B]=(0,react_1.useState)("raw"),[P,W]=(0,react_1.useState)(null),[_,A]=(0,react_1.useState)(!1),[T,g]=(0,react_1.useState)(null),h=(0,react_1.useMemo)(()=>(0,reduxLogger_1.getActionHistory)(),[l]),f=(0,react_1.useMemo)(()=>r?h.filter(a=>!a.affectedSlices||a.affectedSlices.length===0?!0:a.affectedSlices.includes(r)):h,[h,r]),I=(0,react_1.useMemo)(()=>{if(!d.trim())return f;const a=d.toLowerCase();return f.filter(p=>p.type.toLowerCase().includes(a)||p.callerFile&&p.callerFile.toLowerCase().includes(a)||p.payload&&JSON.stringify(p.payload).toLowerCase().includes(a))},[f,d]);(0,react_1.useEffect)(()=>{if(!r)return;async function a(){try{const p=(0,settingsStore_1.getCustomStorage)();if(!p){A(!1),g(null);return}let c=await p.getItem(`persist:${r}`);if(c){try{g(JSON.parse(c))}catch{g(c)}A(!0);return}let n=await p.getItem("persist:root");if(n){const o=JSON.parse(n);if(o&&o[r]!==void 0){const s=o[r];try{g(typeof s=="string"?JSON.parse(s):s)}catch{g(s)}A(!0);return}}}catch{}A(!1),g(null)}a()},[r]);const z=()=>{r&&react_native_1.Alert.alert("Clear Persisted State",`Are you sure you want to delete persisted storage for slice "${r}"?`,[{text:"Cancel",style:"cancel"},{text:"Delete",style:"destructive",onPress:async()=>{try{const a=(0,settingsStore_1.getCustomStorage)();if(!a)return;typeof a.removeItem=="function"?await a.removeItem(`persist:${r}`):await a.setItem(`persist:${r}`,""),A(!1),g(null),V("live"),react_native_1.Platform.OS==="android"?react_native_1.ToastAndroid.show("Persisted state cleared",react_native_1.ToastAndroid.SHORT):react_native_1.Alert.alert("Cleared","Persisted state has been cleared.")}catch{react_native_1.Alert.alert("Error","Failed to clear persisted state.")}}}])};if(r!=null){const a=i?.[r],p=a&&typeof a=="object"?Object.keys(a).length:typeof a<"u"?1:0,c=l[r],n=[{key:"live",label:e("redux.liveState","Live State"),icon:o=><NetworkIcons_1.LiveStateIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"timeline",label:`${e("redux.timeline","Timeline")} (${f.length})`,icon:o=><NetworkIcons_1.TimelineIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"persisted",label:_?e("redux.persisted","Persisted"):e("redux.storage","Storage"),icon:o=><NetworkIcons_1.StorageIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>},{key:"metadata",label:e("redux.metadata","Metadata"),icon:o=><NetworkIcons_1.MetadataIcon color={o?AppColors_1.AppColors.white:AppColors_1.AppColors.grayText}size={12}/>}];return<react_native_1.View style={{flex:1,backgroundColor:AppColors_1.AppColors.grayBackground}}>
         
         <react_native_1.View style={reduxDetailStyles.infoBar}>
           <react_native_1.View style={reduxDetailStyles.infoTopRow}>
@@ -30,7 +30,7 @@
             </react_native_1.View>
 
             
-            <CopyButton_1.default value={()=>y==="live"?a:A}label={e("redux.sliceJson","Slice JSON")}/>
+            <CopyButton_1.default value={()=>y==="live"?a:T}label={e("redux.sliceJson","Slice JSON")}/>
           </react_native_1.View>
 
           
@@ -58,7 +58,7 @@
                 {e("redux.timeline","Timeline")}:
               </react_native_1.Text>
               <react_native_1.Text style={[reduxDetailStyles.statValue,{color:AppColors_1.AppColors.brandPurple}]}>
-                {x.length}
+                {f.length}
               </react_native_1.Text>
             </react_native_1.View>
             {c&&<react_native_1.View style={[reduxDetailStyles.statPill,{backgroundColor:AppColors_1.AppColors.amber100,borderColor:AppColors_1.AppColors.amber200,flexShrink:1,maxWidth:160}]}>
@@ -92,7 +92,7 @@
                 <react_native_1.Text style={reduxDetailStyles.emptyBoxText}>
                   {d.trim()?"No actions matching your search query.":"No dispatched actions recorded for this slice yet."}
                 </react_native_1.Text>
-              </react_native_1.View>:I.map((o,s)=>{const C=P===o.id,m=getOriginBadge(o.originType),D=o.callerFile?o.callerFile.split("/").pop():null;return<AnimatedEntrance_1.default key={o.id}index={s}distance={6}>
+              </react_native_1.View>:I.map((o,s)=>{const C=P===o.id,x=getOriginBadge(o.originType),D=o.callerFile?o.callerFile.split("/").pop():null;return<AnimatedEntrance_1.default key={o.id}index={s}distance={6}>
                     <TouchableScale_1.default onPress={()=>W(C?null:o.id)}style={reduxDetailStyles.timelineCard}>
                       <react_native_1.View style={reduxDetailStyles.timelineHeader}>
                         <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0,flexWrap:"wrap"}}>
@@ -102,10 +102,10 @@
                             </react_native_1.Text>
                           </react_native_1.View>
                           
-                          <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:m.bg,paddingHorizontal:5,paddingVertical:2,borderRadius:4,borderWidth:1,borderColor:m.border}}>
-                            {m.renderIcon(m.text,8.5)}
-                            <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:m.text,letterSpacing:.3}}>
-                              {m.label}
+                          <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:x.bg,paddingHorizontal:5,paddingVertical:2,borderRadius:4,borderWidth:1,borderColor:x.border}}>
+                            {x.renderIcon(x.text,8.5)}
+                            <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:x.text,letterSpacing:.3}}>
+                              {x.label}
                             </react_native_1.Text>
                           </react_native_1.View>
 
@@ -149,7 +149,7 @@
                               </react_native_1.Text>
                               <react_native_1.View style={{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:8,padding:8,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,gap:4}}>
                                 {o.stack.split(`
-`).map(f=>f.trim()).filter(f=>f.length>0&&!f.includes("reduxLogger")&&!f.includes("inspectorReduxMiddleware")).slice(0,8).map((f,v)=>{const u=(0,helpers_1.parseStackLine)(f,v===0),w=u.frameType==="app";return<react_native_1.Pressable key={v}onPress={()=>{u.fileName!=="Unknown"&&(0,helpers_1.openInVSCode)(u.fullPath||u.fileName,u.lineNumber,u.columnNumber)}}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:3,borderBottomWidth:v<7?.5:0,borderBottomColor:AppColors_1.AppColors.dividerColor}}>
+`).map(m=>m.trim()).filter(m=>m.length>0&&!m.includes("reduxLogger")&&!m.includes("inspectorReduxMiddleware")).slice(0,8).map((m,v)=>{const u=(0,helpers_1.parseStackLine)(m,v===0),w=u.frameType==="app";return<react_native_1.Pressable key={v}onPress={()=>{u.fileName!=="Unknown"&&(0,helpers_1.openInVSCode)(u.fullPath||u.fileName,u.lineNumber,u.columnNumber)}}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:3,borderBottomWidth:v<7?.5:0,borderBottomColor:AppColors_1.AppColors.dividerColor}}>
                                         <react_native_1.View style={{flex:1,minWidth:0}}>
                                           <react_native_1.Text style={{fontFamily:w?AppFonts_1.AppFonts.interBold:AppFonts_1.AppFonts.interRegular,fontSize:9.5,color:w?AppColors_1.AppColors.primaryBlack:AppColors_1.AppColors.grayTextWeak}}numberOfLines={1}>
                                             {u.functionName||"anonymous"}
@@ -186,7 +186,7 @@
                   </AnimatedEntrance_1.default>})}
           </react_native_1.ScrollView>:y==="metadata"?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={{padding:12,paddingBottom:40}}keyboardShouldPersistTaps="handled">
             <react_native_1.View style={reduxDetailStyles.metadataCard}>
-              {[{label:"Slice Name",value:r},{label:"Root Keys Count",value:`${p} keys`},{label:"In-Memory State Size",value:(0,helpers_1.getSize)(a)},{label:"Persistence Status",value:_?`Persisted (${(0,helpers_1.getSize)(A)})`:"Not Persisted (In-Memory)"},{label:"Dispatched Actions History",value:`${x.length} recorded actions`},{label:"Last Dispatched Action",value:c?c.type:"None"},{label:"Last Action Timestamp",value:c?c.timestamp:"Initial"}].map((o,s)=><react_native_1.View key={s}style={[reduxDetailStyles.metaRow,s===6&&{borderBottomWidth:0}]}>
+              {[{label:"Slice Name",value:r},{label:"Root Keys Count",value:`${p} keys`},{label:"In-Memory State Size",value:(0,helpers_1.getSize)(a)},{label:"Persistence Status",value:_?`Persisted (${(0,helpers_1.getSize)(T)})`:"Not Persisted (In-Memory)"},{label:"Dispatched Actions History",value:`${f.length} recorded actions`},{label:"Last Dispatched Action",value:c?c.type:"None"},{label:"Last Action Timestamp",value:c?c.timestamp:"Initial"}].map((o,s)=><react_native_1.View key={s}style={[reduxDetailStyles.metaRow,s===6&&{borderBottomWidth:0}]}>
                   <react_native_1.Text style={reduxDetailStyles.metaLabel}>{o.label}</react_native_1.Text>
                   <react_native_1.Text style={reduxDetailStyles.metaValue}selectable numberOfLines={2}>
                     {o.value}
@@ -207,7 +207,7 @@
                     <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6}}>
                       <NetworkIcons_1.StorageIcon color={AppColors_1.AppColors.emerald700}size={14}/>
                       <react_native_1.Text style={reduxDetailStyles.persistedInfoTitle}>
-                        Stored in persistent storage ({(0,helpers_1.getSize)(A)})
+                        Stored in persistent storage ({(0,helpers_1.getSize)(T)})
                       </react_native_1.Text>
                     </react_native_1.View>
                     <react_native_1.TouchableOpacity style={reduxDetailStyles.clearPersistMiniBtn}onPress={z}>
@@ -219,7 +219,7 @@
                   </react_native_1.View>
                 </react_native_1.View>
                 <react_native_1.View style={{flex:1,marginTop:8}}>
-                  <JsonViewer_1.default data={A}search={d}forceOpen={d.length>0?!0:void 0}mode={k}onModeChange={B}fullHeight={!0}wrap={!0}/>
+                  <JsonViewer_1.default data={T}search={d}forceOpen={d.length>0?!0:void 0}mode={k}onModeChange={B}fullHeight={!0}wrap={!0}/>
                 </react_native_1.View>
               </react_native_1.View>:<react_native_1.View style={reduxDetailStyles.emptyBox}>
                 <NetworkIcons_1.StorageIcon color={AppColors_1.AppColors.grayTextWeak}size={32}/>
@@ -263,7 +263,10 @@
             </react_native_1.View>
 
             
-            <CopyButton_1.default value={()=>t}label="Copy Action"/>
+            <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:6}}>
+              <ShareButton_1.default onShare={()=>(0,shareFormatter_1.shareReduxReport)(t)}/>
+              <CopyButton_1.default value={()=>t}label="Copy Action"/>
+            </react_native_1.View>
           </react_native_1.View>