(() => {
  const {useState,useEffect}=React,Original=window.Settings;
  function Settings(){
    const [data,setData]=useState(null),[message,setMessage]=useState(''),[connect,setConnect]=useState(false),[busy,setBusy]=useState(false);
    const load=async()=>{try{const [me,accounts,connections]=await Promise.all([window.NGM.api('GET','/me'),window.NGM.api('GET','/accounts'),window.NGM.api('GET','/connections')]);setData({me,accounts,connections});}catch(e){setMessage(e.message);}};
    useEffect(()=>{load();},[]);
    const refresh=async id=>{setBusy(true);setMessage('');try{await window.NGM.api('POST',`/connections/${id}/sync`,{});await load();setMessage('Bank check completed. Available updates have been retrieved.');}catch(e){setMessage(e.message);}finally{setBusy(false);}};
    return <div className="rich-life ngm-controls"><h1>Settings</h1><p role="status">{message}</p>{!data?<p>Loading your household…</p>:<><section className="rl-panel"><h2>Your household</h2><p>Signed in as {data.me.user.email||'household member'}.</p><p>Account role: {data.me.user.role||'member'}.</p></section><section className="rl-panel"><h2>Financial permissions</h2><p>Advisors can read and recommend. Approving an advisor configuration does not authorize financial actions.</p><p>Spending-plan changes require explicit approval. Bill payment submission is unavailable until a payment provider is connected; bank/biller handoff is available.</p></section><section className="rl-panel"><h2>Bank connections</h2><p>Daily check: 9:05 a.m. Eastern. Actual data availability depends on your bank.</p><button onClick={()=>setConnect(true)}>Connect a bank</button>{data.connections.filter(c=>c.source==='plaid').map(c=><div className="rl-row" key={c.id}><span>{c.name||c.institutionName||'Linked bank'}<small>{c.morningSyncStatus||c.status||'Status unavailable'} · {c.morningAttemptAt?new Date(c.morningAttemptAt).toLocaleString():'No morning check recorded'}</small></span><button disabled={busy} onClick={()=>refresh(c.id)}>Check for updates</button></div>)}</section><section className="rl-panel"><h2>Accounts</h2>{data.accounts.filter(a=>!a.archived).map(a=><div className="rl-row" key={a.id}><span>{a.name}<small>{a.kind}{a.mask?` · ending ${a.mask}`:''}</small></span><span>{a.balanceAsOf?new Date(a.balanceAsOf).toLocaleString():'Refresh date unavailable'}</span></div>)}</section><section className="rl-panel"><h2>Document agent access</h2><p>Create and revoke import credentials from Library. Credentials are scoped to document access; they cannot approve or execute financial actions.</p></section></>}{window.PlaidConnectFlow&&<window.PlaidConnectFlow open={connect} live={true} onClose={()=>setConnect(false)} onComplete={()=>{setConnect(false);load();}}/>}</div>;
  }
  window.Settings=props=>window.NGM?.live()?<Settings {...props}/>:React.createElement(Original,props);
})();
