react-native-inapp-inspector 2.4.0 → 2.4.2

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

@@ -1,6 +1,6 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(i,t,a,r){r===void 0&&(r=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(i,r,n)}):(function(i,t,a,r){r===void 0&&(r=a),i[r]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(i,t){Object.defineProperty(i,"default",{enumerable:!0,value:t})}):function(i,t){i.default=t}),__importStar=this&&this.__importStar||(function(){var i=function(t){return i=Object.getOwnPropertyNames||function(a){var r=[];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(r[r.length]=n);return r},i(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var r=i(t),n=0;n<r.length;n++)r[n]!=="default"&&__createBinding(a,t,r[n]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};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"),TouchableScale_1=__importDefault(require("../TouchableScale")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),EmptyState_1=__importDefault(require("../EmptyState")),EndOfListFooter_1=__importDefault(require("../EndOfListFooter")),HighlightText_1=__importDefault(require("../HighlightText")),helpers_1=require("../../helpers"),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),reduxLogger_1=require("../../customHooks/reduxLogger"),NetworkIcons_1=require("../NetworkIcons"),getOriginBadge=i=>{switch(i){case"saga":return{label:"SAGA",renderIcon:(t,a=9)=><NetworkIcons_1.BoltIcon color={t}size={a}/>,bg:AppColors_1.AppColors.purple100,text:AppColors_1.AppColors.brandPurple,border:AppColors_1.AppColors.purple200};case"thunk":return{label:"THUNK",renderIcon:(t,a=9)=><NetworkIcons_1.AtomIcon color={t}size={a}/>,bg:AppColors_1.AppColors.amber100,text:AppColors_1.AppColors.amber800Warm,border:AppColors_1.AppColors.amber200};case"ui":return{label:"UI",renderIcon:(t,a=9)=><NetworkIcons_1.ScreenIcon color={t}size={a}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};case"listener":return{label:"LISTENER",renderIcon:(t,a=9)=><NetworkIcons_1.ListenerIcon color={t}size={a}/>,bg:AppColors_1.AppColors.teal100,text:AppColors_1.AppColors.teal700,border:AppColors_1.AppColors.teal400};default:return{label:"DIRECT",renderIcon:(t,a=9)=><NetworkIcons_1.BoltIcon color={t}size={a}/>,bg:AppColors_1.AppColors.slate100,text:AppColors_1.AppColors.slate700,border:AppColors_1.AppColors.slate200}}},ReduxTab=react_1.default.memo(()=>{const{t:i}=(0,i18n_1.useTranslation)(),{reduxState:t,reduxLastActionMap:a,reduxSearch:r,setReduxSearch:n,setSelectedReduxSlice:_}=(0,InspectorContext_1.useInspector)(),S=(0,react_1.useRef)(null),[x,V]=(0,react_1.useState)(100),[y,I]=(0,react_1.useState)("latest"),z=(0,react_1.useMemo)(()=>(0,helpers_1.getSize)(t),[t]),m=(0,react_1.useMemo)(()=>(0,reduxLogger_1.getActionHistory)(),[a]),A=(0,react_1.useMemo)(()=>!t||typeof t!="object"?[]:Object.keys(t).map(l=>{const o=t[l],p=Array.isArray(o),w=o&&typeof o=="object";let g="Primitive",d=0;p?(d=o.length,g=`Array [${d}]`):w?(d=Object.keys(o).length,g=`Object {${d}}`):typeof o<"u"&&(d=1,g=typeof o);let C="live",c;w&&(o.loading===!0||o.isLoading===!0||o.status==="loading"||o.status==="pending"?(C="loading",c="Loading"):o.error||o.hasError||o.status==="error"||o.status==="failed"?(C="error",c=typeof o.error=="string"?o.error:"Error"):d===0&&(C="empty",c="Empty"));const s=a[l],B=s?.updatedAt||0,F=m.filter(f=>!f.affectedSlices||f.affectedSlices.length===0?!0:f.affectedSlices.includes(l)).length;let T;if(s){let f;if(s.payload!==void 0&&s.payload!==null)try{if(typeof s.payload=="object"){const v=Object.keys(s.payload);f=`{ ${v.slice(0,3).join(", ")}${v.length>3?"...":""} }`}else f=String(s.payload)}catch{}T={type:s.type,timestamp:s.timestamp,updatedAt:s.updatedAt,payloadPreview:f,originType:s.originType,callerFile:s.callerFile,callerLine:s.callerLine,callerCol:s.callerCol}}return{id:`slice-${l}`,name:l,keysCount:d,sizeStr:(0,helpers_1.getSize)(o),typeLabel:g,status:C,statusMessage:c,timelineCount:F,lastAction:T,updatedAt:B}}),[t,a,m]),u=(0,react_1.useMemo)(()=>{let e=A;if(r&&r.trim().length>0){const l=r.trim().toLowerCase().split(/\s+/).filter(Boolean);e=e.filter(o=>{const p=t?t[o.name]:null,w=[o.name||"",o.lastAction?.type||"",o.lastAction?.payloadPreview||"",o.lastAction?.originType||"",o.status||"",o.statusMessage||"",p?typeof p=="string"?p:JSON.stringify(p):""].join(" ").toLowerCase();return l.every(g=>w.includes(g))})}return[...e].sort((l,o)=>y==="latest"&&o.updatedAt!==l.updatedAt?o.updatedAt-l.updatedAt:l.name.localeCompare(o.name))},[A,r,y,t]),b=(0,react_1.useMemo)(()=>u.slice(0,x),[u,x]),h=(0,react_1.useMemo)(()=>{const e=Object.values(a);return e.length===0?null:e.reduce((l,o)=>l?(o.updatedAt||0)>(l.updatedAt||0)?o:l:o,null)},[a]),R=(0,react_1.useCallback)(({item:e,index:l})=>{const o=e.updatedAt>0&&Date.now()-e.updatedAt<5e3,p=e.status==="error"?AppColors_1.AppColors.errorColor:e.status==="loading"?AppColors_1.AppColors.warningIconGold:e.status==="empty"?AppColors_1.AppColors.grayTextWeak:AppColors_1.AppColors.greenColor,w=e.status==="error"?AppColors_1.AppColors.red100:e.status==="loading"?AppColors_1.AppColors.amber100:e.status==="empty"?AppColors_1.AppColors.grayBackground:AppColors_1.AppColors.emeraldBg,g=e.status==="error"?AppColors_1.AppColors.errorBorder:e.status==="loading"?AppColors_1.AppColors.amber200:e.status==="empty"?AppColors_1.AppColors.dividerColor:AppColors_1.AppColors.emeraldBorder,d=e.status==="error"?AppColors_1.AppColors.red600:e.status==="loading"?AppColors_1.AppColors.amber800Warm:e.status==="empty"?AppColors_1.AppColors.grayTextWeak:AppColors_1.AppColors.emerald700,C=e.lastAction?.callerFile?(0,helpers_1.getCleanCallerDisplay)(e.lastAction.callerFile):null;return<AnimatedEntrance_1.default index={l}distance={8}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(i,t,a,r){r===void 0&&(r=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(i,r,n)}):(function(i,t,a,r){r===void 0&&(r=a),i[r]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(i,t){Object.defineProperty(i,"default",{enumerable:!0,value:t})}):function(i,t){i.default=t}),__importStar=this&&this.__importStar||(function(){var i=function(t){return i=Object.getOwnPropertyNames||function(a){var r=[];for(var n in a)Object.prototype.hasOwnProperty.call(a,n)&&(r[r.length]=n);return r},i(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var r=i(t),n=0;n<r.length;n++)r[n]!=="default"&&__createBinding(a,t,r[n]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};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"),TouchableScale_1=__importDefault(require("../TouchableScale")),AnimatedEntrance_1=__importDefault(require("../AnimatedEntrance")),EmptyState_1=__importDefault(require("../EmptyState")),EndOfListFooter_1=__importDefault(require("../EndOfListFooter")),HighlightText_1=__importDefault(require("../HighlightText")),helpers_1=require("../../helpers"),styles_1=__importDefault(require("../../styles")),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),reduxLogger_1=require("../../customHooks/reduxLogger"),NetworkIcons_1=require("../NetworkIcons"),getOriginBadge=i=>{switch(i){case"saga":return{label:"SAGA",renderIcon:(t,a=9)=><NetworkIcons_1.BoltIcon color={t}size={a}/>,bg:AppColors_1.AppColors.purple100,text:AppColors_1.AppColors.brandPurple,border:AppColors_1.AppColors.purple200};case"thunk":return{label:"THUNK",renderIcon:(t,a=9)=><NetworkIcons_1.AtomIcon color={t}size={a}/>,bg:AppColors_1.AppColors.amber100,text:AppColors_1.AppColors.amber800Warm,border:AppColors_1.AppColors.amber200};case"ui":return{label:"UI",renderIcon:(t,a=9)=><NetworkIcons_1.ScreenIcon color={t}size={a}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};case"listener":return{label:"LISTENER",renderIcon:(t,a=9)=><NetworkIcons_1.ListenerIcon color={t}size={a}/>,bg:AppColors_1.AppColors.teal100,text:AppColors_1.AppColors.teal700,border:AppColors_1.AppColors.teal400};default:return{label:"DIRECT",renderIcon:(t,a=9)=><NetworkIcons_1.BoltIcon color={t}size={a}/>,bg:AppColors_1.AppColors.slate100,text:AppColors_1.AppColors.slate700,border:AppColors_1.AppColors.slate200}}},DEFAULT_PAGE_SIZE=50,LOAD_MORE_STEP=10,ReduxTab=react_1.default.memo(()=>{const{t:i}=(0,i18n_1.useTranslation)(),{reduxState:t,reduxLastActionMap:a,reduxSearch:r,setReduxSearch:n,setSelectedReduxSlice:b}=(0,InspectorContext_1.useInspector)(),x=(0,react_1.useRef)(null),[T,m]=(0,react_1.useState)(DEFAULT_PAGE_SIZE),[u,I]=(0,react_1.useState)("latest");react_1.default.useEffect(()=>{m(DEFAULT_PAGE_SIZE),x.current?.scrollToOffset({offset:0,animated:!1})},[r,u]);const R=(0,react_1.useMemo)(()=>(0,helpers_1.getSize)(t),[t]),v=(0,react_1.useMemo)(()=>(0,reduxLogger_1.getActionHistory)(),[a]),A=(0,react_1.useMemo)(()=>!t||typeof t!="object"?[]:Object.keys(t).map(l=>{const o=t[l],p=Array.isArray(o),w=o&&typeof o=="object";let y="Primitive",d=0;p?(d=o.length,y=`Array [${d}]`):w?(d=Object.keys(o).length,y=`Object {${d}}`):typeof o<"u"&&(d=1,y=typeof o);let f="live",c;w&&(o.loading===!0||o.isLoading===!0||o.status==="loading"||o.status==="pending"?(f="loading",c="Loading"):o.error||o.hasError||o.status==="error"||o.status==="failed"?(f="error",c=typeof o.error=="string"?o.error:"Error"):d===0&&(f="empty",c="Empty"));const s=a[l],B=s?.updatedAt||0,F=v.filter(C=>!C.affectedSlices||C.affectedSlices.length===0?!0:C.affectedSlices.includes(l)).length;let S;if(s){let C;if(s.payload!==void 0&&s.payload!==null)try{if(typeof s.payload=="object"){const V=Object.keys(s.payload);C=`{ ${V.slice(0,3).join(", ")}${V.length>3?"...":""} }`}else C=String(s.payload)}catch{}S={type:s.type,timestamp:s.timestamp,updatedAt:s.updatedAt,payloadPreview:C,originType:s.originType,callerFile:s.callerFile,callerLine:s.callerLine,callerCol:s.callerCol}}return{id:`slice-${l}`,name:l,keysCount:d,sizeStr:(0,helpers_1.getSize)(o),typeLabel:y,status:f,statusMessage:c,timelineCount:F,lastAction:S,updatedAt:B}}),[t,a,v]),g=(0,react_1.useMemo)(()=>{let e=A;if(r&&r.trim().length>0){const l=r.trim().toLowerCase().split(/\s+/).filter(Boolean);e=e.filter(o=>{const p=t?t[o.name]:null,w=[o.name||"",o.lastAction?.type||"",o.lastAction?.payloadPreview||"",o.lastAction?.originType||"",o.status||"",o.statusMessage||"",p?typeof p=="string"?p:JSON.stringify(p):""].join(" ").toLowerCase();return l.every(y=>w.includes(y))})}return[...e].sort((l,o)=>u==="latest"&&o.updatedAt!==l.updatedAt?o.updatedAt-l.updatedAt:l.name.localeCompare(o.name))},[A,r,u,t]),_=(0,react_1.useMemo)(()=>g.slice(0,T),[g,T]),h=(0,react_1.useMemo)(()=>{const e=Object.values(a);return e.length===0?null:e.reduce((l,o)=>l?(o.updatedAt||0)>(l.updatedAt||0)?o:l:o,null)},[a]),z=(0,react_1.useCallback)(({item:e,index:l})=>{const o=e.updatedAt>0&&Date.now()-e.updatedAt<5e3,p=e.status==="error"?AppColors_1.AppColors.errorColor:e.status==="loading"?AppColors_1.AppColors.warningIconGold:e.status==="empty"?AppColors_1.AppColors.grayTextWeak:AppColors_1.AppColors.greenColor,w=e.status==="error"?AppColors_1.AppColors.red100:e.status==="loading"?AppColors_1.AppColors.amber100:e.status==="empty"?AppColors_1.AppColors.grayBackground:AppColors_1.AppColors.emeraldBg,y=e.status==="error"?AppColors_1.AppColors.errorBorder:e.status==="loading"?AppColors_1.AppColors.amber200:e.status==="empty"?AppColors_1.AppColors.dividerColor:AppColors_1.AppColors.emeraldBorder,d=e.status==="error"?AppColors_1.AppColors.red600:e.status==="loading"?AppColors_1.AppColors.amber800Warm:e.status==="empty"?AppColors_1.AppColors.grayTextWeak:AppColors_1.AppColors.emerald700,f=e.lastAction?.callerFile?(0,helpers_1.getCleanCallerDisplay)(e.lastAction.callerFile):null;return<AnimatedEntrance_1.default index={l}distance={8}>
           <react_native_1.View style={reduxTabStyles.cardContainer}>
-            <TouchableScale_1.default onPress={()=>{_(e.name)}}style={[reduxTabStyles.card,{borderLeftWidth:3.5,borderLeftColor:p,backgroundColor:e.status==="error"?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white},o&&reduxTabStyles.cardRecentlyUpdated]}>
+            <TouchableScale_1.default onPress={()=>{b(e.name)}}style={[reduxTabStyles.card,{borderLeftWidth:3.5,borderLeftColor:p,backgroundColor:e.status==="error"?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white},o&&reduxTabStyles.cardRecentlyUpdated]}>
               <react_native_1.View style={reduxTabStyles.cardBody}>
                 
                 <react_native_1.View style={reduxTabStyles.cardHeaderRow}>
@@ -24,7 +24,7 @@
                   </react_native_1.View>
 
                   <react_native_1.View style={reduxTabStyles.cardHeaderRight}>
-                    <react_native_1.View style={[reduxTabStyles.statusPill,{backgroundColor:w,borderColor:g}]}>
+                    <react_native_1.View style={[reduxTabStyles.statusPill,{backgroundColor:w,borderColor:y}]}>
                       {e.status==="loading"?<NetworkIcons_1.LoadingSpinnerIcon color={AppColors_1.AppColors.amber800Warm}size={10}/>:e.status==="error"?<NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.red600}size={10}/>:e.status==="empty"?null:<react_native_1.View style={reduxTabStyles.liveDot}/>}
                       <react_native_1.Text style={[reduxTabStyles.statusPillText,{color:d}]}>
                         {e.status==="loading"?"Loading":e.status==="error"?e.statusMessage||"Error":e.status==="empty"?"Empty":"Live"}
@@ -60,10 +60,10 @@
                     <react_native_1.Text style={reduxTabStyles.footerTimestampText}numberOfLines={1}>
                       {e.lastAction?.timestamp||"Initial state"}
                     </react_native_1.Text>
-                    {C&&<react_native_1.Pressable onPress={()=>(0,helpers_1.openInVSCode)(e.lastAction.callerFile,e.lastAction.callerLine,e.lastAction.callerCol)}hitSlop={6}style={reduxTabStyles.callerChip}>
+                    {f&&<react_native_1.Pressable onPress={()=>(0,helpers_1.openInVSCode)(e.lastAction.callerFile,e.lastAction.callerLine,e.lastAction.callerCol)}hitSlop={6}style={reduxTabStyles.callerChip}>
                         <NetworkIcons_1.DocIcon color={AppColors_1.AppColors.sky600}size={9}/>
                         <react_native_1.Text style={reduxTabStyles.callerChipText}>
-                          {C.display}
+                          {f.display}
                         </react_native_1.Text>
                       </react_native_1.Pressable>}
                   </react_native_1.View>
@@ -91,7 +91,7 @@
               </react_native_1.View>
             </TouchableScale_1.default>
           </react_native_1.View>
-        </AnimatedEntrance_1.default>},[r,_]);return t?<react_native_1.View style={{flex:1,backgroundColor:AppColors_1.AppColors.grayBackground}}>
+        </AnimatedEntrance_1.default>},[r,b]);return t?<react_native_1.View style={{flex:1,backgroundColor:AppColors_1.AppColors.grayBackground}}>
       
       <react_native_1.View style={reduxTabStyles.overviewCard}>
         <react_native_1.View style={reduxTabStyles.statCol}>
@@ -101,7 +101,7 @@
         <react_native_1.View style={reduxTabStyles.statDivider}/>
         <react_native_1.View style={reduxTabStyles.statCol}>
           <react_native_1.Text style={reduxTabStyles.statHeading}>{i("redux.totalState","TOTAL STATE")}</react_native_1.Text>
-          <react_native_1.Text style={reduxTabStyles.statBigVal}>{z}</react_native_1.Text>
+          <react_native_1.Text style={reduxTabStyles.statBigVal}>{R}</react_native_1.Text>
         </react_native_1.View>
         <react_native_1.View style={reduxTabStyles.statDivider}/>
         <react_native_1.View style={[reduxTabStyles.statCol,{flex:1.6}]}>
@@ -132,7 +132,7 @@
             {r.length>0&&<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
                 <react_native_1.View style={{backgroundColor:`${AppColors_1.AppColors.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
                   <react_native_1.Text style={{color:AppColors_1.AppColors.purple,fontSize:9.5,fontFamily:AppFonts_1.AppFonts.interBold}}>
-                    {u.length}
+                    {g.length}
                   </react_native_1.Text>
                 </react_native_1.View>
                 <react_native_1.Pressable accessible={!0}accessibilityRole="button"accessibilityLabel="Clear search input"onPress={()=>n("")}hitSlop={10}>
@@ -142,26 +142,26 @@
           </react_native_1.View>
 
           
-          <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={`Sort order: ${y==="latest"?"Recently updated first":"Alphabetical A to Z"}`}accessibilityHint="Switches sorting between recently updated and alphabetical"style={[styles_1.default.toolbarBtn,y==="latest"&&{backgroundColor:`${AppColors_1.AppColors.brandPurple}1F`,borderColor:AppColors_1.AppColors.brandPurple}]}onPress={()=>I(e=>e==="latest"?"alpha":"latest")}hitSlop={6}>
-            <NetworkIcons_1.SortArrowIcon color={y==="latest"?AppColors_1.AppColors.brandPurple:AppColors_1.AppColors.grayTextStrong}size={16}/>
+          <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={`Sort order: ${u==="latest"?"Recently updated first":"Alphabetical A to Z"}`}accessibilityHint="Switches sorting between recently updated and alphabetical"style={[styles_1.default.toolbarBtn,u==="latest"&&{backgroundColor:`${AppColors_1.AppColors.brandPurple}1F`,borderColor:AppColors_1.AppColors.brandPurple}]}onPress={()=>I(e=>e==="latest"?"alpha":"latest")}hitSlop={6}>
+            <NetworkIcons_1.SortArrowIcon color={u==="latest"?AppColors_1.AppColors.brandPurple:AppColors_1.AppColors.grayTextStrong}size={16}/>
           </react_native_1.TouchableOpacity>
         </react_native_1.View>
 
         <react_native_1.View style={reduxTabStyles.headerSubRow}>
           <react_native_1.Text style={reduxTabStyles.resultCount}>
-            Showing {u.length} of {A.length} state slices
+            Showing {g.length} of {A.length} state slices
           </react_native_1.Text>
           <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
-            {y==="latest"?<NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple}size={11}/>:<NetworkIcons_1.TextAaIcon color={AppColors_1.AppColors.brandPurple}size={11}/>}
+            {u==="latest"?<NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple}size={11}/>:<NetworkIcons_1.TextAaIcon color={AppColors_1.AppColors.brandPurple}size={11}/>}
             <react_native_1.Text style={reduxTabStyles.sortLabel}>
-              {y==="latest"?"Newest Updates First":"Alphabetical (A-Z)"}
+              {u==="latest"?"Newest Updates First":"Alphabetical (A-Z)"}
             </react_native_1.Text>
           </react_native_1.View>
         </react_native_1.View>
       </react_native_1.View>
 
       
-      <react_native_1.FlatList ref={S}data={b}keyExtractor={e=>e.id}renderItem={R}getItemLayout={(e,l)=>({length:126,offset:126*l,index:l})}initialNumToRender={12}maxToRenderPerBatch={8}windowSize={5}removeClippedSubviews={react_native_1.Platform.OS==="android"}renderToHardwareTextureAndroid={!0}ListEmptyComponent={<EmptyState_1.default isSearch={r.trim().length>0}searchQuery={r}onClearSearch={()=>n("")}customTitle={r.trim().length>0?"No Matching Slices":"No Redux State Detected"}customSub={r.trim().length>0?`No Redux slices match "${r}"`:"Attach the Redux store or dispatch actions to see state slices."}/>}ListFooterComponent={u.length>0?<EndOfListFooter_1.default count={b.length}totalCount={u.length}label="slices"hasMore={b.length<u.length}onLoadMore={()=>V(e=>e+10)}/>:null}contentContainerStyle={[reduxTabStyles.listContent,u.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
+      <react_native_1.FlatList ref={x}data={_}keyExtractor={e=>e.id}renderItem={z}getItemLayout={(e,l)=>({length:126,offset:126*l,index:l})}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}ListEmptyComponent={<EmptyState_1.default isSearch={r.trim().length>0}searchQuery={r}onClearSearch={()=>n("")}customTitle={r.trim().length>0?"No Matching Slices":"No Redux State Detected"}customSub={r.trim().length>0?`No Redux slices match "${r}"`:"Attach the Redux store or dispatch actions to see state slices."}/>}ListFooterComponent={g.length>0?<EndOfListFooter_1.default count={_.length}totalCount={g.length}label="slices"loadMoreStep={LOAD_MORE_STEP}hasMore={_.length<g.length}onLoadMore={()=>m(e=>e+LOAD_MORE_STEP)}/>:null}contentContainerStyle={[reduxTabStyles.listContent,g.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
     </react_native_1.View>:<react_native_1.View style={styles_1.default.emptyContainer}>
         <react_native_1.View style={styles_1.default.emptyIconWrap}>
           <NetworkIcons_1.TerminalIcon color={AppColors_1.AppColors.purple}size={32}/>