import{r as i,q as p,j as e,c as N}from"./index-CUDottTv.js";import{T as S}from"./topbar-892TvyNb.js";import{B as u}from"./badge-BOfEUuSW.js";import"./textarea-DAwdLdON.js";import{D as w}from"./detail-panel-YWSVnqP_.js";import{J as o}from"./json-viewer-Dup5M0px.js";import{E as I}from"./empty-config-state-ReVUjdJ_.js";import{u as k}from"./use-connected-3Ljk-Uwv.js";import{b as f}from"./format-CF_gowqw.js";import"./chevron-right-Df1qu9CE.js";function z(){var m,x;const[l,b]=i.useState("mutations"),[n,c]=i.useState(null);k();const h=p(t=>t.initialLoadDone),r=p(t=>t.state),j=i.useMemo(()=>{const t=new Map;for(const s of r){const d=t.get(s.storeId);d?(d.count++,d.lastUpdate=Math.max(d.lastUpdate,s.timestamp)):t.set(s.storeId,{id:s.storeId,library:s.library,count:1,lastUpdate:s.timestamp})}return Array.from(t.values())},[r]),v=i.useMemo(()=>{const t=new Map;for(const s of r)t.set(s.storeId,s);return t},[r]),g=i.useMemo(()=>r.filter(t=>t.phase==="update"),[r]),a=i.useMemo(()=>n?r.find(t=>t.eventId===n)??null:null,[r,n]),y=i.useCallback(()=>c(null),[]);return e.jsxs("div",{className:"flex-1 flex flex-col min-h-0 overflow-hidden",children:[e.jsx(S,{tabs:[{id:"stores",label:"Stores"},{id:"mutations",label:"Mutations"}],activeTab:l,onTabChange:b}),e.jsxs("div",{className:"flex-1 flex min-h-0 overflow-hidden",children:[e.jsx("div",{className:"flex-1 overflow-y-auto",children:h&&r.length===0?e.jsx(I,{title:"No State Data",description:"State tracking captures Zustand and Redux store mutations with diffs, action history, and the full state tree.",configHints:[{key:"stores",value:"{ myStore: useMyStore }",description:"Pass your Zustand/Redux store references"}]}):e.jsxs(e.Fragment,{children:[l==="stores"&&e.jsx("div",{className:"p-5 space-y-3",children:j.map(t=>{var s;return e.jsxs("div",{className:"bg-bg-surface border border-border-strong rounded-lg p-4",children:[e.jsxs("div",{className:"flex items-center justify-between mb-3",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-[15px] font-semibold text-text-primary",children:t.id}),e.jsx(u,{variant:"purple",size:"sm",children:t.library})]}),e.jsxs("span",{className:"text-[11px] text-text-muted",children:[t.count," updates"]})]}),e.jsx("div",{className:"bg-bg-surface rounded-md p-3 border border-border-muted",children:e.jsx(o,{data:(s=v.get(t.id))==null?void 0:s.state,defaultExpanded:!1})})]},t.id)})}),l==="mutations"&&e.jsx("div",{className:"divide-y divide-border-muted",children:g.map((t,s)=>{var d;return e.jsxs("div",{onClick:()=>c(t.eventId),className:N("flex items-start gap-3 px-5 py-3 cursor-pointer transition-colors hover:bg-bg-hover",n===t.eventId&&"bg-bg-active"),children:[e.jsx(u,{variant:"purple",size:"sm",children:t.storeId}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsx("p",{className:"text-[13px] text-text-primary",children:((d=t.action)==null?void 0:d.type)||"update"}),t.diff&&e.jsxs("p",{className:"text-[11px] text-text-muted mt-0.5 truncate",children:["Changed: ",Object.keys(t.diff).join(", ")]})]}),e.jsx("span",{className:"text-[11px] font-mono text-text-muted tabular-nums shrink-0",children:f(t.timestamp)})]},`${t.eventId}-${s}`)})})]})}),e.jsx(w,{open:a!==null,onClose:y,title:a?`${a.storeId} — ${((m=a.action)==null?void 0:m.type)||"update"}`:"",subtitle:a?f(a.timestamp):"",children:a&&e.jsxs("div",{className:"p-4 space-y-4",children:[a.diff&&e.jsxs("div",{children:[e.jsx("p",{className:"text-[11px] font-medium text-text-muted uppercase tracking-wider mb-2",children:"Changes"}),e.jsx("div",{className:"bg-bg-elevated rounded-md p-3 border border-border-muted",children:e.jsx(o,{data:a.diff,defaultExpanded:!0})})]}),((x=a.action)==null?void 0:x.payload)!=null&&e.jsxs("div",{children:[e.jsx("p",{className:"text-[11px] font-medium text-text-muted uppercase tracking-wider mb-2",children:"Action Payload"}),e.jsx("div",{className:"bg-bg-elevated rounded-md p-3 border border-border-muted",children:e.jsx(o,{data:a.action.payload,defaultExpanded:!0})})]}),e.jsxs("div",{children:[e.jsx("p",{className:"text-[11px] font-medium text-text-muted uppercase tracking-wider mb-2",children:"Current State"}),e.jsx("div",{className:"bg-bg-elevated rounded-md p-3 border border-border-muted",children:e.jsx(o,{data:a.state,defaultExpanded:!1})})]})]})})]})]})}export{z as StatePage};
