); } function CloseBtn({ onClose, dark }) { return ( ); } function KV({ k, v, mono=true }) { return (

{k}

{v}

); } const toast = (msg, tone='ok') => window.dispatchEvent(new CustomEvent('astro-toast',{detail:{msg, tone}})); // ── RELEASE DRAWER ───────────────────────────────────────────── function ReleaseDrawer({ r, onClose, go }) { // Resolve the parent release group + all its editions. // Even when r is a single-edition release, we treat it as a group of 1 // so we get a consistent shape; the UI collapses gracefully when count===1. const editions = (window.editionsOfGroup ? window.editionsOfGroup(r.groupId || r.id) : null) || [r]; const group = (window.releaseGroupOf && window.releaseGroupOf(r)) || { title:r.title, artist:r.artist, label:r.label, type:r.type, art:r.art, originalDate:r.date, genre:r.genre, marketingLabel:r.label, }; const earliestLive = editions.find(e => e.status === 'live') || editions[0]; const headerDate = earliestLive ? earliestLive.date : (group.originalDate || r.date); // Selected edition state — defaults to the one the user clicked through with. const [selEdId, setSelEdId] = React.useState(r.id); const sel = editions.find(e => e.id === selEdId) || r; const isMulti = editions.length > 1; // Tracklist for the SELECTED edition — synthesized from the rich graph if present. const recs = (typeof RECORDING_GRAPH !== 'undefined') ? RECORDING_GRAPH.filter(x => (x.releaseIds||[]).includes(sel.id) || (x.releaseIds||[]).includes(r.id)).slice(0, sel.tracks) : []; const tracks = Array.from({length: sel.tracks}, (_,i) => recs[i] || { id: `${sel.id}_t${i+1}`, title: `Track ${i+1}`, artist: sel.artist, duration: 180+Math.round(Math.random()*120), }); const dsps = ['Spotify','Apple Music','YouTube Music','Amazon','Tidal','Deezer','Pandora','SoundCloud', 'Anghami','Boomplay','NetEase','QQ Music','Yandex','VK']; const delivered = sel.dsps; // Format chip — colored bar for each format type, like the mocks const fmtTone = (f) => ({ Digital: {bg:'#f4d6c8', fg:'#7a3a1c'}, CD: {bg:'#dfe7f4', fg:'#2a4d8f'}, Vinyl: {bg:'#e0eef6', fg:'#1c5571'}, Cassette: {bg:'#f1e5cf', fg:'#6b4a1c'}, DVD: {bg:'#ecdcec', fg:'#5c2a8a'}, })[f] || {bg:'var(--bg-2)', fg:'var(--ink-3)'}; const FormatChip = ({f}) => { const t = fmtTone(f); return ( {f || '—'} ); }; const StatusPill = ({s}) => { const tone = s === 'live' ? 'ok' : s === 'taken-down' ? 'soft' : 'accent'; return {(s||'live').toUpperCase()}; }; const fmtUpc = (u) => u ? u.replace(/(\d{1})(\d{4})(\d{4})(\d{1})/, '$1 $2 $3 $4') : '—'; const fmtDate = (d) => { if (!d) return '—'; const dt = new Date(d); return dt.toLocaleDateString('en-US',{month:'short',day:'numeric',year:'2-digit'}); }; const fmtPrice = (p) => p != null ? `$${p.toFixed(2)}` : '—'; return ( {/* Hero — album cover */}

RELEASE {isMulti && {editions.length} EDITIONS} {group.type} {group.genre && · {group.genre}}

{group.title}

{group.artist} · {group.marketingLabel || group.label} · {fmtDate(headerDate)}

{sel.tracks} tracks{sel.editionLabel?` · ${sel.editionLabel}`:''}

{window.DetailDelete && ( onClose && onClose()} /> )}

{/* EDITIONS LIST — only when there are multiple */} {isMulti && (

EDITIONS · {editions.length}

{['EDITION','FORMAT','UPC','TERRITORY','RELEASED','STATUS'].map(h=>( {h} ))}

{editions.map(ed => { const active = ed.id === selEdId; return (

setSelEdId(active ? null : ed.id)} style={{display:'grid',gridTemplateColumns:'1fr 78px 124px 88px 70px 56px',gap:10, padding:'13px 0',borderBottom: active ? 'none' : '1px solid var(--rule-soft)', cursor:'pointer',alignItems:'center', background: active ? 'var(--bg-2)' : 'transparent', marginLeft: active ? -28 : 0, marginRight: active ? -28 : 0, paddingLeft: active ? 28 : 0, paddingRight: active ? 28 : 0, borderLeft: active ? '3px solid var(--accent)' : '3px solid transparent'}}>

{ed.editionLabel || 'Edition'}

{ed.bonusTracks > 0 &&

+{ed.bonusTracks} bonus tracks

}

{fmtUpc(ed.upc)} {ed.territory || 'Worldwide'} {fmtDate(ed.date)}

{/* Inline expanded detail */} {active && (

{[ ['UPC', fmtUpc(ed.upc)], ['FORMAT', ed.format || '—'], ['TERRITORY', ed.territory || 'Worldwide'], ['RELEASE DATE', new Date(ed.date).toLocaleDateString('en-US',{month:'long',day:'numeric',year:'numeric'})], ['RETAIL PRICE', fmtPrice(ed.retailPrice)], ['TRACKS', String(ed.tracks)], ].map(([k,v])=>(

{k}

{v}

))}

0?14:0}}>

℗ LINE

{ed.pLine || '—'}

{ed.cLine || '—'}

{(ed.dspList||[]).length > 0 && (

DISTRIBUTED TO · {ed.dsps}/14

{ed.dspList.map(d=>( {d} ))}

)}

)} ); })}

)} {/* IDs — only when single-edition (otherwise it's covered by the editions panel) */} {!isMulti && (

IDENTIFIERS

)} {/* Tracklist — for the SELECTED edition */}

TRACKLIST · {sel.tracks}{isMulti?` · ${sel.editionLabel}`:''}

{tracks.map((t,i)=>{ const isReal = !!t.isrc; return (

{ onClose(); window.dispatchEvent(new CustomEvent('astro-open-recording',{detail:{id:t.id}})); } : undefined} style={{display:'grid',gridTemplateColumns:'24px 1fr 60px 14px',gap:12, padding:'10px 0',borderBottom:'1px solid var(--rule-soft)',alignItems:'center', cursor: isReal ? 'pointer' : 'default'}} onMouseEnter={e=>{if(isReal) e.currentTarget.style.background='var(--bg-2)'}} onMouseLeave={e=>{if(isReal) e.currentTarget.style.background='transparent'}}> {String(i+1).padStart(2,'0')}

{t.title}

{isReal &&

{(window.isrcDisplay ? window.isrcDisplay(t.isrc) : t.isrc)}

}

{Math.floor(t.duration/60)}:{String(t.duration%60).padStart(2,'0')} {isReal ? : }

); })}

{/* Platform popularity */} {(() => { const pop = (window.RELEASE_PLATFORM_DETAILS || {})[r.id]; if (!pop) return null; const tiles = [ {l:'SPOTIFY', c:'#1ed760', v:pop.spotifyPopularity, max:100, sub:pop.spotifyAlbumType}, {l:'TIDAL', c:'#000000', v:pop.tidalPopularity, max:100, sub:pop.tidalQuality}, {l:'QOBUZ', c:'#0070d8', v:pop.qobuzPopularity, max:100, sub:pop.qobuzHires?'Hi-Res':null}, {l:'AM', c:'#fa233b', v:pop.appleMusicScore, max:100, sub:pop.appleHasAtmos?'Atmos':null}, ].filter(t => t.v != null); if (tiles.length === 0) return null; return (

PLATFORM POPULARITY

{pop.lastUpdated &&

updated {pop.lastUpdated}

}

{tiles.map((t,i)=>(

{t.l}

{t.v}/{t.max}

{t.sub &&

{t.sub}

}

))}

{(pop.spotifyTotalTracks || pop.tidalNumTracks) && (

{pop.spotifyAlbumType && Spotify type · {pop.spotifyAlbumType}} {pop.spotifyTotalTracks && {pop.spotifyTotalTracks} tracks on Spotify} {pop.tidalNumVolumes && {pop.tidalNumVolumes} volume{pop.tidalNumVolumes>1?'s':''} on Tidal} {pop.qobuzMaximumBitDepth && {pop.qobuzMaximumBitDepth}-bit / {pop.qobuzMaximumSamplingRate} kHz on Qobuz}

)}

); })()} {/* Top territories */} {(() => { const terr = (window.RELEASE_TERRITORY_POPULARITY || {})[r.id]; if (!terr || !terr.length) return null; const flagFor = (iso) => (window.REF?.territoryByIso2?.get?.(iso))?.flag_emoji || ''; const max = Math.max(...terr.map(t => t.pop)); return (

TOP TERRITORIES · {terr.length}

{terr.map((t,i)=>(

{flagFor(t.iso) || '•'}

{t.name}

{t.iso}

POP {t.pop} {t.share}%

))}

); })()} {/* DSP delivery — for the SELECTED edition */}

DSP DELIVERY · {delivered}/14{isMulti?` · ${sel.editionLabel}`:''}

{dsps.map((d,i)=>{ const live = i < delivered; return (

{d} {!live && QUEUED}

); })}

{/* Footer actions */}

); } // ── PUBLISHER DRAWER ─────────────────────────────────────────── function PublisherDrawer({ p, onClose, go, initialEditMode }) { const recentRoyalty = '$' + (Math.round(p.works * 124.7)).toLocaleString(); const sampleWorks = (typeof WORKS !== 'undefined' ? WORKS.slice(0,5) : []); // ── Reconcile-statement state ──────────────────────────────── // Reconciliation matches an inbound publisher statement (CWR/DDEX/CSV) against // our expected royalties for a period. Three phases: setup → running → results. const [recon, setRecon] = React.useState(null); // recon shape: // { phase:'setup', period, format, file, expected } // { phase:'running', period, format, file, expected, lines:[{title,iswc,expected,reported,status}], idx } // { phase:'results', ...same, finishedAt, totals:{matched,short,over,missing} } // Build a deterministic 12-line sample reconciliation set for this publisher const buildReconLines = React.useCallback(() => { const seed = (p.cae || p.name || 'x').split('').reduce((a,c)=>(a*31+c.charCodeAt(0))>>>0, 7); const works = (typeof WORKS !== 'undefined' ? WORKS.slice(0, 12) : Array.from({length:12}).map((_,i)=>({title:`Work ${i+1}`, iswc:`T-000.000.${String(100+i)}-0`}))); return works.slice(0, 12).map((w, i) => { const r = ((seed * (i+3) * 1103515245 + 12345) >>> 0) % 100; const expected = 200 + ((seed >> (i%8)) & 0x7ff); // $200–$2247 let reported, status; if (r < 62) { reported = expected; status = 'matched'; } else if (r < 78) { reported = Math.round(expected * 0.92); status = 'short'; } else if (r < 90) { reported = Math.round(expected * 1.06); status = 'over'; } else { reported = 0; status = 'missing';} return { title: w.title, iswc: w.iswc, expected, reported, status }; }); }, [p.cae, p.name]); // Run the reconciliation animation: tick through `lines` one at a time. React.useEffect(() => { if (!recon || recon.phase !== 'running') return; if (recon.idx >= recon.lines.length) { const totals = recon.lines.reduce((a, l) => { a[l.status]++; return a; }, { matched:0, short:0, over:0, missing:0 }); setRecon(c => c ? {...c, phase:'results', finishedAt:new Date().toLocaleTimeString(), totals} : c); return; } const t = setTimeout(() => setRecon(c => c ? {...c, idx: c.idx+1} : c), 180); return () => clearTimeout(t); }, [recon]); const openRecon = () => { const lines = buildReconLines(); const expected = lines.reduce((s,l)=>s+l.expected, 0); setRecon({ phase:'setup', period:'Q1 2026', format:'CWR statement', file:null, expected, lines }); }; const startRecon = () => setRecon(c => c ? {...c, phase:'running', idx:0} : c); // CSV export of reconciliation results const exportRecon = () => { if (!recon) return; const rows = [ ['publisher','period','format','title','iswc','expected_usd','reported_usd','variance_usd','status'], ...recon.lines.map(l => [ p.name, recon.period, recon.format, l.title, l.iswc, l.expected.toFixed(2), l.reported.toFixed(2), (l.reported - l.expected).toFixed(2), l.status, ]), ]; const csv = rows.map(r => r.map(c => /[",\n]/.test(String(c)) ? '"'+String(c).replace(/"/g,'""')+'"' : c).join(',')).join('\n'); const blob = new Blob([csv], { type:'text/csv;charset=utf-8' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = `reconciliation_${(p.name||'publisher').replace(/\s+/g,'_')}_${recon.period.replace(/\s+/g,'_')}.csv`; document.body.appendChild(a); a.click(); a.remove(); URL.revokeObjectURL(url); }; const [editMode, setEditMode] = React.useState(!!initialEditMode); // Working copy of every editable field. Mirrors the publisher record schema // plus a small contact block we lazily seed from the name. const [draft, setDraft] = React.useState({ name: p.name, aliases: p.aliases || '', cae: p.cae || '', isni: p.isni || '', dpid: p.dpid || '', submitterCode: p.submitterCode || '', pro: p.pro || '', territory: p.territory || 'Worldwide', parentPub: p.parentPub || '', administrator: p.administrator || '', contactName: p.contactName || 'Rights Department', contactRole: p.contactRole || 'Head of Publishing', contactEmail: p.contactEmail || ('rights@' + (p.name||'').toLowerCase().replace(/[^a-z0-9]/g,'') + '.com'), contactPhone: p.contactPhone || '', addr1: p.addr1 || p.address || '', addr2: p.addr2 || '', city: p.city || '', region: p.region || '', postal: p.postal || '', addrCountry: p.addrCountry || '', }); const setD = (k, v) => setDraft(d => ({...d, [k]: v})); const exitEdit = () => { // Persist edits back to the source publisher record so the directory grid, // tile lists, and other views see the changes immediately. Object.assign(p, draft); setEditMode(false); if (typeof toast === 'function') toast(`${draft.name} · changes saved`, 'ok'); }; // Inline publisher picker — searches the live PUBLISHERS list (excluding self), // shows IPI / PRO / works in the dropdown, lets the user pick an existing // publisher OR keep typing a new name (which is saved as plain text on the // record, ready to be promoted to a real publisher later). const PubPick = ({value, onChange, placeholder, allowSelf}) => { const all = (typeof PUBLISHERS !== 'undefined' ? PUBLISHERS : []); const pool = all.filter(x => x.id !== p.id); const [open, setOpen] = React.useState(false); const [hi, setHi] = React.useState(0); const [q, setQ] = React.useState(value || ''); const wrapRef = React.useRef(null); React.useEffect(()=>{ setQ(value||''); }, [value]); React.useEffect(() => { if (!open) return; const onDoc = (e) => { if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false); }; document.addEventListener('mousedown', onDoc); return () => document.removeEventListener('mousedown', onDoc); }, [open]); const ql = (q||'').trim().toLowerCase(); const matches = !ql ? pool.slice(0,10) : pool.filter(x => `${x.name} ${x.aliases||''} ${x.parent||''}`.toLowerCase().includes(ql)).slice(0,10); const linked = pool.find(x => x.name.toLowerCase() === ql); const isNew = q && q.trim() && !linked; const fld = {width:'100%',height:32,boxSizing:'border-box',fontSize:13,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)',lineHeight:'30px'}; const totalRows = matches.length + (isNew ? 1 : 0); return (

{ setQ(e.target.value); onChange(e.target.value); setOpen(true); setHi(0); }} onFocus={()=>{ setOpen(true); setHi(0); }} onKeyDown={(e)=>{ if (!open && (e.key==='ArrowDown'||e.key==='Enter')) { setOpen(true); e.preventDefault(); return; } if (e.key==='ArrowDown') { setHi(h=>Math.min(h+1,totalRows-1)); e.preventDefault(); } else if (e.key==='ArrowUp') { setHi(h=>Math.max(h-1,0)); e.preventDefault(); } else if (e.key==='Enter') { if (matches[hi]) { onChange(matches[hi].name); setQ(matches[hi].name); setOpen(false); } else if (isNew && hi === matches.length) { setOpen(false); /* keep typed value */ } e.preventDefault(); } else if (e.key==='Escape') { setOpen(false); } }} placeholder={placeholder || 'Search publishers…'} style={fld}/> {open && totalRows>0 && (

{matches.map((x,i)=>( ))} {isNew && ( )}

)}

); }; // Inline society picker — searches SOCIETIES (PRO/MRO/CMO) and stores the acronym. const SocietyPick = ({value, onChange}) => { const all = (typeof SOCIETIES !== 'undefined' ? SOCIETIES : []); const pool = all.filter(s => s.kind==='PRO'||s.kind==='MRO'||s.kind==='CMO'); const [open, setOpen] = React.useState(false); const [hi, setHi] = React.useState(0); const [q, setQ] = React.useState(value || ''); const wrapRef = React.useRef(null); React.useEffect(()=>{ setQ(value||''); }, [value]); React.useEffect(() => { if (!open) return; const onDoc = (e) => { if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false); }; document.addEventListener('mousedown', onDoc); return () => document.removeEventListener('mousedown', onDoc); }, [open]); const ql = (q||'').trim().toLowerCase(); const matches = !ql ? pool.slice(0,12) : pool.filter(s => `${s.acronym} ${s.name} ${s.territory||''}`.toLowerCase().includes(ql)).slice(0,12); const tone = (k) => k==='PRO' ? '#0a4a8c' : k==='MRO' ? '#9b6a18' : '#5a3d6e'; const fld = {width:'100%',height:32,boxSizing:'border-box',fontSize:13,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)',lineHeight:'30px'}; return (

{setQ(e.target.value); onChange(e.target.value); setOpen(true); setHi(0);}} onFocus={()=>{ setOpen(true); setHi(0); }} onKeyDown={(e)=>{ if (!open && (e.key==='ArrowDown'||e.key==='Enter')) { setOpen(true); e.preventDefault(); return; } if (e.key==='ArrowDown') { setHi(h=>Math.min(h+1,matches.length-1)); e.preventDefault(); } else if (e.key==='ArrowUp') { setHi(h=>Math.max(h-1,0)); e.preventDefault(); } else if (e.key==='Enter') { if (matches[hi]) { onChange(matches[hi].acronym); setQ(matches[hi].acronym); setOpen(false);} e.preventDefault(); } else if (e.key==='Escape') { setOpen(false); } }} placeholder="Search societies — ASCAP, PRS, SACEM…" className="ff-mono" style={fld}/> {open && matches.length>0 && (

{matches.map((s,i)=>( ))}

)}

); }; // Field shell — label above input. Used in editable rows. const fldStyle = {width:'100%',height:32,boxSizing:'border-box',fontSize:13,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)',lineHeight:'30px'}; const FieldLabel = ({children}) =>

{children}

; const TextField = ({label, value, onChange, mono=true, placeholder, maxLen, digitsOnly}) => ( {label} { let v = e.target.value; if (digitsOnly) v = v.replace(/[^\d]/g,''); if (maxLen) v = v.slice(0, maxLen); onChange(v); }} placeholder={placeholder} className={mono ? 'ff-mono' : ''} style={fldStyle} /> ); return ( {/* Hero */}

{/* Edit toggle — sits to the left of the close button */}

PUBLISHER · {editMode ? draft.cae || '—' : (p.cae || '—')}

{editMode ? ( setD('name', e.target.value)} className="ff-display" style={{fontSize:38,fontWeight:700,letterSpacing:'-0.04em',lineHeight:.95, background:'rgba(255,255,255,.08)',color:'inherit', border:'1px solid rgba(255,255,255,.3)',padding:'4px 8px',width:'100%', fontFamily:'inherit',outline:'none',boxSizing:'border-box'}} placeholder="Publisher name"/> ) : (

{window.PartyIndicator && }{p.name}

)} {!editMode && window.PartyIndicator && (

)} {editMode ? ( setD('aliases', e.target.value)} className="ff-mono" style={{fontSize:11,marginTop:10,opacity:.92, background:'rgba(255,255,255,.08)',color:'inherit', border:'1px solid rgba(255,255,255,.3)',padding:'3px 8px',width:'100%', fontFamily:'inherit',outline:'none',boxSizing:'border-box'}} placeholder="a.k.a. — comma-separated aliases"/> ) : (

a.k.a. {p.aliases || '—'}

)}

{editMode ? draft.territory : p.territory} SINCE {p.since}

{/* Big stats — read-only (derived) */}

{[ {l:'WORKS', v:p.works.toLocaleString()}, {l:'YTD ROYAL.', v:recentRoyalty}, {l:'AGREEMENTS', v:Math.max(2, Math.round(p.works/120))}, ].map((s,i,arr)=>(

{s.l}

{s.v}

))}

{/* Registry */}

REGISTRY

{editMode ? (

setD('cae', v)} placeholder="11-digit IPI" digitsOnly maxLen={11}/> setD('isni', v)} placeholder="0000 0000 0000 0000"/> setD('dpid', v)} placeholder="PA-DPIDA-..."/> setD('submitterCode', v.toUpperCase())} placeholder="3-char code" maxLen={3}/> PRO setD('pro', v)}/> TERRITORY {/* territory_groups (ref): 12 rows incl. Worldwide / European Union / North America / Latin America / Asia-Pacific etc. Free text fallback for legacy values like "US" / "UK". */} {(() => { const groups = (window.REF && window.REF.ready && window.REF.raw.territory_groups) || []; const opts = groups.length ? groups.map(g => g.group_name).filter(Boolean) : ['Worldwide','US','UK','EU','NA','APAC','LATAM']; const has = opts.some(o => o.toLowerCase() === (draft.territory||'').toLowerCase()); return ( ); })()}

) : (

)}

{/* Chain */}

CHAIN

{editMode ? (

PARENT PUBLISHER setD('parentPub', v)} placeholder="— · search the publisher directory"/>

{(() => { const all = (typeof PUBLISHERS!=='undefined' ? PUBLISHERS : []); const linked = all.find(x => x.id !== p.id && x.name.toLowerCase() === (draft.parentPub||'').trim().toLowerCase()); return linked ? <>↳ Linked to {linked.name} · {linked.cae ? `IPI ${linked.cae} · ` : ''}{(linked.works||0).toLocaleString()} works : draft.parentPub ? <>+ {draft.parentPub} isn't in the directory — saved as plain text. Add it later. : <>Optional. Leave blank if there is no parent publisher.; })()}

ADMINISTRATOR setD('administrator', v)} placeholder="— · blank = self-administered"/>

{(() => { const all = (typeof PUBLISHERS!=='undefined' ? PUBLISHERS : []); const linked = all.find(x => x.id !== p.id && x.name.toLowerCase() === (draft.administrator||'').trim().toLowerCase()); return linked ? <>↳ Linked to {linked.name} · admin handles registrations & collection. : draft.administrator ? <>+ {draft.administrator} isn't in the directory — saved as plain text. : <>Blank means self-administered. Only fill if a different publisher administers this catalog.; })()}

) : (

)}

{/* Contact */}

PRIMARY CONTACT

{editMode ? (

setD('contactName', v)} placeholder="e.g. Maya Okonkwo"/> setD('contactRole', v)} placeholder="Head of Publishing"/> EMAIL setD('contactEmail', v)} style={fldStyle} className="ff-mono"/> PHONE setD('contactPhone', v)} style={fldStyle} defaultCountry={draft.addrCountryIso || 'US'}/> {/* Address — country first, then street, then city/state/postal. Country is stored as ISO-2 in `addrCountryIso`; legacy `addrCountry` (common_name) is preserved for back-compat in the read view. */}

ADDRESS { // mirror ISO into common_name for back-compat reads const ts = (window.REF && window.REF.ready && window.REF.raw.territories) || []; const ctry = next.country_iso ? ts.find(t => t.iso_alpha_2 === next.country_iso) : null; setD('addrCountryIso', next.country_iso || ''); setD('addrCountry', ctry ? ctry.common_name : ''); setD('addr1', next.line1 || ''); setD('addr2', next.line2 || ''); setD('city', next.city || ''); setD('region', next.state || ''); setD('postal', next.postal_code || ''); }} style={fldStyle}/>

) : (() => { // Compose a tidy multi-line read-only address from whichever fields are set. // Fall back to the legacy `address` string so older records still render. const lines = [ p.addr1, p.addr2, [p.city, p.region, p.postal].filter(Boolean).join(', '), p.addrCountry, ].map(s => (s||'').trim()).filter(Boolean); const addrDisplay = lines.length ? lines : (p.address ? [p.address] : []); return (

ADDRESS

{addrDisplay.length === 0 ? (

—

) : (

{addrDisplay.map((line,i) =>

{line}

)}

); })()}

{/* Recent works */}

RECENT WORKS · TOP 5

{sampleWorks.map((w,i)=>( ))}

{/* Footer — adapts to mode */}

{editMode ? (<> ) : (<> {window.DetailDelete && ( onClose && onClose()} variant="ghost" label="DELETE" /> )} )}

{/* Reconcile-statement modal — match an inbound publisher statement against our expected royalties for a period. setup → running → results. */} {recon && (

recon.phase!=='running' && setRecon(null)} style={{position:'fixed',inset:0,background:'rgba(0,0,0,.5)',zIndex:120,display:'flex',alignItems:'center',justifyContent:'center',padding:24}}>

e.stopPropagation()} style={{background:'var(--bg)',border:'1px solid var(--ink)',width:'min(820px,100%)',maxHeight:'90vh',overflow:'auto'}}> {/* Header */}

RECONCILE STATEMENT · {p.name}

{recon.phase==='setup' && 'Match an inbound statement'} {recon.phase==='running' && 'Reconciling…'} {recon.phase==='results' && 'Reconciliation complete'}

{recon.phase!=='running' && ( )}

{/* Phase: setup */} {recon.phase==='setup' && (

Upload the publisher's statement (CWR/DDEX RD-DSR/CSV/XLSX). We'll match each reported line to the royalties we expected for the period — flagging matches, shorts, overpayments, and missing works.

PERIOD

STATEMENT FORMAT

{/* File drop */}

STATEMENT FILE

{ const f=e.target.files && e.target.files[0]; if (f) setRecon(c=>({...c,file:{name:f.name, size:f.size}})); }}/> {recon.file ? (

{recon.file.name} · {(recon.file.size/1024).toFixed(1)} KB · click to replace

) : (

Click to choose file, or drop a {recon.format} here. · No file selected — we'll use a sample for the demo.

)}

{/* Expected summary strip */}

EXPECTED LINES

{recon.lines.length}

EXPECTED TOTAL

${recon.expected.toLocaleString()}

ACTIVE AGREEMENTS

{p.agreements || p.works || '—'}

)} {/* Phase: running */} {recon.phase==='running' && (

Matching {recon.lines.length} lines · {recon.format} · {recon.period}

{/* Progress bar */}

{/* Live line readout */}

{recon.lines.slice(0, recon.idx).map((l,i)=>{ const v = l.reported - l.expected; const tag = l.status==='matched' ? 'OK' : l.status==='short' ? 'SHORT' : l.status==='over' ? 'OVER' : 'MISSING'; const color = l.status==='matched' ? 'var(--ok)' : l.status==='missing' ? 'var(--danger)' : 'var(--ink-2)'; return (

{tag} {l.title} {window.iswcDisplay ? window.iswcDisplay(l.iswc) : l.iswc} {v>0?'+':''}{v.toLocaleString(undefined,{style:'currency',currency:'USD',maximumFractionDigits:0})}

); })} {recon.idx < recon.lines.length && (

→ Matching line {recon.idx+1} of {recon.lines.length}: {recon.lines[recon.idx].title}…

)}

)} {/* Phase: results */} {recon.phase==='results' && (

{/* Totals strip */}

{[ {k:'matched', label:'MATCHED', color:'var(--ok)'}, {k:'short', label:'UNDERPAID', color:'var(--ink)'}, {k:'over', label:'OVERPAID', color:'var(--ink)'}, {k:'missing', label:'MISSING', color:'var(--danger)'}, ].map(t => (

{t.label}

{recon.totals[t.k]}

))}

{/* Variance summary */} {(() => { const expectedTotal = recon.lines.reduce((s,l)=>s+l.expected,0); const reportedTotal = recon.lines.reduce((s,l)=>s+l.reported,0); const variance = reportedTotal - expectedTotal; return (

EXPECTED

${expectedTotal.toLocaleString()}

REPORTED

${reportedTotal.toLocaleString()}

VARIANCE

0 ? 'var(--ok)' : 'var(--ink)'}}> {variance>=0?'+':''}${Math.abs(variance).toLocaleString()}

); })()} {/* Detail table */}

STATUSWORKISWC EXPECTEDREPORTEDVARIANCE

{recon.lines.map((l,i)=>{ const v = l.reported - l.expected; const tag = l.status==='matched' ? 'OK' : l.status==='short' ? 'SHORT' : l.status==='over' ? 'OVER' : 'MISSING'; const color = l.status==='matched' ? 'var(--ok)' : l.status==='missing' ? 'var(--danger)' : 'var(--ink-2)'; return (

{tag} {l.title} {window.iswcDisplay ? window.iswcDisplay(l.iswc) : l.iswc} ${l.expected.toLocaleString()} ${l.reported.toLocaleString()} {v>0?'+':''}{v.toLocaleString(undefined,{style:'currency',currency:'USD',maximumFractionDigits:0})}

); })}

Finished {recon.finishedAt} · {recon.format} · {recon.period}

)}

)} ); } // ── LABEL DRAWER ─────────────────────────────────────────────── // Default Neighboring Rights Organizations by territory. // NRO = the collective that licenses & collects performance royalties for sound-recording rightsholders. const DEFAULT_NROS = [ {territory:'United States', iso:'US', org:'SoundExchange', member:'Member', since:'2014'}, {territory:'United Kingdom', iso:'GB', org:'PPL', member:'Member', since:'2011'}, {territory:'Germany', iso:'DE', org:'GVL', member:'Member', since:'2013'}, {territory:'France', iso:'FR', org:'SCPP', member:'Member', since:'2012'}, {territory:'Japan', iso:'JP', org:'GeidankyoCPRA', member:'Reciprocal', since:'2015'}, {territory:'Netherlands', iso:'NL', org:'SENA', member:'Reciprocal', since:'2013'}, {territory:'Brazil', iso:'BR', org:'ABRAMUS', member:'—', since:'—'}, ]; function LabelDrawer({ l, onClose, go, initialEditMode=false }) { // Mock recent releases for this label const REL = (typeof window.RELEASES !== 'undefined') ? window.RELEASES : (typeof RELEASES !== 'undefined' ? RELEASES : null); const labelReleases = REL ? REL.filter(r => r.label.toLowerCase().includes(l.name.toLowerCase().split(' ')[0])).slice(0,5) : []; const [editMode, setEditMode] = React.useState(initialEditMode); const [logoFile, setLogoFile] = React.useState(null); const [dist, setDist] = React.useState({ name: l.name, code: l.code, parent: l.parent, deals: l.deals, kind: l.kind || (/sony music|universal music|warner music|umg|wmg/i.test(l.parent||'') ? 'major' : 'indie'), status: 'Active partner', }); const [nros, setNros] = React.useState(DEFAULT_NROS); const [editingNro, setEditingNro] = React.useState(null); const [contact, setContact] = React.useState({ primary: 'Maya Okonkwo', role: 'Head of Rights & Royalties', email: 'rights@'+l.name.toLowerCase().replace(/[^a-z]/g,'')+'.com', phone: '+1 (212) 833-8000', address: '550 Madison Ave, New York, NY 10022', }); const [syncRun, setSyncRun] = React.useState(null); // { rows:[{n,status,detail}], idx, done } const [reportCfg, setReportCfg] = React.useState(null); // { period, format, recipients:[email], notes, sending, sent, sentAt } const fileRef = React.useRef(null); // Drive the NRO sync simulation React.useEffect(() => { if (!syncRun || syncRun.done) return; if (syncRun.idx >= syncRun.rows.length) { setSyncRun(s => ({...s, done:true})); return; } const t = setTimeout(() => { setSyncRun(s => { if (!s) return s; const rows = s.rows.map((r,i) => { if (i !== s.idx) return r; // Resolve outcome based on member status let status, detail; if (r.n.member === 'Member') { status = 'ok'; detail = `Reciprocal feed acked · ${Math.floor(800 + Math.random()*1400)} works`; } else if (r.n.member === 'Reciprocal') { status = 'ok'; detail = `Reciprocal claim file received · ${Math.floor(120 + Math.random()*400)} claims`; } else if (r.n.member === 'Pending') { status = 'warn'; detail = 'Awaiting bilateral agreement countersign'; } else { status = 'skip'; detail = 'No reciprocal — territory not represented'; } return {...r, status, detail}; }); return {...s, rows, idx: s.idx + 1}; }); }, 380); return () => clearTimeout(t); }, [syncRun]); const onPickLogo = (e) => { const f = e.target.files && e.target.files[0]; if (!f) return; const url = URL.createObjectURL(f); setLogoFile({name:f.name, url}); if (typeof toast === 'function') toast(`Logo uploaded · ${f.name}`); }; const exitEdit = () => { setEditingNro(null); // Persist edits back to the source label record so filters, tiles, and other views see the change. l.name = dist.name; l.code = dist.code; l.parent = dist.parent; l.deals = dist.deals; l.kind = dist.kind; setEditMode(false); if (typeof toast === 'function') toast(`${dist.name} · changes saved`, 'ok'); }; return ( {/* Hero */}

{/* Global edit toggle — matches CloseBtn size, sits to its left with spacing */} {l.code}

{/* Logo slot — read-only unless in edit mode */}

LABEL · {editMode ? ( setDist({...dist,code:e.target.value.toUpperCase().slice(0,6)})} className="ff-mono upper" style={{fontSize:9,letterSpacing:'.14em',background:'rgba(255,255,255,.1)',color:'inherit', border:'1px solid rgba(255,255,255,.3)',padding:'2px 6px',width:64,fontFamily:'inherit',outline:'none'}}/> ) : {l.code}}

{editMode ? ( setDist({...dist,name:e.target.value})} className="ff-display" style={{fontSize:38,fontWeight:700,letterSpacing:'-0.03em',lineHeight:.95, background:'rgba(255,255,255,.08)',color:'inherit', border:'1px solid rgba(255,255,255,.3)',padding:'4px 8px',width:'100%', fontFamily:'inherit',outline:'none',boxSizing:'border-box'}} placeholder="Label name"/> ) : (

{l.name}

)}

{editMode ? dist.parent : l.parent}

{/* Big stats */}

{[ {l:'RELEASES', v:l.releases.toLocaleString()}, {l:'ARTISTS', v:l.artists.toLocaleString()}, {l:'CATALOG $', v:'$'+(l.releases*4.2).toFixed(1)+'M'}, ].map((s,i,arr)=>(

{s.l}

{s.v}

))}

{/* Distribution */}

DISTRIBUTION

{(() => { const allLabels = (typeof LABELS !== 'undefined') ? LABELS : []; // Distinct parent options come from existing labels' `parent` field, plus all label names (so you can chain a label to another label). const parentOptions = Array.from(new Set([ ...allLabels.map(x=>x.parent).filter(Boolean), ...allLabels.filter(x=>x.id!==l.id).map(x=>x.name), ])).sort(); const linkedParent = allLabels.find(x => x.name === dist.parent && x.id !== l.id); if (editMode) { const fld = {width:'100%',height:32,boxSizing:'border-box',fontSize:13,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)',lineHeight:'30px'}; return (

CODE

setDist({...dist,code:e.target.value.toUpperCase().slice(0,6)})} className="ff-mono" style={fld}/>

PARENT / DISTRIBUTOR {linkedParent && ( )}

setDist({...dist,parent:e.target.value})} list="label-parent-options" className="ff-mono" style={fld}/> {parentOptions.map(o => {linkedParent ?

↳ Linked to {linkedParent.code} · {linkedParent.releases.toLocaleString()} releases

Free-text — pick a label name to auto-link

}

DEALS

setDist({...dist,deals:e.target.value})} className="ff-mono" style={fld}/>

CLASSIFICATION Major-owned vs Independent

{['major','indie'].map(k => ( ))}

{/sony music|universal music|warner music|umg|wmg/i.test(dist.parent||'') ? <>Auto-derived from parent {dist.parent} — override here if needed. : <>Set manually. ASTRO infers Major when parent is Sony/Universal/Warner.}

STATUS

); } return (

PARENT

{linkedParent ? ( ) : (

{dist.parent}

)}

CLASSIFICATION

{dist.kind === 'major' ? 'MAJOR-OWNED' : 'INDEPENDENT'} {/sony music|universal music|warner music|umg|wmg/i.test(dist.parent||'') ? 'auto · from parent' : 'manual'}

); })()}

{/* Neighboring Rights Organizations (per territory) */}

NEIGHBORING RIGHTS · {nros.length} TERRITORIES

{editMode && ( )}

ISOTERRITORYORGANIZATIONSTATUSSINCE

{nros.map((n,i)=>{ const isEditing = editMode && editingNro === i; return (

{isEditing ? (() => { const fieldStyle = {width:'100%',height:28,boxSizing:'border-box',fontSize:12,padding:'0 6px',border:'1px solid var(--rule)',background:'var(--bg)',fontFamily:'inherit',lineHeight:'26px'}; const monoFieldStyle = {...fieldStyle, fontVariantNumeric:'tabular-nums'}; return ( <> setNros(nros.map((x,j)=>j===i?{...x,iso:e.target.value.toUpperCase().slice(0,2)}:x))} style={monoFieldStyle}/> setNros(nros.map((x,j)=>j===i?{...x,territory:e.target.value}:x))} style={fieldStyle}/> setNros(nros.map((x,j)=>j===i?{...x,org:e.target.value}:x))} list={`nro-suggest-${i}`} style={fieldStyle}/> {['SoundExchange','PPL','GVL','SCPP','SPPF','SENA','SAMI','GRAMEX','PPCA','RESOUND','ABRAMUS','GeidankyoCPRA','FILSCAP','AFI','ADAMI','SPEDIDAM'].map(o=>( setNros(nros.map((x,j)=>j===i?{...x,since:e.target.value}:x))} style={monoFieldStyle}/> ); })() : ( <> {n.iso} {n.territory} {n.org} {n.member==='Member' && } {n.member} {n.since} {editMode ? : } )}

); })}

{/* Contact info */}

CONTACT

{editMode ? (

{[ {k:'primary', l:'Name'}, {k:'role', l:'Role'}, {k:'email', l:'Email', type:'email'}, {k:'phone', l:'Phone', type:'tel'}, {k:'address', l:'Address', span:2}, ].map(f=>(

{f.l}

setContact({...contact,[f.k]:e.target.value})} style={{width:'100%',fontSize:13,padding:'6px 8px',border:'1px solid var(--rule)',background:'var(--bg)',fontFamily:'inherit'}}/> ))}

) : (

{contact.primary}

{contact.role}

)}

{/* Recent releases */} {labelReleases.length>0 && (

RECENT RELEASES

{labelReleases.map(r=>( ))}

)} {/* Footer */} {/* Footer — mode-aware */}

{editMode ? ( <> {nros.length} NRO · {logoFile?'logo set':'no logo'} ) : ( <> {window.DetailDelete && ( onClose && onClose()} variant="ghost" label="DELETE" /> )} )}

{/* NRO Sync modal — overlays the drawer */} {syncRun && (() => { const total = syncRun.rows.length; const completed = syncRun.rows.filter(r => r.status !== 'pending').length; const counts = syncRun.rows.reduce((a,r)=>{ a[r.status]=(a[r.status]||0)+1; return a; }, {}); const pct = total ? Math.round(completed/total*100) : 0; return (

syncRun.done && setSyncRun(null)}>

e.stopPropagation()} style={{width:'100%',background:'var(--bg)',color:'var(--ink)',borderTop:'1px solid var(--rule)', maxHeight:'72%',display:'flex',flexDirection:'column',animation:'astro-slide-up .25s ease-out'}}> {/* Header */}

NRO RECIPROCAL SYNC · STARTED {syncRun.startedAt} UTC

{syncRun.done ? 'Sync complete' : `Syncing ${completed} / ${total} territories…`}

{/* Progress bar */}

{/* Summary chips */}

{[ {l:'OK', v:counts.ok||0, tone:'var(--ink)'}, {l:'WARN', v:counts.warn||0, tone:'var(--accent, #d4a02a)'}, {l:'SKIPPED', v:counts.skip||0, tone:'var(--ink-3)'}, {l:'PENDING', v:counts.pending||0, tone:'var(--ink-3)'}, ].map(c => (

{c.l} {c.v}

))}

{/* Row list */}

{syncRun.rows.map((r,i) => { const isCurrent = !syncRun.done && i === syncRun.idx; const dotColor = r.status==='ok' ? 'var(--ink)' : r.status==='warn' ? 'var(--accent, #d4a02a)' : r.status==='skip' ? 'var(--ink-3)' : isCurrent ? 'var(--ink-2)' : 'var(--rule)'; return (

{r.n.iso} {r.n.territory} {r.n.org} {r.status==='pending' ? (isCurrent?'syncing…':'queued') : r.status==='skip' ? 'skipped' : r.status==='warn' ? 'warning' : 'ok'} {r.detail}

); })}

{/* Footer */}

{!syncRun.done && ( Streaming reciprocal feeds via SCAPR backbone… )} {syncRun.done && ( <> )}

); })()} {/* SEND DISTRO REPORT modal */} {reportCfg && (() => { const cfg = reportCfg; const validEmails = cfg.recipients.filter(e => /^[^@\s]+@[^@\s]+\.[^@\s]+$/.test(e)); const canSend = validEmails.length > 0 && !cfg.sending; const isEmail = (s) => /^[^@\s]+@[^@\s]+\.[^@\s]+$/.test(s); const addRecipient = () => { const v = (cfg.newRecipient||'').trim(); if (!v || !isEmail(v) || cfg.recipients.includes(v)) return; setReportCfg({...cfg, recipients:[...cfg.recipients, v], newRecipient:''}); }; const removeRecipient = (e) => setReportCfg({...cfg, recipients: cfg.recipients.filter(x=>x!==e)}); // Period summary stats (mocked from label numbers) const periodStats = (() => { const seed = (l.releases || 1) + (l.artists || 1); return { releases: Math.max(1, Math.round((seed % 23) + 4)), streams: ((seed * 31) % 9000 + 1200).toLocaleString() + 'K', payable: '$' + ((seed * 1.7) % 240 + 40).toFixed(1) + 'K', territories: nros.length, }; })(); const send = () => { setReportCfg({...cfg, sending:true}); setTimeout(() => { setReportCfg(c => c && {...c, sending:false, sent:true, sentAt:new Date().toISOString().slice(0,16).replace('T',' ')}); toast(`Distro report sent · ${l.name} → ${validEmails.length} recipient${validEmails.length===1?'':'s'}`, 'ok'); }, 900); }; const downloadDraft = () => { // Compose a plain-text "report" — stand-in for PDF/CSV the real backend would produce const lines = [ `DISTRIBUTION REPORT — ${l.name} (${l.code})`, `Period: ${cfg.period}`, `Generated: ${new Date().toISOString().slice(0,19).replace('T',' ')} UTC`, `Format requested: ${cfg.format}`, ``, `--- SUMMARY ---`, `Releases delivered: ${periodStats.releases}`, `Streams: ${periodStats.streams}`, `Payable royalties: ${periodStats.payable}`, `Active NRO territories: ${periodStats.territories}`, ``, `--- DISTRIBUTION ---`, `Code: ${dist.code}`, `Parent / distributor: ${dist.parent}`, `Deals: ${dist.deals}`, `Status: ${dist.status}`, ``, `--- NEIGHBORING RIGHTS ---`, ...nros.map(n => ` ${n.iso} ${n.territory.padEnd(20)} ${n.org.padEnd(22)} ${n.member} since ${n.since}`), ``, `--- RECIPIENTS ---`, ...cfg.recipients.map(r => ` ${r}`), ``, `Notes: ${cfg.notes || '—'}`, ``, `[End of report — preview only. Production reports are issued as ${cfg.format}.]`, ].join('\n'); const ext = cfg.format === 'CSV' ? 'csv' : cfg.format === 'XLSX' ? 'xlsx' : 'txt'; const mime = cfg.format === 'CSV' ? 'text/csv' : 'text/plain'; const blob = new Blob([lines],{type:mime}); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = `${l.code}_distro_report_${cfg.period}.${ext}`; document.body.appendChild(a); a.click(); a.remove(); setTimeout(()=>URL.revokeObjectURL(url), 1000); toast(`Draft downloaded · ${l.code} ${cfg.period}`); }; return (

!cfg.sending && setReportCfg(null)}>

e.stopPropagation()} style={{width:'100%',background:'var(--bg)',color:'var(--ink)',borderTop:'1px solid var(--rule)', maxHeight:'82%',display:'flex',flexDirection:'column',animation:'astro-slide-up .25s ease-out'}}> {/* Header */}

DISTRO REPORT · {l.code}

{cfg.sent ? 'Report sent' : `Send distribution report — ${cfg.period}`}

{/* Body */}

{cfg.sent ? (

DELIVERY RECEIPT

↳ {validEmails.join(', ')}

) : (

{/* Period + format */}

PERIOD

setReportCfg({...cfg,period:e.target.value})} className="ff-mono" style={{width:'100%',height:32,boxSizing:'border-box',fontSize:13,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)'}}/>

FORMAT

{/* Period preview */}

WHAT'S INCLUDED · {cfg.period}

{[ {l:'RELEASES', v: periodStats.releases}, {l:'STREAMS', v: periodStats.streams}, {l:'PAYABLE', v: periodStats.payable}, {l:'NRO TERR.', v: periodStats.territories}, ].map(s=>(

{s.l}

{s.v}

))}

{/* Recipients */}

RECIPIENTS · {validEmails.length}

{cfg.recipients.length === 0 && ( No recipients yet. )} {cfg.recipients.map(e=>{ const ok = isEmail(e); return ( {e} ); })}

setReportCfg({...cfg, newRecipient: v})} placeholder="add email…" className="ff-mono" style={{width:'100%',height:32,boxSizing:'border-box',fontSize:12,padding:'0 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)'}}/>

{/* Notes */}

NOTES (OPTIONAL)

setReportCfg({...cfg,notes:e.target.value})}
                        rows={3} placeholder="Anything the recipient should know…"
                        style={{width:'100%',boxSizing:'border-box',fontSize:13,padding:'8px 10px',background:'var(--bg)',border:'1px solid var(--rule)',color:'var(--ink)',fontFamily:'inherit',resize:'vertical'}}/>
                    </label>
                  </div>
                )}
              </div>

{/* Footer */}
              <div style={{padding:'14px 24px',borderTop:'1px solid var(--rule)',display:'flex',gap:8,alignItems:'center',justifyContent:'flex-end'}}>
                {!cfg.sent && !cfg.sending && (
                  <span className="ff-mono" style={{fontSize:10,color:'var(--ink-3)',marginRight:'auto',letterSpacing:'.04em'}}>
                    Will deliver via labels-relay@astro · DKIM signed
                  </span>
                )}
                {cfg.sending && (
                  <span className="ff-mono upper" style={{fontSize:10,color:'var(--ink-3)',marginRight:'auto',letterSpacing:'.1em',animation:'astro-pulse 1s ease-in-out infinite'}}>
                    Encrypting & dispatching…
                  </span>
                )}
                {cfg.sent ? (
                  <button onClick={()=>setReportCfg(null)} className="ff-mono upper"
                    style={{padding:'8px 14px',fontSize:11,letterSpacing:'.08em',background:'var(--ink)',color:'var(--bg)',border:0,cursor:'pointer',fontWeight:600}}>
                    DONE
                  </button>
                ) : (
                  <>
                    <button onClick={downloadDraft} disabled={cfg.sending} className="ff-mono upper"
                      style={{padding:'8px 14px',fontSize:11,letterSpacing:'.08em',background:'transparent',color:'var(--ink)',border:'1px solid var(--rule)',cursor:cfg.sending?'not-allowed':'pointer',opacity:cfg.sending?.4:1}}>
                      DOWNLOAD DRAFT
                    </button>
                    <button onClick={send} disabled={!canSend} className="ff-mono upper"
                      style={{padding:'8px 14px',fontSize:11,letterSpacing:'.08em',
                        background: canSend ? 'var(--ink)' : 'var(--bg-2)',
                        color:      canSend ? 'var(--bg)' : 'var(--ink-3)',
                        border:0,cursor: canSend ? 'pointer' : 'not-allowed',fontWeight:600}}>
                      SEND REPORT
                    </button>
                  </>
                )}
              </div>
            </div>
            <style>{`
              @keyframes astro-fade-in { from { opacity: 0 } to { opacity: 1 } }
            `}</style>
          </div>
        );
      })()}
    </Drawer>
  );
}
// AgreementDrawer was removed in favor of full-page <ScreenAgreement>
// (see agreement-detail.jsx). The astro-open-agreement event now navigates
// to the agreement route instead of opening a drawer.

// ── GLOBAL HOST ────────────────────────────────────────────────
function GlobalEntityDrawers({ go }) {
  const [open, setOpen] = useEnS(null); // {kind, id, edit}

useEnE(() => {
    const make = (kind) => (e) => { if (e.detail?.id) setOpen({kind, id:e.detail.id, edit: !!e.detail?.edit}); };
    const onR = make('release');
    const onP = make('publisher');
    const onL = make('label');
    // Agreement event navigates to the full-page detail instead of opening a drawer
    const onA = (e) => {
      if (!e.detail?.id) return;
      const AGR = (typeof window.AGREEMENTS !== 'undefined') ? window.AGREEMENTS : [];
      const ag = AGR.find(x => x.id === e.detail.id) || { id: e.detail.id };
      if (window.__astroGo) window.__astroGo('agreement', ag);
    };
    const onClose = () => setOpen(null);
    window.addEventListener('astro-open-release',   onR);
    window.addEventListener('astro-open-publisher', onP);
    window.addEventListener('astro-open-label',     onL);
    window.addEventListener('astro-open-agreement', onA);
    window.addEventListener('astro-close-entity',   onClose);
    return () => {
      window.removeEventListener('astro-open-release',   onR);
      window.removeEventListener('astro-open-publisher', onP);
      window.removeEventListener('astro-open-label',     onL);
      window.removeEventListener('astro-open-agreement', onA);
      window.removeEventListener('astro-close-entity',   onClose);
    };
  }, []);

if (!open) return null;
  const close = () => setOpen(null);
  if (open.kind==='release') {
    // Look in RELEASES first (canonical group/edition set), then fall back to
    // RELEASES_X (the lite set that recording.releaseIds points into). The two
    // datasets share IDs for the canonical 8 albums but each carries different
    // edition + compilation rows.
    const REL_PRIMARY = (typeof window.RELEASES   !== 'undefined') ? window.RELEASES   : (typeof RELEASES   !== 'undefined' ? RELEASES   : null);
    const REL_FALLBACK= (typeof window.RELEASES_X !== 'undefined') ? window.RELEASES_X : null;
    const r = (REL_PRIMARY && REL_PRIMARY.find(x=>x.id===open.id))
           || (REL_FALLBACK && REL_FALLBACK.find(x=>x.id===open.id))
           || null;
    return r ? <ReleaseDrawer r={r} onClose={close} go={go}/> : null;
  }
  if (open.kind==='publisher') {
    const PUB = (typeof window.PUBLISHERS !== 'undefined') ? window.PUBLISHERS : (typeof PUBLISHERS !== 'undefined' ? PUBLISHERS : null);
    const p = PUB ? PUB.find(x=>x.id===open.id) : null;
    return p ? <PublisherDrawer p={p} onClose={close} go={go} initialEditMode={open.edit}/> : null;
  }
  if (open.kind==='label') {
    const LAB = (typeof window.LABELS !== 'undefined') ? window.LABELS : (typeof LABELS !== 'undefined' ? LABELS : null);
    const l = LAB ? LAB.find(x=>x.id===open.id) : null;
    return l ? <LabelDrawer l={l} onClose={close} go={go} initialEditMode={open.edit}/> : null;
  }
  return null;
}

Object.assign(window, { GlobalEntityDrawers, Drawer, CloseBtn, KV, toast });