react-native-inapp-inspector 2.3.18 → 2.3.20

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

@@ -1,424 +1,112 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const i18n_1 = require("../../i18n");
-const InspectorContext_1 = require("./InspectorContext");
-const TouchableScale_1 = __importDefault(require("../TouchableScale"));
-const AnimatedEntrance_1 = __importDefault(require("../AnimatedEntrance"));
-const EmptyState_1 = __importDefault(require("../EmptyState"));
-const EndOfListFooter_1 = __importDefault(require("../EndOfListFooter"));
-const HighlightText_1 = __importDefault(require("../HighlightText"));
-const helpers_1 = require("../../helpers");
-const styles_1 = __importDefault(require("../../styles"));
-const AppColors_1 = require("../../styles/AppColors");
-const AppFonts_1 = require("../../styles/AppFonts");
-const reduxLogger_1 = require("../../customHooks/reduxLogger");
-const NetworkIcons_1 = require("../NetworkIcons");
-const getOriginBadge = (originType) => {
-    switch (originType) {
-        case 'saga':
-            return {
-                label: 'SAGA',
-                renderIcon: (color, size = 9) => <NetworkIcons_1.BoltIcon color={color} size={size}/>,
-                bg: AppColors_1.AppColors.purple100,
-                text: AppColors_1.AppColors.brandPurple,
-                border: AppColors_1.AppColors.purple200,
-            };
-        case 'thunk':
-            return {
-                label: 'THUNK',
-                renderIcon: (color, size = 9) => <NetworkIcons_1.AtomIcon color={color} size={size}/>,
-                bg: AppColors_1.AppColors.amber100,
-                text: AppColors_1.AppColors.amber800Warm,
-                border: AppColors_1.AppColors.amber200,
-            };
-        case 'ui':
-            return {
-                label: 'UI',
-                renderIcon: (color, size = 9) => <NetworkIcons_1.ScreenIcon color={color} size={size}/>,
-                bg: AppColors_1.AppColors.sky100,
-                text: AppColors_1.AppColors.sky600,
-                border: AppColors_1.AppColors.sky400,
-            };
-        case 'listener':
-            return {
-                label: 'LISTENER',
-                renderIcon: (color, size = 9) => <NetworkIcons_1.ListenerIcon color={color} size={size}/>,
-                bg: AppColors_1.AppColors.teal100,
-                text: AppColors_1.AppColors.teal700,
-                border: AppColors_1.AppColors.teal400,
-            };
-        default:
-            return {
-                label: 'DIRECT',
-                renderIcon: (color, size = 9) => <NetworkIcons_1.BoltIcon color={color} size={size}/>,
-                bg: AppColors_1.AppColors.slate100,
-                text: AppColors_1.AppColors.slate700,
-                border: AppColors_1.AppColors.slate200,
-            };
-    }
-};
-const ReduxTab = react_1.default.memo(() => {
-    const { t } = (0, i18n_1.useTranslation)();
-    const { reduxState, reduxLastActionMap, reduxSearch, setReduxSearch, setSelectedReduxSlice, } = (0, InspectorContext_1.useInspector)();
-    const listRef = (0, react_1.useRef)(null);
-    const [sortMode, setSortMode] = (0, react_1.useState)('latest');
-    const [isReduxPaused, setIsReduxPaused] = (0, react_1.useState)(!(0, reduxLogger_1.getReduxAutoRefresh)());
-    const handleTogglePause = (0, react_1.useCallback)(() => {
-        setIsReduxPaused(prev => {
-            const next = !prev;
-            (0, reduxLogger_1.setReduxAutoRefresh)(!next);
-            return next;
-        });
-    }, []);
-    const totalStateSize = (0, react_1.useMemo)(() => {
-        return (0, helpers_1.getSize)(reduxState);
-    }, [reduxState]);
-    const allActions = (0, react_1.useMemo)(() => {
-        return (0, reduxLogger_1.getActionHistory)();
-    }, [reduxLastActionMap]);
-    const sliceItems = (0, react_1.useMemo)(() => {
-        if (!reduxState || typeof reduxState !== 'object')
-            return [];
-        const keys = Object.keys(reduxState);
-        return keys.map(key => {
-            const sliceVal = reduxState[key];
-            const isArray = Array.isArray(sliceVal);
-            const isObject = sliceVal && typeof sliceVal === 'object';
-            let typeLabel = 'Primitive';
-            let keysCount = 0;
-            if (isArray) {
-                keysCount = sliceVal.length;
-                typeLabel = `Array [${keysCount}]`;
-            }
-            else if (isObject) {
-                keysCount = Object.keys(sliceVal).length;
-                typeLabel = `Object {${keysCount}}`;
-            }
-            else if (typeof sliceVal !== 'undefined') {
-                keysCount = 1;
-                typeLabel = typeof sliceVal;
-            }
-            let status = 'live';
-            let statusMessage;
-            if (isObject) {
-                if (sliceVal.loading === true ||
-                    sliceVal.isLoading === true ||
-                    sliceVal.status === 'loading' ||
-                    sliceVal.status === 'pending') {
-                    status = 'loading';
-                    statusMessage = 'Loading';
-                }
-                else if (sliceVal.error ||
-                    sliceVal.hasError ||
-                    sliceVal.status === 'error' ||
-                    sliceVal.status === 'failed') {
-                    status = 'error';
-                    statusMessage = typeof sliceVal.error === 'string' ? sliceVal.error : 'Error';
-                }
-                else if (keysCount === 0) {
-                    status = 'empty';
-                    statusMessage = 'Empty';
-                }
-            }
-            const lastActionRaw = reduxLastActionMap[key];
-            const updatedAt = lastActionRaw?.updatedAt || 0;
-            const timelineCount = allActions.filter(action => {
-                if (!action.affectedSlices || action.affectedSlices.length === 0)
-                    return true;
-                return action.affectedSlices.includes(key);
-            }).length;
-            let lastAction = undefined;
-            if (lastActionRaw) {
-                let payloadPreview;
-                if (lastActionRaw.payload !== undefined && lastActionRaw.payload !== null) {
-                    try {
-                        if (typeof lastActionRaw.payload === 'object') {
-                            const pKeys = Object.keys(lastActionRaw.payload);
-                            payloadPreview = `{ ${pKeys.slice(0, 3).join(', ')}${pKeys.length > 3 ? '...' : ''} }`;
-                        }
-                        else {
-                            payloadPreview = String(lastActionRaw.payload);
-                        }
-                    }
-                    catch { }
-                }
-                lastAction = {
-                    type: lastActionRaw.type,
-                    timestamp: lastActionRaw.timestamp,
-                    updatedAt: lastActionRaw.updatedAt,
-                    payloadPreview,
-                    originType: lastActionRaw.originType,
-                    callerFile: lastActionRaw.callerFile,
-                    callerLine: lastActionRaw.callerLine,
-                    callerCol: lastActionRaw.callerCol,
-                };
-            }
-            return {
-                id: `slice-${key}`,
-                name: key,
-                keysCount,
-                sizeStr: (0, helpers_1.getSize)(sliceVal),
-                typeLabel,
-                status,
-                statusMessage,
-                timelineCount,
-                lastAction,
-                updatedAt,
-            };
-        });
-    }, [reduxState, reduxLastActionMap, allActions]);
-    const filteredSlices = (0, react_1.useMemo)(() => {
-        let list = sliceItems;
-        if (reduxSearch && reduxSearch.trim().length > 0) {
-            const queryTokens = reduxSearch.trim().toLowerCase().split(/\s+/).filter(Boolean);
-            list = list.filter(item => {
-                const sliceVal = reduxState ? reduxState[item.name] : null;
-                const searchTarget = [
-                    item.name || '',
-                    item.lastAction?.type || '',
-                    item.lastAction?.payloadPreview || '',
-                    item.lastAction?.originType || '',
-                    item.status || '',
-                    item.statusMessage || '',
-                    sliceVal ? (typeof sliceVal === 'string' ? sliceVal : JSON.stringify(sliceVal)) : '',
-                ].join(' ').toLowerCase();
-                return queryTokens.every(tok => searchTarget.includes(tok));
-            });
-        }
-        return [...list].sort((a, b) => {
-            if (sortMode === 'latest') {
-                if (b.updatedAt !== a.updatedAt) {
-                    return b.updatedAt - a.updatedAt;
-                }
-                return a.name.localeCompare(b.name);
-            }
-            return a.name.localeCompare(b.name);
-        });
-    }, [sliceItems, reduxSearch, sortMode, reduxState]);
-    const lastGlobalAction = (0, react_1.useMemo)(() => {
-        const actions = Object.values(reduxLastActionMap);
-        if (actions.length === 0)
-            return null;
-        return actions.reduce((latest, curr) => {
-            if (!latest)
-                return curr;
-            return (curr.updatedAt || 0) > (latest.updatedAt || 0) ? curr : latest;
-        }, null);
-    }, [reduxLastActionMap]);
-    const renderSliceItem = (0, react_1.useCallback)(({ item, index }) => {
-        const isRecentlyUpdated = item.updatedAt > 0 && Date.now() - item.updatedAt < 5000;
-        return (<AnimatedEntrance_1.default index={index} distance={8}>
-          <TouchableScale_1.default onPress={() => {
-                setSelectedReduxSlice(item.name);
-            }} style={[
-                reduxTabStyles.card,
-                isRecentlyUpdated && reduxTabStyles.cardRecentlyUpdated,
-            ]}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(a,t,l,o){o===void 0&&(o=l);var n=Object.getOwnPropertyDescriptor(t,l);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,o,n)}):(function(a,t,l,o){o===void 0&&(o=l),a[o]=t[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}):function(a,t){a.default=t}),__importStar=this&&this.__importStar||(function(){var a=function(t){return a=Object.getOwnPropertyNames||function(l){var o=[];for(var n in l)Object.prototype.hasOwnProperty.call(l,n)&&(o[o.length]=n);return o},a(t)};return function(t){if(t&&t.__esModule)return t;var l={};if(t!=null)for(var o=a(t),n=0;n<o.length;n++)o[n]!=="default"&&__createBinding(l,t,o[n]);return __setModuleDefault(l,t),l}})(),__importDefault=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),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=a=>{switch(a){case"saga":return{label:"SAGA",renderIcon:(t,l=9)=><NetworkIcons_1.BoltIcon color={t}size={l}/>,bg:AppColors_1.AppColors.purple100,text:AppColors_1.AppColors.brandPurple,border:AppColors_1.AppColors.purple200};case"thunk":return{label:"THUNK",renderIcon:(t,l=9)=><NetworkIcons_1.AtomIcon color={t}size={l}/>,bg:AppColors_1.AppColors.amber100,text:AppColors_1.AppColors.amber800Warm,border:AppColors_1.AppColors.amber200};case"ui":return{label:"UI",renderIcon:(t,l=9)=><NetworkIcons_1.ScreenIcon color={t}size={l}/>,bg:AppColors_1.AppColors.sky100,text:AppColors_1.AppColors.sky600,border:AppColors_1.AppColors.sky400};case"listener":return{label:"LISTENER",renderIcon:(t,l=9)=><NetworkIcons_1.ListenerIcon color={t}size={l}/>,bg:AppColors_1.AppColors.teal100,text:AppColors_1.AppColors.teal700,border:AppColors_1.AppColors.teal400};default:return{label:"DIRECT",renderIcon:(t,l=9)=><NetworkIcons_1.BoltIcon color={t}size={l}/>,bg:AppColors_1.AppColors.slate100,text:AppColors_1.AppColors.slate700,border:AppColors_1.AppColors.slate200}}},ReduxTab=react_1.default.memo(()=>{const{t:a}=(0,i18n_1.useTranslation)(),{reduxState:t,reduxLastActionMap:l,reduxSearch:o,setReduxSearch:n,setSelectedReduxSlice:m}=(0,InspectorContext_1.useInspector)(),v=(0,react_1.useRef)(null),[p,S]=(0,react_1.useState)("latest"),[b,V]=(0,react_1.useState)(!(0,reduxLogger_1.getReduxAutoRefresh)()),z=(0,react_1.useCallback)(()=>{V(e=>{const i=!e;return(0,reduxLogger_1.setReduxAutoRefresh)(!i),i})},[]),I=(0,react_1.useMemo)(()=>(0,helpers_1.getSize)(t),[t]),h=(0,react_1.useMemo)(()=>(0,reduxLogger_1.getActionHistory)(),[l]),A=(0,react_1.useMemo)(()=>!t||typeof t!="object"?[]:Object.keys(t).map(i=>{const r=t[i],c=Array.isArray(r),f=r&&typeof r=="object";let C="Primitive",d=0;c?(d=r.length,C=`Array [${d}]`):f?(d=Object.keys(r).length,C=`Object {${d}}`):typeof r<"u"&&(d=1,C=typeof r);let _="live",x;f&&(r.loading===!0||r.isLoading===!0||r.status==="loading"||r.status==="pending"?(_="loading",x="Loading"):r.error||r.hasError||r.status==="error"||r.status==="failed"?(_="error",x=typeof r.error=="string"?r.error:"Error"):d===0&&(_="empty",x="Empty"));const s=l[i],F=s?.updatedAt||0,P=h.filter(u=>!u.affectedSlices||u.affectedSlices.length===0?!0:u.affectedSlices.includes(i)).length;let w;if(s){let u;if(s.payload!==void 0&&s.payload!==null)try{if(typeof s.payload=="object"){const T=Object.keys(s.payload);u=`{ ${T.slice(0,3).join(", ")}${T.length>3?"...":""} }`}else u=String(s.payload)}catch{}w={type:s.type,timestamp:s.timestamp,updatedAt:s.updatedAt,payloadPreview:u,originType:s.originType,callerFile:s.callerFile,callerLine:s.callerLine,callerCol:s.callerCol}}return{id:`slice-${i}`,name:i,keysCount:d,sizeStr:(0,helpers_1.getSize)(r),typeLabel:C,status:_,statusMessage:x,timelineCount:P,lastAction:w,updatedAt:F}}),[t,l,h]),g=(0,react_1.useMemo)(()=>{let e=A;if(o&&o.trim().length>0){const i=o.trim().toLowerCase().split(/\s+/).filter(Boolean);e=e.filter(r=>{const c=t?t[r.name]:null,f=[r.name||"",r.lastAction?.type||"",r.lastAction?.payloadPreview||"",r.lastAction?.originType||"",r.status||"",r.statusMessage||"",c?typeof c=="string"?c:JSON.stringify(c):""].join(" ").toLowerCase();return i.every(C=>f.includes(C))})}return[...e].sort((i,r)=>p==="latest"&&r.updatedAt!==i.updatedAt?r.updatedAt-i.updatedAt:i.name.localeCompare(r.name))},[A,o,p,t]),y=(0,react_1.useMemo)(()=>{const e=Object.values(l);return e.length===0?null:e.reduce((i,r)=>i?(r.updatedAt||0)>(i.updatedAt||0)?r:i:r,null)},[l]),R=(0,react_1.useCallback)(({item:e,index:i})=>{const r=e.updatedAt>0&&Date.now()-e.updatedAt<5e3;return<AnimatedEntrance_1.default index={i}distance={8}>
+          <TouchableScale_1.default onPress={()=>{m(e.name)}}style={[reduxTabStyles.card,r&&reduxTabStyles.cardRecentlyUpdated]}>
             
             <react_native_1.View style={reduxTabStyles.cardHeader}>
               <react_native_1.View style={reduxTabStyles.sliceBadge}>
                 <react_native_1.Text style={reduxTabStyles.sliceBadgeText}>SLICE</react_native_1.Text>
               </react_native_1.View>
 
-              <HighlightText_1.default text={item.name} search={reduxSearch} style={reduxTabStyles.sliceName} highlightStyle={reduxTabStyles.highlight}/>
+              <HighlightText_1.default text={e.name}search={o}style={reduxTabStyles.sliceName}highlightStyle={reduxTabStyles.highlight}/>
 
               
-              {item.status === 'loading' ? (<react_native_1.View style={reduxTabStyles.loadingPill}>
-                  <NetworkIcons_1.LoadingSpinnerIcon color={AppColors_1.AppColors.amber800Warm} size={10}/>
+              {e.status==="loading"?<react_native_1.View style={reduxTabStyles.loadingPill}>
+                  <NetworkIcons_1.LoadingSpinnerIcon color={AppColors_1.AppColors.amber800Warm}size={10}/>
                   <react_native_1.Text style={reduxTabStyles.loadingPillText}>Loading</react_native_1.Text>
-                </react_native_1.View>) : item.status === 'error' ? (<react_native_1.View style={reduxTabStyles.errorPill}>
-                  <NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.red600} size={10}/>
+                </react_native_1.View>:e.status==="error"?<react_native_1.View style={reduxTabStyles.errorPill}>
+                  <NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.red600}size={10}/>
                   <react_native_1.Text style={reduxTabStyles.errorPillText}>Error</react_native_1.Text>
-                </react_native_1.View>) : item.status === 'empty' ? (<react_native_1.View style={reduxTabStyles.emptyPill}>
+                </react_native_1.View>:e.status==="empty"?<react_native_1.View style={reduxTabStyles.emptyPill}>
                   <react_native_1.Text style={reduxTabStyles.emptyPillText}>Empty</react_native_1.Text>
-                </react_native_1.View>) : (<react_native_1.View style={reduxTabStyles.livePill}>
+                </react_native_1.View>:<react_native_1.View style={reduxTabStyles.livePill}>
                   <react_native_1.View style={reduxTabStyles.liveDot}/>
                   <react_native_1.Text style={reduxTabStyles.livePillText}>Live</react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
 
-              {item.lastAction?.timestamp && (<react_native_1.View style={reduxTabStyles.timePill}>
-                  <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.purple} size={10}/>
+              {e.lastAction?.timestamp&&<react_native_1.View style={reduxTabStyles.timePill}>
+                  <NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.purple}size={10}/>
                   <react_native_1.Text style={reduxTabStyles.timeText}>
-                    {item.lastAction.timestamp}
+                    {e.lastAction.timestamp}
                   </react_native_1.Text>
-                </react_native_1.View>)}
+                </react_native_1.View>}
 
-              <NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.grayTextWeak} size={13}/>
+              <NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.grayTextWeak}size={13}/>
             </react_native_1.View>
 
             
             <react_native_1.View style={reduxTabStyles.statsRow}>
               <react_native_1.View style={reduxTabStyles.pill}>
-                <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.grayTextWeak} size={11}/>
-                <react_native_1.Text style={reduxTabStyles.pillValue}>{item.typeLabel}</react_native_1.Text>
+                <NetworkIcons_1.LayersIcon color={AppColors_1.AppColors.grayTextWeak}size={11}/>
+                <react_native_1.Text style={reduxTabStyles.pillValue}>{e.typeLabel}</react_native_1.Text>
               </react_native_1.View>
               <react_native_1.View style={reduxTabStyles.pill}>
                 <react_native_1.Text style={reduxTabStyles.pillLabel}>Size:</react_native_1.Text>
-                <react_native_1.Text style={reduxTabStyles.pillValue}>{item.sizeStr}</react_native_1.Text>
+                <react_native_1.Text style={reduxTabStyles.pillValue}>{e.sizeStr}</react_native_1.Text>
               </react_native_1.View>
-              {item.timelineCount > 0 && (<react_native_1.View style={reduxTabStyles.pill}>
+              {e.timelineCount>0&&<react_native_1.View style={reduxTabStyles.pill}>
                   <react_native_1.Text style={reduxTabStyles.pillLabel}>Actions:</react_native_1.Text>
-                  <react_native_1.Text style={reduxTabStyles.pillValue}>{item.timelineCount}</react_native_1.Text>
-                </react_native_1.View>)}
+                  <react_native_1.Text style={reduxTabStyles.pillValue}>{e.timelineCount}</react_native_1.Text>
+                </react_native_1.View>}
             </react_native_1.View>
 
             
-            {item.lastAction && (<react_native_1.View style={reduxTabStyles.lastActionRow}>
-                <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 5, flex: 1, minWidth: 0, flexWrap: 'wrap' }}>
-                  <NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple} size={12}/>
-                  <react_native_1.Text style={reduxTabStyles.lastActionLabel}>{t('redux.last', 'Last')}:</react_native_1.Text>
+            {e.lastAction&&<react_native_1.View style={reduxTabStyles.lastActionRow}>
+                <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0,flexWrap:"wrap"}}>
+                  <NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple}size={12}/>
+                  <react_native_1.Text style={reduxTabStyles.lastActionLabel}>{a("redux.last","Last")}:</react_native_1.Text>
 
                   
-                  {item.lastAction.originType && (() => {
-                    const origin = getOriginBadge(item.lastAction.originType);
-                    return (<react_native_1.View style={{
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            gap: 2.5,
-                            backgroundColor: origin.bg,
-                            paddingHorizontal: 4.5,
-                            paddingVertical: 1.5,
-                            borderRadius: 3.5,
-                            borderWidth: 1,
-                            borderColor: origin.border,
-                        }}>
-                        {origin.renderIcon(origin.text, 8.5)}
-                        <react_native_1.Text style={{
-                            fontFamily: AppFonts_1.AppFonts.interBold,
-                            fontSize: 8,
-                            color: origin.text,
-                            letterSpacing: 0.3,
-                        }}>
-                          {origin.label}
+                  {e.lastAction.originType&&(()=>{const c=getOriginBadge(e.lastAction.originType);return<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:c.bg,paddingHorizontal:4.5,paddingVertical:1.5,borderRadius:3.5,borderWidth:1,borderColor:c.border}}>
+                        {c.renderIcon(c.text,8.5)}
+                        <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8,color:c.text,letterSpacing:.3}}>
+                          {c.label}
                         </react_native_1.Text>
-                      </react_native_1.View>);
-                })()}
+                      </react_native_1.View>})()}
 
-                  <HighlightText_1.default text={item.lastAction.type} search={reduxSearch} style={reduxTabStyles.lastActionValue} highlightStyle={reduxTabStyles.highlight} numberOfLines={1}/>
+                  <HighlightText_1.default text={e.lastAction.type}search={o}style={reduxTabStyles.lastActionValue}highlightStyle={reduxTabStyles.highlight}numberOfLines={1}/>
 
                   
-                  {item.lastAction.callerFile && (<react_native_1.Pressable onPress={() => (0, helpers_1.openInVSCode)(item.lastAction.callerFile, item.lastAction.callerLine, item.lastAction.callerCol)} hitSlop={6} style={{
-                        flexDirection: 'row',
-                        alignItems: 'center',
-                        gap: 2.5,
-                        backgroundColor: AppColors_1.AppColors.sky100,
-                        paddingHorizontal: 4.5,
-                        paddingVertical: 1.5,
-                        borderRadius: 3,
-                        borderWidth: 0.5,
-                        borderColor: AppColors_1.AppColors.sky400,
-                    }}>
-                      <NetworkIcons_1.DocIcon color={AppColors_1.AppColors.sky600} size={9}/>
-                      <react_native_1.Text style={{
-                        fontFamily: AppFonts_1.AppFonts.interMedium,
-                        fontSize: 8.5,
-                        color: AppColors_1.AppColors.sky600,
-                    }}>
-                        {item.lastAction.callerFile.split('/').pop()}:{item.lastAction.callerLine || 1}
+                  {e.lastAction.callerFile&&<react_native_1.Pressable onPress={()=>(0,helpers_1.openInVSCode)(e.lastAction.callerFile,e.lastAction.callerLine,e.lastAction.callerCol)}hitSlop={6}style={{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:AppColors_1.AppColors.sky100,paddingHorizontal:4.5,paddingVertical:1.5,borderRadius:3,borderWidth:.5,borderColor:AppColors_1.AppColors.sky400}}>
+                      <NetworkIcons_1.DocIcon color={AppColors_1.AppColors.sky600}size={9}/>
+                      <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:8.5,color:AppColors_1.AppColors.sky600}}>
+                        {e.lastAction.callerFile.split("/").pop()}:{e.lastAction.callerLine||1}
                       </react_native_1.Text>
-                    </react_native_1.Pressable>)}
+                    </react_native_1.Pressable>}
 
-                  {item.lastAction.payloadPreview && (<react_native_1.Text style={reduxTabStyles.payloadPreviewText} numberOfLines={1}>
-                      {item.lastAction.payloadPreview}
-                    </react_native_1.Text>)}
+                  {e.lastAction.payloadPreview&&<react_native_1.Text style={reduxTabStyles.payloadPreviewText}numberOfLines={1}>
+                      {e.lastAction.payloadPreview}
+                    </react_native_1.Text>}
                 </react_native_1.View>
-              </react_native_1.View>)}
+              </react_native_1.View>}
           </TouchableScale_1.default>
-        </AnimatedEntrance_1.default>);
-    }, [reduxSearch, setSelectedReduxSlice, t]);
-    if (!reduxState) {
-        return (<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}/>
-        </react_native_1.View>
-        <react_native_1.Text style={styles_1.default.emptyTitle}>No Redux Store Connected</react_native_1.Text>
-        <react_native_1.Text style={styles_1.default.emptySub}>
-          Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.
-        </react_native_1.Text>
-      </react_native_1.View>);
-    }
-    return (<react_native_1.View style={{ flex: 1, backgroundColor: AppColors_1.AppColors.grayBackground }}>
+        </AnimatedEntrance_1.default>},[o,m,a]);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}>
           <react_native_1.Text style={reduxTabStyles.statHeading}>ACTIVE SLICES</react_native_1.Text>
-          <react_native_1.Text style={reduxTabStyles.statBigVal}>{sliceItems.length}</react_native_1.Text>
+          <react_native_1.Text style={reduxTabStyles.statBigVal}>{A.length}</react_native_1.Text>
         </react_native_1.View>
         <react_native_1.View style={reduxTabStyles.statDivider}/>
         <react_native_1.View style={reduxTabStyles.statCol}>
           <react_native_1.Text style={reduxTabStyles.statHeading}>TOTAL STATE</react_native_1.Text>
-          <react_native_1.Text style={reduxTabStyles.statBigVal}>{totalStateSize}</react_native_1.Text>
+          <react_native_1.Text style={reduxTabStyles.statBigVal}>{I}</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 }]}>
-          <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
+        <react_native_1.View style={[reduxTabStyles.statCol,{flex:1.6}]}>
+          <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
             <react_native_1.Text style={reduxTabStyles.statHeading}>LAST ACTION</react_native_1.Text>
-            {lastGlobalAction?.originType && (() => {
-            const origin = getOriginBadge(lastGlobalAction.originType);
-            return (<react_native_1.View style={{
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    gap: 2,
-                    backgroundColor: origin.bg,
-                    paddingHorizontal: 4,
-                    paddingVertical: 1,
-                    borderRadius: 3,
-                }}>
-                  {origin.renderIcon(origin.text, 8)}
-                  <react_native_1.Text style={{
-                    fontFamily: AppFonts_1.AppFonts.interBold,
-                    fontSize: 7.5,
-                    color: origin.text,
-                }}>
-                    {origin.label}
+            {y?.originType&&(()=>{const e=getOriginBadge(y.originType);return<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:2,backgroundColor:e.bg,paddingHorizontal:4,paddingVertical:1,borderRadius:3}}>
+                  {e.renderIcon(e.text,8)}
+                  <react_native_1.Text style={{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:7.5,color:e.text}}>
+                    {e.label}
                   </react_native_1.Text>
-                </react_native_1.View>);
-        })()}
+                </react_native_1.View>})()}
           </react_native_1.View>
-          <react_native_1.Text style={reduxTabStyles.statLastAction} numberOfLines={1}>
-            {lastGlobalAction ? lastGlobalAction.type : 'Initial'}
+          <react_native_1.Text style={reduxTabStyles.statLastAction}numberOfLines={1}>
+            {y?y.type:"Initial"}
           </react_native_1.Text>
-          {lastGlobalAction?.timestamp && (<react_native_1.Text style={reduxTabStyles.statLastTime}>
-              {lastGlobalAction.timestamp}
-            </react_native_1.Text>)}
+          {y?.timestamp&&<react_native_1.Text style={reduxTabStyles.statLastTime}>
+              {y.timestamp}
+            </react_native_1.Text>}
         </react_native_1.View>
       </react_native_1.View>
 
@@ -426,67 +114,43 @@ const ReduxTab = react_1.default.memo(() => {
       <react_native_1.View style={reduxTabStyles.toolbarContainer}>
         <react_native_1.View style={reduxTabStyles.searchRow}>
           <react_native_1.View style={styles_1.default.searchContainer}>
-            <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak} size={15}/>
-            <react_native_1.TextInput accessible={true} accessibilityRole="search" accessibilityLabel="Search Redux slices or actions" accessibilityHint="Type to filter state slices in real time" placeholder="Search Redux slices or actions..." placeholderTextColor={AppColors_1.AppColors.grayTextWeak} value={reduxSearch} onChangeText={setReduxSearch} style={styles_1.default.searchInput} autoCorrect={false} autoCapitalize="none"/>
-            {reduxSearch.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,
-            }}>
-                    {filteredSlices.length}
+            <NetworkIcons_1.SearchIcon color={AppColors_1.AppColors.grayTextWeak}size={15}/>
+            <react_native_1.TextInput accessible={!0}accessibilityRole="search"accessibilityLabel="Search Redux slices or actions"accessibilityHint="Type to filter state slices in real time"placeholder="Search Redux slices or actions..."placeholderTextColor={AppColors_1.AppColors.grayTextWeak}value={o}onChangeText={n}style={styles_1.default.searchInput}autoCorrect={!1}autoCapitalize="none"/>
+            {o.length>0&&<react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
+                <react_native_1.View style={{backgroundColor:`${AppColors_1.AppColors.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
+                  <react_native_1.Text style={{color:AppColors_1.AppColors.purple,fontSize:9.5,fontFamily:AppFonts_1.AppFonts.interBold}}>
+                    {g.length}
                   </react_native_1.Text>
                 </react_native_1.View>
-                <react_native_1.Pressable accessible={true} accessibilityRole="button" accessibilityLabel="Clear search input" onPress={() => setReduxSearch('')} hitSlop={10}>
-                  <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak} size={14}/>
+                <react_native_1.Pressable accessible={!0}accessibilityRole="button"accessibilityLabel="Clear search input"onPress={()=>n("")}hitSlop={10}>
+                  <NetworkIcons_1.ClearIcon color={AppColors_1.AppColors.grayTextWeak}size={14}/>
                 </react_native_1.Pressable>
-              </react_native_1.View>)}
+              </react_native_1.View>}
           </react_native_1.View>
 
           
-          <react_native_1.TouchableOpacity accessible={true} accessibilityRole="button" accessibilityLabel={isReduxPaused
-            ? 'Resume live Redux updates'
-            : 'Pause live Redux updates'} accessibilityHint="Toggles automatic recording of Redux state updates" style={[
-            styles_1.default.toolbarBtn,
-            isReduxPaused && {
-                backgroundColor: `${AppColors_1.AppColors.darkOrange}1F`,
-                borderColor: AppColors_1.AppColors.darkOrange,
-            },
-        ]} onPress={handleTogglePause} hitSlop={6}>
-            <NetworkIcons_1.HeaderPauseIcon isPaused={isReduxPaused} color={isReduxPaused
-            ? AppColors_1.AppColors.darkOrange
-            : AppColors_1.AppColors.grayTextStrong} size={16}/>
+          <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={b?"Resume live Redux updates":"Pause live Redux updates"}accessibilityHint="Toggles automatic recording of Redux state updates"style={[styles_1.default.toolbarBtn,b&&{backgroundColor:`${AppColors_1.AppColors.darkOrange}1F`,borderColor:AppColors_1.AppColors.darkOrange}]}onPress={z}hitSlop={6}>
+            <NetworkIcons_1.HeaderPauseIcon isPaused={b}color={b?AppColors_1.AppColors.darkOrange:AppColors_1.AppColors.grayTextStrong}size={16}/>
           </react_native_1.TouchableOpacity>
 
           
-          <react_native_1.TouchableOpacity accessible={true} accessibilityRole="button" accessibilityLabel={`Sort order: ${sortMode === 'latest'
-            ? 'Recently updated first'
-            : 'Alphabetical A to Z'}`} accessibilityHint="Switches sorting between recently updated and alphabetical" style={[
-            styles_1.default.toolbarBtn,
-            sortMode === 'latest' && { backgroundColor: `${AppColors_1.AppColors.brandPurple}1F`, borderColor: AppColors_1.AppColors.brandPurple },
-        ]} onPress={() => setSortMode(prev => (prev === 'latest' ? 'alpha' : 'latest'))} hitSlop={6}>
-            <NetworkIcons_1.SortArrowIcon color={sortMode === 'latest' ? AppColors_1.AppColors.brandPurple : AppColors_1.AppColors.grayTextStrong} size={16}/>
+          <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={`Sort order: ${p==="latest"?"Recently updated first":"Alphabetical A to Z"}`}accessibilityHint="Switches sorting between recently updated and alphabetical"style={[styles_1.default.toolbarBtn,p==="latest"&&{backgroundColor:`${AppColors_1.AppColors.brandPurple}1F`,borderColor:AppColors_1.AppColors.brandPurple}]}onPress={()=>S(e=>e==="latest"?"alpha":"latest")}hitSlop={6}>
+            <NetworkIcons_1.SortArrowIcon color={p==="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 {filteredSlices.length} of {sliceItems.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: 8 }}>
-            {isReduxPaused && (<react_native_1.View style={reduxTabStyles.pausedBannerPill}>
+          <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:8}}>
+            {b&&<react_native_1.View style={reduxTabStyles.pausedBannerPill}>
                 <react_native_1.Text style={reduxTabStyles.pausedBannerText}>PAUSED</react_native_1.Text>
-              </react_native_1.View>)}
-            <react_native_1.View style={{ flexDirection: 'row', alignItems: 'center', gap: 4 }}>
-              {sortMode === 'latest' ? (<NetworkIcons_1.BoltIcon color={AppColors_1.AppColors.brandPurple} size={11}/>) : (<NetworkIcons_1.TextAaIcon color={AppColors_1.AppColors.brandPurple} size={11}/>)}
+              </react_native_1.View>}
+            <react_native_1.View style={{flexDirection:"row",alignItems:"center",gap:4}}>
+              {p==="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}>
-                {sortMode === 'latest' ? 'Newest Updates First' : 'Alphabetical (A-Z)'}
+                {p==="latest"?"Newest Updates First":"Alphabetical (A-Z)"}
               </react_native_1.Text>
             </react_native_1.View>
           </react_native_1.View>
@@ -494,293 +158,13 @@ const ReduxTab = react_1.default.memo(() => {
       </react_native_1.View>
 
       
-      <react_native_1.FlatList ref={listRef} data={filteredSlices} keyExtractor={item => item.id} renderItem={renderSliceItem} initialNumToRender={12} maxToRenderPerBatch={8} windowSize={5} removeClippedSubviews={react_native_1.Platform.OS === 'android'} renderToHardwareTextureAndroid={true} ListEmptyComponent={<EmptyState_1.default isSearch={reduxSearch.trim().length > 0} searchQuery={reduxSearch} onClearSearch={() => setReduxSearch('')} customTitle={reduxSearch.trim().length > 0 ? 'No Matching Slices' : 'No Redux State Detected'} customSub={reduxSearch.trim().length > 0
-                ? `No Redux slices match "${reduxSearch}"`
-                : 'Attach the Redux store or dispatch actions to see state slices.'}/>} ListFooterComponent={filteredSlices.length > 0 ? (<EndOfListFooter_1.default count={filteredSlices.length} label="slices"/>) : null} contentContainerStyle={[
-            reduxTabStyles.listContent,
-            filteredSlices.length === 0 && { flexGrow: 1 },
-        ]} keyboardShouldPersistTaps="handled"/>
-    </react_native_1.View>);
-});
-const reduxTabStyles = react_native_1.StyleSheet.create({
-    overviewCard: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        backgroundColor: AppColors_1.AppColors.white,
-        marginHorizontal: 12,
-        marginTop: 10,
-        borderRadius: 12,
-        padding: 12,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-        shadowColor: AppColors_1.AppColors.primaryBlack,
-        shadowOffset: { width: 0, height: 1 },
-        shadowOpacity: 0.03,
-        shadowRadius: 3,
-        elevation: 1,
-    },
-    statCol: {
-        flex: 1,
-    },
-    statDivider: {
-        width: 1,
-        height: 28,
-        backgroundColor: AppColors_1.AppColors.dividerColor,
-        marginHorizontal: 8,
-    },
-    statHeading: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9,
-        color: AppColors_1.AppColors.grayTextWeak,
-        letterSpacing: 0.5,
-    },
-    statBigVal: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 14,
-        color: AppColors_1.AppColors.primaryBlack,
-        marginTop: 2,
-    },
-    statLastAction: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 11,
-        color: AppColors_1.AppColors.purple,
-        marginTop: 2,
-    },
-    statLastTime: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    toolbarContainer: {
-        backgroundColor: AppColors_1.AppColors.white,
-        borderBottomWidth: 1,
-        borderBottomColor: AppColors_1.AppColors.dividerColor,
-        paddingHorizontal: 12,
-        paddingTop: 8,
-        paddingBottom: 6,
-        marginTop: 8,
-    },
-    searchRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 8,
-    },
-    headerSubRow: {
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginTop: 6,
-        paddingHorizontal: 2,
-    },
-    resultCount: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 11,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    sortLabel: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.brandPurple,
-    },
-    listContent: {
-        padding: 12,
-        paddingBottom: 36,
-    },
-    card: {
-        backgroundColor: AppColors_1.AppColors.white,
-        borderRadius: 12,
-        padding: 12,
-        marginBottom: 10,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-        shadowColor: AppColors_1.AppColors.primaryBlack,
-        shadowOffset: { width: 0, height: 1 },
-        shadowOpacity: 0.04,
-        shadowRadius: 4,
-        elevation: 2,
-    },
-    cardRecentlyUpdated: {
-        borderColor: `${AppColors_1.AppColors.brandPurple}66`,
-        backgroundColor: AppColors_1.AppColors.purpleTintBg,
-    },
-    cardHeader: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 8,
-        marginBottom: 8,
-    },
-    sliceBadge: {
-        backgroundColor: AppColors_1.AppColors.violetSoftBg,
-        paddingHorizontal: 6,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.violetSoftBorder,
-    },
-    sliceBadgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.purple700,
-        letterSpacing: 0.4,
-    },
-    sliceName: {
-        flex: 1,
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 13.5,
-        color: AppColors_1.AppColors.primaryBlack,
-    },
-    timePill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 3,
-        backgroundColor: `${AppColors_1.AppColors.purple}14`,
-        paddingHorizontal: 6,
-        paddingVertical: 2,
-        borderRadius: 4,
-        borderWidth: 1,
-        borderColor: `${AppColors_1.AppColors.purple}2E`,
-    },
-    timeText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10,
-        color: AppColors_1.AppColors.purple,
-    },
-    statsRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 6,
-        flexWrap: 'wrap',
-        marginBottom: 6,
-    },
-    pill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        backgroundColor: AppColors_1.AppColors.grayBackground,
-        paddingHorizontal: 7,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-    },
-    pillLabel: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    pillValue: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.primaryBlack,
-    },
-    livePill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        backgroundColor: AppColors_1.AppColors.emeraldBg,
-        paddingHorizontal: 6,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.emeraldBorder,
-    },
-    liveDot: {
-        width: 6,
-        height: 6,
-        borderRadius: 3,
-        backgroundColor: AppColors_1.AppColors.emerald500,
-    },
-    livePillText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10,
-        color: AppColors_1.AppColors.emerald700,
-    },
-    loadingPill: {
-        backgroundColor: AppColors_1.AppColors.amber100,
-        paddingHorizontal: 6,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.amber200,
-    },
-    loadingPillText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.amber800Warm,
-    },
-    errorPill: {
-        backgroundColor: AppColors_1.AppColors.red100,
-        paddingHorizontal: 6,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.errorBorder,
-    },
-    errorPillText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.red600,
-    },
-    emptyPill: {
-        backgroundColor: AppColors_1.AppColors.grayBackground,
-        paddingHorizontal: 6,
-        paddingVertical: 3,
-        borderRadius: 5,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-    },
-    emptyPillText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 9.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    lastActionRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 5,
-        backgroundColor: AppColors_1.AppColors.grayBackground,
-        borderRadius: 6,
-        paddingHorizontal: 8,
-        paddingVertical: 5,
-        marginTop: 4,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.dividerColor,
-    },
-    lastActionLabel: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.grayTextWeak,
-    },
-    lastActionValue: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 11,
-        color: AppColors_1.AppColors.primaryBlack,
-    },
-    payloadPreviewText: {
-        flex: 1,
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 10,
-        color: AppColors_1.AppColors.grayTextWeak,
-        marginLeft: 4,
-    },
-    highlight: {
-        backgroundColor: AppColors_1.AppColors.yellow200,
-        color: AppColors_1.AppColors.yellow800,
-        fontFamily: AppFonts_1.AppFonts.interBold,
-    },
-    pausedBannerPill: {
-        backgroundColor: AppColors_1.AppColors.amber100,
-        paddingHorizontal: 6,
-        paddingVertical: 2,
-        borderRadius: 4,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.amber200,
-    },
-    pausedBannerText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 9,
-        color: AppColors_1.AppColors.amber800Warm,
-        letterSpacing: 0.5,
-    },
-});
-exports.default = ReduxTab;
+      <react_native_1.FlatList ref={v}data={g}keyExtractor={e=>e.id}renderItem={R}initialNumToRender={12}maxToRenderPerBatch={8}windowSize={5}removeClippedSubviews={react_native_1.Platform.OS==="android"}renderToHardwareTextureAndroid={!0}ListEmptyComponent={<EmptyState_1.default isSearch={o.trim().length>0}searchQuery={o}onClearSearch={()=>n("")}customTitle={o.trim().length>0?"No Matching Slices":"No Redux State Detected"}customSub={o.trim().length>0?`No Redux slices match "${o}"`:"Attach the Redux store or dispatch actions to see state slices."}/>}ListFooterComponent={g.length>0?<EndOfListFooter_1.default count={g.length}label="slices"/>: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}/>
+        </react_native_1.View>
+        <react_native_1.Text style={styles_1.default.emptyTitle}>No Redux Store Connected</react_native_1.Text>
+        <react_native_1.Text style={styles_1.default.emptySub}>
+          Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.
+        </react_native_1.Text>
+      </react_native_1.View>}),reduxTabStyles=react_native_1.StyleSheet.create({overviewCard:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.white,marginHorizontal:12,marginTop:10,borderRadius:12,padding:12,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.primaryBlack,shadowOffset:{width:0,height:1},shadowOpacity:.03,shadowRadius:3,elevation:1},statCol:{flex:1},statDivider:{width:1,height:28,backgroundColor:AppColors_1.AppColors.dividerColor,marginHorizontal:8},statHeading:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,color:AppColors_1.AppColors.grayTextWeak,letterSpacing:.5},statBigVal:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:14,color:AppColors_1.AppColors.primaryBlack,marginTop:2},statLastAction:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11,color:AppColors_1.AppColors.purple,marginTop:2},statLastTime:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak},toolbarContainer:{backgroundColor:AppColors_1.AppColors.white,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.dividerColor,paddingHorizontal:12,paddingTop:8,paddingBottom:6,marginTop:8},searchRow:{flexDirection:"row",alignItems:"center",gap:8},headerSubRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginTop:6,paddingHorizontal:2},resultCount:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.grayTextWeak},sortLabel:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.brandPurple},listContent:{padding:12,paddingBottom:36},card:{backgroundColor:AppColors_1.AppColors.white,borderRadius:12,padding:12,marginBottom:10,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.primaryBlack,shadowOffset:{width:0,height:1},shadowOpacity:.04,shadowRadius:4,elevation:2},cardRecentlyUpdated:{borderColor:`${AppColors_1.AppColors.brandPurple}66`,backgroundColor:AppColors_1.AppColors.purpleTintBg},cardHeader:{flexDirection:"row",alignItems:"center",gap:8,marginBottom:8},sliceBadge:{backgroundColor:AppColors_1.AppColors.violetSoftBg,paddingHorizontal:6,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.violetSoftBorder},sliceBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:AppColors_1.AppColors.purple700,letterSpacing:.4},sliceName:{flex:1,fontFamily:AppFonts_1.AppFonts.interBold,fontSize:13.5,color:AppColors_1.AppColors.primaryBlack},timePill:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${AppColors_1.AppColors.purple}14`,paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1,borderColor:`${AppColors_1.AppColors.purple}2E`},timeText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10,color:AppColors_1.AppColors.purple},statsRow:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap",marginBottom:6},pill:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:AppColors_1.AppColors.grayBackground,paddingHorizontal:7,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},pillLabel:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.grayTextWeak},pillValue:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,color:AppColors_1.AppColors.primaryBlack},livePill:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:AppColors_1.AppColors.emeraldBg,paddingHorizontal:6,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.emeraldBorder},liveDot:{width:6,height:6,borderRadius:3,backgroundColor:AppColors_1.AppColors.emerald500},livePillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10,color:AppColors_1.AppColors.emerald700},loadingPill:{backgroundColor:AppColors_1.AppColors.amber100,paddingHorizontal:6,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.amber200},loadingPillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:AppColors_1.AppColors.amber800Warm},errorPill:{backgroundColor:AppColors_1.AppColors.red100,paddingHorizontal:6,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.errorBorder},errorPillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,color:AppColors_1.AppColors.red600},emptyPill:{backgroundColor:AppColors_1.AppColors.grayBackground,paddingHorizontal:6,paddingVertical:3,borderRadius:5,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},emptyPillText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak},lastActionRow:{flexDirection:"row",alignItems:"center",gap:5,backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:6,paddingHorizontal:8,paddingVertical:5,marginTop:4,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor},lastActionLabel:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.grayTextWeak},lastActionValue:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:11,color:AppColors_1.AppColors.primaryBlack},payloadPreviewText:{flex:1,fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:10,color:AppColors_1.AppColors.grayTextWeak,marginLeft:4},highlight:{backgroundColor:AppColors_1.AppColors.yellow200,color:AppColors_1.AppColors.yellow800,fontFamily:AppFonts_1.AppFonts.interBold},pausedBannerPill:{backgroundColor:AppColors_1.AppColors.amber100,paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1,borderColor:AppColors_1.AppColors.amber200},pausedBannerText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,color:AppColors_1.AppColors.amber800Warm,letterSpacing:.5}});exports.default=ReduxTab;