// Home / Command Center v2 — Core 2.0 material // ---------- Focus Now ---------- function FocusNow({ hero, list }) { return (
{/* Hero card */}
{hero.tag} · Feature
{hero.title}

{hero.context}

{hero.owner}
Due {hero.due}
{hero.dep}
{/* Right stats */}
Progress
{hero.stage}
3 open sub-tasks
Contributors
{hero.contributors.length} people
{/* Mini list */}
Also on your desk See all 12 →
{list.map((it, i) => (
{it.p}
{it.title}
{it.ctx}
{['Decision','Project','Document','Milestone'][it.p-1]}
))}
); } // ---------- Needs Review ---------- function NeedsReview({ items }) { const kindMap = { feature: { tone: 'kind-lav', icon: 'features' }, decision: { tone: 'kind-peach', icon: 'decisions' }, research: { tone: 'kind-mint', icon: 'book' }, approval: { tone: 'kind-cream', icon: 'check' }, }; return ( } right={Open inbox} />
{items.length} items waiting on you
{items.map((it, i) => { const km = kindMap[it.kind] || kindMap.feature; return (
{it.title}
{it.meta}
{it.time} ago
); })}
); } // ---------- Active Work ---------- function ActiveWork({ items }) { const kindMap = { feature: { tone: 'kind-lav', icon: 'features' }, project: { tone: 'kind-sky', icon: 'projects' }, }; const toneMap = { 'At risk': { label: 'red', prog: 'red' }, 'In review': { label: 'blue', prog: 'blue' }, 'Building': { label: 'yellow', prog: 'warn' }, 'Blocked': { label: 'red', prog: 'red' }, 'Design': { label: 'purple', prog: 'purple' }, 'On track': { label: 'green', prog: 'green' }, }; return ( View all } />
{items.map((it, i) => { const km = kindMap[it.kind]; const tm = toneMap[it.status]; return (
{it.name}
{it.sub}
{it.progress}% {it.due}
); })}
); } // ---------- Recent Decisions ---------- function RecentDecisions({ items }) { return ( All decisions} />
{items.map((it, i) => (
{it.when}
{it.title}
{it.ctx}
{it.owner}
))}
); } // ---------- Product Journey ---------- function ProductJourney({ journey }) { const { phases, ticks, youAt, quarter } = journey; return (
Product Journey {quarter}
Open roadmap →
{ticks.map((t, i) => (
))}
{phases.map((p) => (
{p.label}
{p.state === 'done' && } {p.state === 'now' && ( )}
{p.title}
{p.date}
))}
You are here
Completed In progress Upcoming Attention shifting to Launch — GA to Team & Enterprise in ~3 weeks
); } // ---------- Recent Changes ---------- function RecentChanges({ groups }) { const toneMap = { brand: 'lav', blue: 'lav', green: 'mint', red: 'peach', orange: 'cream', purple: 'lav' }; return ( Activity log} />
{groups.map((g, i) => (
{g.day}
{g.items.map((it, j) => (
{it.a} {it.v}{' '} {it.what}{it.extra}
{it.time}
))}
))}
); } // ---------- File thumbnails ---------- function ThumbPreview({ kind }) { if (kind === 'doc') { return (
Research
); } if (kind === 'diagram') { return (
Architecture
); } if (kind === 'frames') { return (
{[0,1,2].map(i => (
{i === 1 &&
}
))}
Design
); } if (kind === 'chart') { return (
{[35,68,101].map(y => ())} {[42,58,50,74,66,92,80,102,88,116,104,124].map((h, i) => ( ))} {[[23,90],[42,76],[80,58],[137,50],[194,14],[232,12]].map(([x,y], i) => ( ))}
Data
); } return
; } function RecentFiles({ files }) { return ( All files} />
{files.map((f, i) => (
{f.title}
{f.kind} · {f.meta}
))}
); } // ---------- Home Hero (Phase 22) ---------- // Signature MY GENI visual moment. Editorial hero banner using the generated // visual family + the personalised greeting + today's operating focus. function HomeHero({ data }) { const user = (window.MYGENI_PEOPLE && window.MYGENI_PEOPLE.currentUser()) || {}; const firstName = (user.displayName || data.user.name || 'there').split(' ')[0]; const hour = new Date().getHours(); const timeOfDay = hour < 5 ? 'evening' : hour < 12 ? 'morning' : hour < 17 ? 'afternoon' : 'evening'; const inboxNeeds = (data.inboxItems || []).filter(i => i.state === 'needs-action').length; const overdueWork = (data.workItems || []).filter(w => w.dueBucket === 'overdue' && w.status !== 'done').length; const inFlight = (data.workItems || []).filter(w => w.status === 'in-progress').length; return (
MY GENI · Product Operating System

Good {timeOfDay}, {firstName}.

{inboxNeeds + overdueWork > 0 ? <>Today: {inboxNeeds + overdueWork} {inboxNeeds + overdueWork === 1 ? 'item needs' : 'items need'} your attention, and {inFlight} {inFlight === 1 ? 'thread is' : 'threads are'} in flight across the product. : <>Nothing needs your attention right now. {inFlight} {inFlight === 1 ? 'thread is' : 'threads are'} moving forward across the product. }

); } // ---------- Home page ---------- function Home({ data }) { const user = (window.MYGENI_PEOPLE && window.MYGENI_PEOPLE.currentUser()) || {}; const firstName = (user.displayName || data.user.name || 'there').split(' ')[0]; return (

Focus, {firstName}.

{data.today} · 4 things need your attention today
); } // ---------- Project Momentum (Phase 8) ---------- // Replaces the smaller ProductJourney tile. Combines the horizontal // stage journey with two Core 2.0-style charts: planned vs actual // progress + workstream readiness. Used on Home and re-used on the // project Overview as the "momentum band". function ProjectMomentum({ pdata }) { // Defensive: this panel is used on Home + Overview and receives whatever // project data is available. Any missing piece should degrade gracefully. if (!pdata) return null; const stages = (pdata.stages || []).map(s => ({ n: s.n, name: s.name, status: s.status, })); const momentum = pdata.momentum || { weekly: [], workstreams: [], state: 'on-track', stateNote: '' }; const currentStage = (pdata.stages || []).find(s => s.status === 'now'); return (

Project Momentum · {pdata.name}

{momentum.state === 'on-track' && 'On track'} {momentum.state === 'slipping' && 'Slipping'} {momentum.state === 'ahead' && 'Ahead of schedule'}

Planned vs Actual · cumulative % Week {pdata.execution?.elapsedWeeks || 3} of {pdata.execution?.totalWeeksHi || 12}

({ label: w.label, planned: w.planned, actual: w.actual ?? 0 }))} />
Planned Actual {momentum.stateNote}

Workstream readiness Open plan →

); } Object.assign(window, { FocusNow, NeedsReview, ActiveWork, RecentDecisions, ProductJourney, ProjectMomentum, RecentChanges, RecentFiles, Home });