// tab-outreach.jsx — Outreach = one screen: Today's outreach queue.
// Sequences + Scripts stay reachable but quiet (the machinery behind the queue).
const { useState: useStateOX, useEffect: useEffectOX } = React;
const ROS = window.RaiseShell;

function TabOutreach(){
  const { TopBar } = ROS;
  const [view, setView] = useStateOX(() => { const v = localStorage.getItem('raiseos.outreach.view'); return (!v || v==='coach' || v==='compose') ? 'today' : v; });
  const goV = (v)=>{ setView(v); localStorage.setItem('raiseos.outreach.view', v); };
  useEffectOX(()=>{ window.__oxSetView = goV; return ()=>{ if(window.__oxSetView===goV) delete window.__oxSetView; }; });
  return (
    <>
      <TopBar title="Outreach" sub="who to message today">
        <div className="seg2" style={{marginRight:4}}>
          <button className={view==='today'?'on':''} onClick={()=>goV('today')}>Today</button>
          <button className={view==='seq'?'on':''} onClick={()=>goV('seq')}>Sequences</button>
          <button className={view==='scripts'?'on':''} onClick={()=>goV('scripts')}>Scripts</button>
        </div>
        <button className="btn sm" onClick={()=>ROS.toast('Opening Gmail Drafts ↗')}>Gmail Drafts ↗</button>
      </TopBar>
      {view==='today' && <window.OXConsole/>}
      {view==='seq' && <window.OXSequences/>}
      {view==='coach' && <window.OXComposer/>}
      {view==='scripts' && <window.OXVault/>}
    </>
  );
}
window.TabOutreach = TabOutreach;