// tab-toolbox.jsx — Toolbox, redesigned as two focused views:
// Assets → the fundraising asset library (search · status filter · category
// chips · click-to-open tiles · modal editor). Backed by `assets`.
// Gives → Monthly Gives review (the research piece touch 2 shares):
// approved give pinned on top, candidates by month below.
// Same data API as before (RaiseLiveData.assets/gives); presentation only.
const { useState, useEffect, useMemo } = React;
const TS = window.RaiseShell;
const CAT_ORDER = ['Investor Documents','Value-Add Tools','Webinars & Presentations','Outreach Assets','Links & Accounts'];
const KINDS = ['doc','deck','tool','page','link','sheet'];
const KIND_META = {
doc: { c:'var(--primary)', glyph:'▤', label:'Document' },
deck: { c:'#8159bf', glyph:'▦', label:'Deck' },
tool: { c:'#1d9e75', glyph:'⚙', label:'Tool' },
page: { c:'#ba7517', glyph:'◫', label:'Page' },
link: { c:'#3f9560', glyph:'↗', label:'Link' },
sheet:{ c:'var(--ink-3)', glyph:'▥', label:'Sheet' },
};
const kindMeta = (k)=> KIND_META[k] || KIND_META.doc;
function useLiveTick(){
const [, force] = useState(0);
useEffect(()=>{ const h=()=>force(x=>x+1); window.addEventListener('raise-livedata', h); return ()=>window.removeEventListener('raise-livedata', h); }, []);
}
const openUrl = (u)=>{ if(u) window.open(u, '_blank', 'noopener'); };
const copyPath = (p)=>{ if(!p) return; try{ navigator.clipboard.writeText(p); TS.toast('Path copied — paste in Finder (Cmd+Shift+G)'); }catch(_){ TS.toast(p); } };
// ── shared field style ──────────────────────────────────────────────────────
const inStyle = {fontSize:13, padding:'7px 9px', border:'1px solid var(--line,#e7e2d7)', borderRadius:8, background:'var(--surface,#fff)', color:'var(--ink)', width:'100%', boxSizing:'border-box'};
const labStyle = {fontSize:11, fontWeight:600, color:'var(--ink-3)', textTransform:'uppercase', letterSpacing:.4, display:'block', marginBottom:4};
// ── asset editor: centered modal (never shoves the library around) ──────────
function AssetModal({ initial, cats, onClose }){
const RLD = window.RaiseLiveData;
const [a, setA] = useState(initial);
const [busy, setBusy] = useState(false);
const set = (k,v)=> setA(x=>({ ...x, [k]:v }));
const save = ()=>{
if(!a.name || !a.name.trim()){ TS.toast('Name required'); return; }
setBusy(true);
const payload = { name:a.name.trim(), category:a.category, kind:a.kind, status:a.status, url:(a.url||'').trim()||null, path:(a.path||'').trim()||null };
const p = a.isNew ? RLD.addAsset(payload) : RLD.patchAsset(a.id, payload);
Promise.resolve(p).then(()=>{ setBusy(false); TS.toast('Saved ✓'); onClose(); })
.catch(()=>{ setBusy(false); TS.toast('Could not save'); });
};
const del = ()=>{
if(!window.confirm('Remove "'+(a.name||'this item')+'" from the toolbox?')) return;
setBusy(true);
RLD.deleteAsset(a.id).then(()=>{ setBusy(false); TS.toast('Removed'); onClose(); })
.catch(()=>{ setBusy(false); TS.toast('Could not remove'); });
};
return (
e.stopPropagation()}
style={{width:520, maxWidth:'94vw', maxHeight:'88vh', overflow:'auto', background:'var(--surface,#fff)', border:'1px solid var(--line,#e6dfd4)', borderRadius:14, boxShadow:'0 24px 60px rgba(0,0,0,.24)', padding:20}}>
{a.isNew?'Add to toolbox':'Edit item'}
Name
set('name', e.target.value)}
onKeyDown={e=>{ if(e.key==='Enter') save(); }} />
Category
Type
Link (URL)
set('url', e.target.value)} />
Local path
set('path', e.target.value)} />
Status
{[['made','✓ Made'],['todo','To make']].map(([v,l])=>(
))}
{!a.isNew && }
);
}
// ── one asset card: the CARD is the action (open link / copy path) ──────────
function AssetTile({ a, live, onEdit }){
const RLD = window.RaiseLiveData;
const km = kindMeta(a.kind);
const primary = a.url ? 'open' : a.path ? 'copy' : 'edit';
const act = ()=>{ if(primary==='open') openUrl(a.url); else if(primary==='copy') copyPath(a.path); else onEdit(a); };
const toggle = (e)=>{ e.stopPropagation(); if(!live) return;
RLD.patchAsset(a.id,{status:a.status==='made'?'todo':'made'})
.then(()=>TS.toast(a.status==='made'?'Marked to-make':'Marked made ✓')).catch(()=>TS.toast('Could not save')); };
const made = a.status==='made';
const sub = a.url ? a.url.replace(/^https?:\/\/(www\.)?/,'') : (a.path || '');
return (
{km.glyph}
{a.name}
{sub &&
{sub}
}
{primary==='open'?'Open ↗':primary==='copy'?'Click to copy path':'Add a link or path'}
{a.url && a.path && }
);
}
// ── Assets view: search · status filter · category chips · grouped grid ─────
function AssetsView(){
const RLD = window.RaiseLiveData;
const live = !!(RLD && RLD.assets);
const assets = live ? RLD.assets() : [];
const [q, setQ] = useState('');
const [statusF, setStatusF] = useState('all'); // all | made | todo
const [catF, setCatF] = useState('all');
const [edit, setEdit] = useState(null);
const cats = useMemo(()=>[...CAT_ORDER, ...Array.from(new Set(assets.map(a=>a.category))).filter(c=>!CAT_ORDER.includes(c))], [assets.length]);
const filtered = useMemo(()=>{
const s = q.trim().toLowerCase();
return assets.filter(a=>
(statusF==='all' || a.status===statusF) &&
(catF==='all' || a.category===catF) &&
(!s || (a.name+' '+(a.url||'')+' '+(a.path||'')+' '+a.category).toLowerCase().includes(s)));
}, [assets, q, statusF, catF]);
const made = assets.filter(a=>a.status==='made').length;
const todoN = assets.length - made;
const chip = (on)=>({fontSize:12, padding:'4px 11px', borderRadius:20, cursor:'pointer', whiteSpace:'nowrap',
border:'1px solid '+(on?'var(--primary,#c96442)':'var(--line,#e7e2d7)'),
background:on?'rgba(201,100,66,.08)':'transparent', color:on?'var(--primary)':'var(--ink-2)', fontWeight:on?600:400});
return (
<>
{/* toolbar: search + status + add */}
setQ(e.target.value)} placeholder="Search assets…"
style={{...inStyle, paddingLeft:30}} />
⌕
{q && }
{/* category chips */}
{cats.map(c=>{
const n = assets.filter(a=>a.category===c).length;
if(!n) return null;
return ;
})}
{!live && Sign in to load your toolbox.
}
{live && assets.length===0 && (
Your toolbox is empty
Add the assets you send LPs and partners — decks, one-pagers, data-room links, tools.
)}
{live && assets.length>0 && filtered.length===0 && (
Nothing matches{q?' “'+q+'”':''} — clear the filters above.
)}
{cats.map(cat=>{
if(catF!=='all' && catF!==cat) return null;
const items = filtered.filter(a=>a.category===cat);
if(!items.length) return null;
const cm = items.filter(a=>a.status==='made').length;
return (
{cat}
{cm}/{items.length} made
);
})}
{edit && setEdit(null)} />}
);
}
// ── Gives view: approved give pinned, candidates by month ───────────────────
function GivesView(){
const RLD = window.RaiseLiveData;
const [busy, setBusy] = useState(null);
const [findOpen, setFindOpen] = useState(false);
const [angle, setAngle] = useState('');
const [searching, setSearching] = useState(false);
const [showArchived, setShowArchived] = useState(false);
useEffect(()=>{ if(RLD && RLD.loadGives && !RLD._givesOk) RLD.loadGives(); }, []);
const live = !!(RLD && RLD.gives);
const all = live ? RLD.gives() : [];
const gives = all.filter(g=> showArchived ? true : g.status!=='archived');
const approved = all.filter(g=>g.status==='approved')
.sort((a,b)=> String(b.month||'').localeCompare(String(a.month||'')));
const findMore = ()=>{
setSearching(true);
Promise.resolve(RLD.requestGiveScout(angle)).then(r=>{
setSearching(false); setFindOpen(false); setAngle('');
TS.toast(r&&r.ok ? 'Searching — new options appear here in a few minutes' : 'Could not start search');
});
};
const approve = (g)=>{ setBusy(g.id); Promise.resolve(RLD.approveGive(g)).then(r=>{ setBusy(null); TS.toast(r&&r.ok?'Approved — now sending in outreach ✓':'Could not approve'); }); };
const archive = (g)=>{ setBusy(g.id); Promise.resolve(RLD.setGiveStatus(g.id,'archived')).then(()=>{ setBusy(null); TS.toast('Archived'); }).catch(()=>{ setBusy(null); TS.toast('Could not save'); }); };
const restore = (g)=>{ setBusy(g.id); Promise.resolve(RLD.setGiveStatus(g.id,'candidate')).then(()=>{ setBusy(null); TS.toast('Restored to candidates'); }).catch(()=>{ setBusy(null); TS.toast('Could not save'); }); };
const fmtMonth = (m)=>{ try{ const [y,mo]=m.split('-'); return new Date(y, mo-1, 1).toLocaleString('en-US',{month:'long',year:'numeric'}); }catch(_){ return m; } };
const Card = ({ g })=>{
const isAppr = g.status==='approved';
const isArch = g.status==='archived';
return (
{g.rating!=null && {g.rating}/10}
{g.topic && {g.topic}}
{isAppr?'✓ Approved · sending now':isArch?'archived':'candidate'}
{g.title}
{g.hook &&
{g.hook}
}
{g.source &&
{g.source}
}
{!isAppr && !isArch && }
{g.url && }
{isArch
?
: }
);
};
const months = Array.from(new Set(gives.filter(g=>g.status!=='approved').map(g=>g.month))).sort().reverse();
return (
<>
The give is the research piece outreach touch 2 shares — approve one per month so drafts never invent content.
{findOpen && (
Pull a fresh batch — optionally steer the angle:
setAngle(e.target.value)} placeholder="e.g. exchange funds, RSU timing (optional)"
style={{...inStyle, flex:1, minWidth:200, width:'auto'}} onKeyDown={e=>{ if(e.key==='Enter') findMore(); }} />
)}
{!live && Sign in to load your gives.
}
{live && !all.length && No gives yet — hit “Find more” to pull a batch, or wait for the monthly scout.
}
{approved.length>0 && (
SENDING NOW
{approved.map(g=> )}
)}
{months.map(m=>{
const items = gives.filter(g=>g.month===m && g.status!=='approved').sort((a,b)=>(b.rating||0)-(a.rating||0));
if(!items.length) return null;
return (
{fmtMonth(m)}
{items.map(g=> )}
);
})}
);
}
// ── main: two subviews behind a segmented toggle ────────────────────────────
function TabToolbox(){
const RLD = window.RaiseLiveData;
useLiveTick();
useEffect(()=>{ if(RLD && RLD.loadAssets && !RLD._assetsOk) RLD.loadAssets(); }, []);
const [view, setView] = useState(()=> localStorage.getItem('raiseos.toolbox.view') || 'assets');
const goV = (v)=>{ setView(v); try{ localStorage.setItem('raiseos.toolbox.view', v); }catch(_){} };
const assets = (RLD && RLD.assets) ? RLD.assets() : [];
const made = assets.filter(a=>a.status==='made').length;
const approvedN = (RLD && RLD.gives) ? RLD.gives().filter(g=>g.status==='approved').length : 0;
return (
<>
{view==='assets' && assets.length>0 && {made}/{assets.length} made
}
);
}
window.TabToolbox = TabToolbox;