// CRIMINAL JUSTICE — INVESTIGATORS sub-platform (5 tabs: Dashboard · Team · Leads · Budget · Reports) const { useState: useCjInvState } = React; const Tcip = window.ArbiterTokens; // ── Dashboard ──────────────────────────────────────────────────────────── function CjInvestigatorsDashboard({ data }) { const cj = window.__cj; const invs = data.investigators; const leads = data.investigatorLeads || []; const reports = data.investigatorReports || []; const totalHours = invs.reduce((s, i) => s + i.hoursMTD, 0); const totalBudget = invs.reduce((s, i) => s + i.budgetRemain, 0); const openLeads = leads.filter(l => l.status !== 'Completed').length; const critLeads = leads.filter(l => l.priority === 'critical' && l.status !== 'Completed').length; // By type const byType = {}; invs.forEach(i => { byType[i.type] = (byType[i.type] || 0) + 1; }); const typeData = Object.entries(byType).sort((a, b) => b[1] - a[1]); const maxType = Math.max(...typeData.map(r => r[1]), 1); // Firms ranked by hours const byFirm = {}; invs.forEach(i => { if (!byFirm[i.firm]) byFirm[i.firm] = { hours: 0, engagements: 0, budgetRemain: 0 }; byFirm[i.firm].hours += i.hoursMTD; byFirm[i.firm].engagements += 1; byFirm[i.firm].budgetRemain += i.budgetRemain; }); const firmData = Object.entries(byFirm).sort((a, b) => b[1].hours - a[1].hours); const maxHours = Math.max(...firmData.map(f => f[1].hours), 1); return (
Active engagements{invs.length}
Hours MTD{totalHours.toLocaleString()}
Budget remaining${(totalBudget / 1000).toFixed(0)}k
Open leads{openLeads}{leads.length} total
Critical leads 0 ? cj.burgundy : Tcip.color.text.primary }}>{critLeads}
Reports delivered{reports.length}
By investigation type
{typeData.map(([t, n]) => (
{t} {n}
))}
Firm engagement — hours MTD
{firmData.map(([firm, d]) => ( ))}
Firm Engagements Hours MTD Load Budget left
{firm} {d.engagements} {d.hours}
${(d.budgetRemain / 1000).toFixed(0)}k
! Critical & high-priority leads
{leads.filter(l => (l.priority === 'critical' || l.priority === 'high') && l.status !== 'Completed').map(l => { const pc = l.priority === 'critical' ? { bg: cj.burgundyBg, color: cj.burgundy } : { bg: cj.orangeBg, color: cj.orange }; return ( ); })}
ID Matter Title Assigned Priority Status Expected
{l.id} {l.matter} {l.title} {l.assigned} {l.priority} {l.status} {l.expected}
); } // ── Team (full engagement list) ───────────────────────────────────────── function CjInvestigatorsTeam({ data }) { const cj = window.__cj; return (
Investigator engagements — {data.investigators.length}
{data.investigators.map(i => { const typeTag = i.type.toLowerCase().includes('forensic') ? { bg: cj.cobaltBg, color: cj.cobalt } : i.type.toLowerCase().includes('digital') || i.type.toLowerCase().includes('mobile') ? { bg: cj.violetBg, color: cj.violet } : i.type.toLowerCase().includes('medical') ? { bg: cj.emeraldBg, color: cj.emerald } : i.type.toLowerCase().includes('jury') ? { bg: cj.amberBg, color: cj.amber } : i.type.toLowerCase().includes('polygraph') ? { bg: cj.violetBg, color: cj.violet } : i.type.toLowerCase().includes('ballistic') ? { bg: cj.burgundyBg, color: cj.burgundy } : i.type.toLowerCase().includes('background') ? { bg: cj.orangeBg, color: cj.orange } : { bg: Tcip.color.bg.secondary, color: Tcip.color.text.secondary }; return ( ); })}
ID Firm Type Matter Lead Hours MTD Budget left Focus
{i.id} {i.firm} {i.type} {i.matter} {i.lead} {i.hoursMTD} ${(i.budgetRemain / 1000).toFixed(0)}k {i.focus}
); } // ── Leads ─────────────────────────────────────────────────────────────── function CjInvestigatorsLeads({ data }) { const cj = window.__cj; const [statusFilter, setStatusFilter] = useCjInvState('All'); const [priorityFilter, setPriorityFilter] = useCjInvState('All'); const leads = data.investigatorLeads || []; const filtered = leads.filter(l => (statusFilter === 'All' || l.status === statusFilter) && (priorityFilter === 'All' || l.priority === priorityFilter) ); const statuses = ['All', ...new Set(leads.map(l => l.status))]; const priorities = ['All', 'critical', 'high', 'medium', 'low']; return (
Leads{leads.length}
In progress{leads.filter(l => l.status === 'In progress').length}
Completed{leads.filter(l => l.status === 'Completed').length}
Awaiting / pending{leads.filter(l => l.status === 'Awaiting' || l.status === 'Pending').length}
Critical priority{leads.filter(l => l.priority === 'critical').length}
Investigation leads — {filtered.length}
{filtered.map(l => { const pc = l.priority === 'critical' ? { bg: cj.burgundyBg, color: cj.burgundy } : l.priority === 'high' ? { bg: cj.orangeBg, color: cj.orange } : l.priority === 'medium' ? { bg: cj.amberBg, color: cj.amber } : { bg: Tcip.color.bg.secondary, color: Tcip.color.text.tertiary }; const sc = l.status === 'Completed' ? { bg: cj.emeraldBg, color: cj.emerald } : l.status === 'In progress' ? { bg: cj.cobaltBg, color: cj.cobalt } : l.status === 'Awaiting' || l.status === 'Pending' ? { bg: cj.amberBg, color: cj.amber } : { bg: cj.violetBg, color: cj.violet }; return ( ); })}
ID Opened Matter Title Assigned Priority Status Expected Notes
{l.id} {l.opened} {l.matter} {l.title} {l.assigned} {l.priority} {l.status} {l.expected} {l.notes}
); } // ── Budget ────────────────────────────────────────────────────────────── function CjInvestigatorsBudget({ data }) { const cj = window.__cj; const invs = data.investigators; // Assume each engagement started with budgetRemain + hoursMTD * rate ~ approx budget const rate = 250; // heuristic hourly rate for display const enriched = invs.map(i => { const spent = i.hoursMTD * rate; const total = spent + i.budgetRemain; const pctUsed = total > 0 ? Math.round((spent / total) * 100) : 0; return { ...i, spent, total, pctUsed }; }); const totalSpent = enriched.reduce((s, x) => s + x.spent, 0); const totalBudget = enriched.reduce((s, x) => s + x.total, 0); const totalRemain = enriched.reduce((s, x) => s + x.budgetRemain, 0); const overallPct = totalBudget > 0 ? Math.round((totalSpent / totalBudget) * 100) : 0; return (
Total budget${(totalBudget / 1000).toFixed(0)}k
Spent MTD${(totalSpent / 1000).toFixed(0)}k
Remaining${(totalRemain / 1000).toFixed(0)}k
Burn rate 75 ? cj.burgundy : overallPct > 50 ? cj.amber : cj.emerald }}>{overallPct}%
Budget utilization by engagement
{enriched.sort((a, b) => b.pctUsed - a.pctUsed).map(i => { const uColor = i.pctUsed > 80 ? cj.burgundy : i.pctUsed > 60 ? cj.amber : cj.emerald; return ( ); })}
Engagement Firm Matter Hours MTD Spent Remaining Utilization
{i.id} {i.firm} {i.matter} {i.hoursMTD} ${(i.spent / 1000).toFixed(0)}k ${(i.budgetRemain / 1000).toFixed(0)}k
{i.pctUsed}%
); } // ── Reports ───────────────────────────────────────────────────────────── function CjInvestigatorsReports({ data }) { const cj = window.__cj; const reports = data.investigatorReports || []; return (
Reports delivered{reports.length}
Total pages{reports.reduce((s, r) => s + r.pages, 0).toLocaleString()}
Matters covered{new Set(reports.map(r => r.matter)).size}
Avg length{Math.round(reports.reduce((s, r) => s + r.pages, 0) / (reports.length || 1))} pp
Investigator reports — {reports.length}
{reports.map(r => ( ))}
Report ID Dated Matter Title Pages Conclusion
{r.id} {r.dated} {r.matter} {r.title} {r.pages} {r.conclusion}
); } // ── Platform entry ────────────────────────────────────────────────────── function CriminalInvestigatorsPlatform({ data }) { const [subTab, setSubTab] = useCjInvState('dashboard'); const cj = window.__cj; const subTabs = [ { id: 'dashboard', label: 'Dashboard' }, { id: 'team', label: 'Team' }, { id: 'leads', label: 'Leads' }, { id: 'budget', label: 'Budget' }, { id: 'reports', label: 'Reports' }, ]; const renderSub = () => { switch (subTab) { case 'dashboard': return ; case 'team': return ; case 'leads': return ; case 'budget': return ; case 'reports': return ; default: return ; } }; return (
{subTabs.map(t => { const active = subTab === t.id; return ( ); })}
{renderSub()}
); } window.CriminalInvestigatorsPlatform = CriminalInvestigatorsPlatform;