{/* Health */}
{/* IDs */}
IDENTIFIERS
{ops.upc}
{ops.upcMeta.valid
? ✓ check digit
: ✗ check digit}
{ops.upcMeta.kind === 'EAN-13' ? ops.upc : `0${ops.upc}`}
{ops.icpn}
{ops.grid || not issued}
{ops.catNo}
{ops.trackCount} tracks
{ops.isrcMissing
? {ops.isrcMissing} missing ISRC
: ✓ all assigned}
{/* Source block */}
{ops.block && (
PREFIX BLOCK
{ops.block.prefix}
{ops.block.owner}
{ops.block.tier}
0.85 ? '#a04432' : '#3a8a52' }} />
{(blockUtilization(ops.block) * 100).toFixed(2)}%
)}
{/* Conflicts */}
{dupes.length > 0 && (
⚠ CONFLICTS · {dupes.length}
{dupes.map(d => (
{d.title}
{d.artist} · {d.editionLabel || d.format}
))}
)}
{/* DSP push state */}
DSP PUSH STATE
{dspList.map(d => {
const on = ops.pushed.includes(d.split(' ')[0]);
return (
{d}
{on
? ✓ DELIVERED · {ops.lastPush}
: not delivered}
);
})}
{/* Actions */}
ACTIONS
onAction('lock', rel.id)}>Lock identifiers
onAction('reissue', rel.id)}>Reissue UPC
onAction('grid', rel.id)} disabled={!!ops.grid}>{ops.grid ? 'GRid issued' : 'Issue GRid'}
onAction('variant', rel.id)}>Issue variant
onAction('push', rel.id)}>Push to DDEX
onAction('withdraw', rel.id)} danger>Withdraw
);
}
function ActionBtn({ children, onClick, danger, disabled }) {
return (
);
}
// ── Prefix-blocks tab ───────────────────────────────────────────────
function BlocksTab({ blocks, setBlocks }) {
const [adding, setAdding] = useState(false);
const [newPrefix, setNewPrefix] = useState('');
const [newOwner, setNewOwner] = useState('');
function add() {
if (!/^\d{6,11}$/.test(newPrefix)) { window.toast?.('Prefix must be 6-11 digits', 'soft'); return; }
if (!newOwner.trim()) return;
setBlocks(bs => [...bs, { id: 'pb_' + Date.now(), prefix: newPrefix, owner: newOwner.trim(), tier: 'label', issued: 0, reserved: 0, hole: [], note: 'New block' }]);
setAdding(false); setNewPrefix(''); setNewOwner('');
}
return (
GS1 prefix blocks
UPC capacity allocated to imprints. Sequence advances per release.
{adding && (
setNewPrefix(e.target.value)} placeholder="Prefix (6-11 digits)" className="ff-mono"
style={{ flex: '0 0 180px', padding: '7px 10px', border: '1px solid var(--rule)', background: 'var(--paper)', fontSize: 12 }} />
setNewOwner(e.target.value)} placeholder="Owner / imprint"
style={{ flex: 1, padding: '7px 10px', border: '1px solid var(--rule)', background: 'var(--paper)', fontSize: 12 }} />
)}
{['Prefix', 'Owner', 'Tier', 'Issued', 'Reserved', 'Utilization', 'Next UPC'].map(l => (
{l}
))}
{blocks.map(b => {
const u = blockUtilization(b);
const next = nextUPCFromPrefix(b.prefix, b.issued);
const tone = u > 0.95 ? '#a04432' : u > 0.85 ? '#c79538' : '#3a8a52';
return (
{b.prefix}
{b.owner}
{b.note &&
{b.note}
}
{b.tier}
{b.issued.toLocaleString()}
{b.reserved}
{next}
);
})}
GRid issuer codes
Allocated by IFPI for digital release identifiers.
{['Code', 'Owner', 'Tier', 'Issued', 'Sample next'].map(l => (
{l}
))}
{SEED_GRID_ISSUERS.map(g => (
{g.code}
{g.owner}
{g.tier}
{g.issued}
{formatGrid(nextGridFromIssuer(g.code, g.issued))}
))}
);
}
// ── Conflicts tab ───────────────────────────────────────────────────
function ConflictsTab({ rows, onPick }) {
// Group conflicts: invalid check digit, duplicate UPC, missing GRid (digital), missing ISRC.
const dupeMap = new Map();
rows.forEach(r => {
if (!dupeMap.has(r._ops.upc)) dupeMap.set(r._ops.upc, []);
dupeMap.get(r._ops.upc).push(r);
});
const dupes = [...dupeMap.entries()].filter(([_, list]) => list.length > 1);
const invalid = rows.filter(r => !r._ops.upcMeta.valid);
const missingGRid = rows.filter(r => r.format === 'Digital' && !r._ops.grid);
const missingISRC = rows.filter(r => r._ops.isrcMissing > 0);
function Section({ title, count, tone, children }) {
return (
{title}
{count}
{count === 0
?
None — clean.
: children}
);
}
function MiniRow({ rel, extra, tone }) {
return (
onPick(rel.id)} style={{
display: 'grid', gridTemplateColumns: '1.6fr 130px 1fr 80px', gap: 10, padding: '10px 14px',
borderBottom: '1px solid var(--rule-soft)', alignItems: 'center', cursor: 'pointer',
}}
onMouseEnter={(e) => { e.currentTarget.style.background = 'var(--surface-2)'; }}
onMouseLeave={(e) => { e.currentTarget.style.background = 'transparent'; }}>
{rel.title}
{rel.artist} · {rel.editionLabel || rel.format}
{rel._ops.upc}
{extra}
);
}
return (
{dupes.map(([upc, list]) => (
{upc}
used by {list.length} releases
{list.map(r =>
)}
))}
{missingGRid.slice(0, 30).map(r =>
)}
{missingGRid.length > 30 &&
+{missingGRid.length - 30} more
}
{missingISRC.slice(0, 30).map(r =>
)}
{missingISRC.length > 30 &&
+{missingISRC.length - 30} more
}
);
}
// ── Lifecycle tab ───────────────────────────────────────────────────
function LifecycleTab({ rows }) {
const groups = {};
STATUSES.forEach(s => groups[s.v] = []);
rows.forEach(r => { groups[r._ops.status]?.push(r); });
return (
{STATUSES.map(s => (
{s.label}
{groups[s.v].length}
{((groups[s.v].length / Math.max(rows.length, 1)) * 100).toFixed(1)}% of catalog
))}
{/* Sankey-ish lifecycle map */}
Lifecycle flow
);
}
// ── DDEX queue tab ──────────────────────────────────────────────────
function DdexTab({ rows }) {
// Synthesize a queue from any release in 'locked' or 'variant' state.
const queue = rows.filter(r => r._ops.status === 'locked' || r._ops.status === 'variant').slice(0, 40);
const PARTNERS = ['Spotify', 'Apple', 'Amazon Music', 'YouTube Music', 'Tidal', 'Deezer'];
const states = ['QUEUED', 'BUILDING', 'SIGNED', 'TRANSMITTED', 'ACK PENDING', 'ACCEPTED', 'REJECTED'];
function pickState(rel, partner) {
let h = 0; for (const c of rel.id + partner) h = (h * 31 + c.charCodeAt(0)) | 0;
h = Math.abs(h);
const on = rel._ops.pushed.includes(partner.split(' ')[0]);
if (on) return h % 11 === 0 ? 'REJECTED' : 'ACCEPTED';
const idx = h % 5;
return states[idx];
}
function stateTone(s) {
if (s === 'ACCEPTED') return '#3a8a52';
if (s === 'REJECTED') return '#a04432';
if (s === 'TRANSMITTED' || s === 'SIGNED') return '#5a8aa0';
if (s === 'ACK PENDING') return '#c79538';
return '#7a7a7a';
}
return (
DDEX outbound queue
ERN 4.3 ResourceList → ReleaseList → DealList per partner.
Release
UPC
{PARTNERS.map(p => {p})}
{queue.map(r => (
{r._ops.upc}
{PARTNERS.map(p => {
const s = pickState(r, p);
return (
{s}
);
})}
))}
);
}
// ── header KPI strip ────────────────────────────────────────────────
function KpiStrip({ rows, blocks }) {
const total = rows.length;
const conflict = rows.filter(r => r._ops.status === 'conflict').length;
const locked = rows.filter(r => r._ops.status === 'locked' || r._ops.status === 'variant').length;
const provisional = rows.filter(r => r._ops.status === 'provisional').length;
const reserved = rows.filter(r => r._ops.status === 'reserved').length;
const avgScore = rows.reduce((s, r) => s + r._ops.score, 0) / Math.max(total, 1);
const blockUtil = blocks.reduce((s, b) => s + blockUtilization(b), 0) / Math.max(blocks.length, 1);
const KPIS = [
{ l: 'CATALOG', v: total, s: 'editions tracked' },
{ l: 'AVG HEALTH', v: avgScore.toFixed(0), s: 'across catalog', tone: avgScore < 70 ? '#a04432' : avgScore < 90 ? '#c79538' : '#3a8a52' },
{ l: 'CONFLICTS', v: conflict, s: 'need review', tone: conflict ? '#a04432' : null },
{ l: 'LOCKED', v: locked, s: 'DSP-ready' },
{ l: 'PROVISIONAL', v: provisional, s: 'awaiting lock' },
{ l: 'RESERVED', v: reserved, s: 'pre-allocated' },
{ l: 'BLOCK UTIL', v: (blockUtil * 100).toFixed(1) + '%', s: 'across all prefixes', tone: blockUtil > 0.85 ? '#c79538' : null },
];
return (
{KPIS.map((k, i) => (
))}
);
}
// ── main screen ─────────────────────────────────────────────────────
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
"density": "comfortable",
"groupBy": "none",
"showOnlyIssues": false,
"showVariants": true,
"showWithdrawn": false
}/*EDITMODE-END*/;
function ScreenReleasesId({ go, payload }) {
const allRels = (window.RELEASES || []);
const [blocks, setBlocks] = useState(SEED_BLOCKS);
const [tab, setTab] = useState(payload?.tab || 'audit');
const [search, setSearch] = useState('');
const [filterStatus, setFilterStatus] = useState('all');
const [filterFormat, setFilterFormat] = useState('all');
const [filterLabel, setFilterLabel] = useState('all');
const [sort, setSort] = useState({ k: 'score', dir: 'asc' });
const [selectedId, setSelectedId] = useState(payload?.releaseId || null);
const [tweaksOpen, setTweaksOpen] = useState(false);
const [t, setT] = useTweaks(TWEAK_DEFAULTS);
useEffect(() => {
const onMsg = (e) => {
if (e.data?.type === '__activate_edit_mode') setTweaksOpen(true);
if (e.data?.type === '__deactivate_edit_mode') setTweaksOpen(false);
};
window.addEventListener('message', onMsg);
window.parent.postMessage({ type: '__edit_mode_available' }, '*');
return () => window.removeEventListener('message', onMsg);
}, []);
// attach _ops to every release (memoized)
const enriched = useMemo(() => {
return allRels.map(r => ({ ...r, _ops: deriveOps(r, blocks, allRels) }));
}, [allRels, blocks]);
const filtered = useMemo(() => {
let out = enriched;
if (search.trim()) {
const q = search.trim().toLowerCase();
out = out.filter(r => (r.title + ' ' + r.artist + ' ' + r._ops.upc + ' ' + r.label + ' ' + r._ops.catNo).toLowerCase().includes(q));
}
if (filterStatus !== 'all') out = out.filter(r => r._ops.status === filterStatus);
if (filterFormat !== 'all') out = out.filter(r => r.format === filterFormat);
if (filterLabel !== 'all') out = out.filter(r => r.label === filterLabel);
if (t.showOnlyIssues) out = out.filter(r => r._ops.dupe.length || !r._ops.upcMeta.valid || r._ops.isrcMissing);
if (!t.showVariants) out = out.filter(r => r._ops.status !== 'variant');
if (!t.showWithdrawn) out = out.filter(r => r._ops.status !== 'withdrawn');
const dir = sort.dir === 'asc' ? 1 : -1;
out = [...out].sort((a, b) => {
const va = ({
score: a._ops.score, title: a.title, upc: a._ops.upc, grid: a._ops.grid || '',
cat: a._ops.catNo, tracks: a._ops.trackCount, block: (a._ops.block?.prefix || ''),
pushed: a._ops.pushed.length, date: a._ops.lastPush || '', status: a._ops.status,
})[sort.k];
const vb = ({
score: b._ops.score, title: b.title, upc: b._ops.upc, grid: b._ops.grid || '',
cat: b._ops.catNo, tracks: b._ops.trackCount, block: (b._ops.block?.prefix || ''),
pushed: b._ops.pushed.length, date: b._ops.lastPush || '', status: b._ops.status,
})[sort.k];
if (va < vb) return -1 * dir;
if (va > vb) return 1 * dir;
return 0;
});
return out;
}, [enriched, search, filterStatus, filterFormat, filterLabel, sort, t.showOnlyIssues, t.showVariants, t.showWithdrawn]);
const labels = useMemo(() => [...new Set(enriched.map(r => r.label).filter(Boolean))].sort(), [enriched]);
const formats = useMemo(() => [...new Set(enriched.map(r => r.format).filter(Boolean))].sort(), [enriched]);
const selected = enriched.find(r => r.id === selectedId) || null;
function onAction(verb, id) {
const tip = ({
lock: 'Identifiers locked. UPC / GRid / Cat # frozen.',
reissue: 'Reissued UPC from next available block slot. Prior is now WITHDRAWN.',
grid: 'GRid issued from next-available issuer slot.',
variant: 'Variant edition created with new UPC.',
push: 'Queued for DDEX ERN 4.3 transmission to all 6 partners.',
withdraw: 'Release withdrawn. Will be propagated as ERN takedown.',
})[verb] || 'Action queued.';
window.toast?.(tip, verb === 'withdraw' ? 'warn' : 'soft');
}
const TABS = [
{ v: 'audit', l: 'Audit', n: filtered.length },
{ v: 'blocks', l: 'Prefix blocks', n: blocks.length },
{ v: 'conflicts', l: 'Conflicts', n: enriched.filter(r => r._ops.status === 'conflict').length },
{ v: 'lifecycle', l: 'Lifecycle', n: null },
{ v: 'ddex', l: 'DDEX queue', n: enriched.filter(r => r._ops.status === 'locked' || r._ops.status === 'variant').length },
];
return (
{/* header */}
OPERATIONS · IDENTIFIERS
Releases ID tracker
UPC, EAN-13, GRid, ICPN, catalog number — issued from prefix blocks, validated against GS1 & ISO/IEC 7064, deduplicated, and pushed to DSPs.
{/* tabs */}
{TABS.map(tb => (
))}
{tab === 'audit' && (
<>
{/* filters */}
setSearch(e.target.value)} placeholder="Search title, artist, UPC, cat #…"
style={{ flex: '1 1 280px', padding: '8px 12px', border: '1px solid var(--rule)', background: 'var(--paper)', fontSize: 13 }} />
)}
{tab === 'blocks' &&
}
{tab === 'conflicts' &&
{ setTab('audit'); setSelectedId(id); }} />}
{tab === 'lifecycle' && }
{tab === 'ddex' && }
{/* detail */}
{selected && tab === 'audit' && (
setSelectedId(null)} onAction={onAction} />
)}
{/* tweaks */}
{tweaksOpen && TweaksPanel && (
setTweaksOpen(false)}>
setT('density', v)} options={[
{ value: 'compact', label: 'Compact' },
{ value: 'comfortable', label: 'Comfortable' },
]} />
setT('showOnlyIssues', v)} label="Issues only" />
setT('showVariants', v)} label="Show variants" />
setT('showWithdrawn', v)} label="Show withdrawn" />
)}
);
}
Object.assign(window, {
ScreenReleasesId,
ReleasesIdValidate: { isValidUPC, isValidEAN13, isValidGRid, isValidISRC, gs1CheckDigit, gridCheckChar, formatGrid, classifyBarcode },
});
})();