// Pages — part 1: Today, Life Tree, Life Graph, Timeline.
(function () {
const { useState, useEffect, useRef } = React;
const { cx, wash } = LMTXUtil;
const I = window.LMTIcons;
const D = LMTData, D2 = LMTX2;
function Page({ children, max = 1240 }) {
return
{children}
;
}
window.LMTXPage = Page;
// Framed viz "window" — keeps the luminous tree canvas, frames it for dark mode.
function VizWindow({ children, height = 360, title, right, glow }) {
return (
{title &&
{title}{right}
}
{glow && }
{children}
);
}
window.LMTXVizWindow = VizWindow;
// ── TODAY ─────────────────────────────────────────────────────────────────
function PageToday({ go, onCapture }) {
const [bucket, setBucket] = useState('all');
const items = bucket === 'all' ? D.todayItems : D.todayItems.filter(t => t.bucket === bucket);
const counts = D.todayItems.reduce((a,t) => (a[t.bucket]=(a[t.bucket]||0)+1, a), {});
return (
} title="Good morning, Prabhat"
sub="Mostly shipping this week — two deploys and a late-night rollback, but the promo finally landed. Four things still want your attention."
right={<>
}/>
{/* recency band */}
);
}
function EchoIcon({ kind }) {
const m = { anniversary:I.Cal, recurring:I.Undo, pattern:I.Heart, gap:I.Clock }[kind] || I.Bell;
const M = m; return ;
}
window.LMTXEchoIcon = EchoIcon;
// ── LIFE TREE ──────────────────────────────────────────────────────────────
function PageTree({ go }) {
const [season, setSeason] = useState('all');
const [sel, setSel] = useState(null);
return (
} title="Your Life Tree"
sub="Every leaf is a memory. Colour is recency — fresh green this week, fading to stone over a year. Branches are your scenes."
right={}/>
{D.scenes.map((s,i) => (
))}
}>The two newest leaves sit on Lin & me and Family. Tap a branch to prune, rename, or share.
);
}
function Mini({ label, value, sub, accent, tone }) {
return (
{label}
{value}
{sub}
);
}
window.LMTXMini = Mini;
// ── LIFE GRAPH ──────────────────────────────────────────────────────────────
function PageGraph({ go }) {
const [sel, setSel] = useState('e03');
const ev = D.events.find(e => e.id === sel);
return (
} title="Your Life Graph"
sub="The same memories, rewired as a network. Edges are relations the Weaver found — what causes, follows, and echoes what."
right={}/>
{ev && }
Connected through
{[['part-of','Dad\'s 70th — dinner at the lake'],['follows','Lin called from Kyoto'],['causes','Started running again']].map(([rel,t]) => {
const c = LMT.connections[rel];
return
{c.arrow} {c.label}{t}
;
})}
{D.events.slice(0,6).map(e => (
))}
);
}
// ── TIMELINE ────────────────────────────────────────────────────────────────
function PageTimeline({ go }) {
const groups = [
{ label:'This week', items: D.events.filter(e => e.daysSince < 7) },
{ label:'Earlier this month', items: D.events.filter(e => e.daysSince >= 7 && e.daysSince < 30) },
{ label:'This season', items: D.events.filter(e => e.daysSince >= 30 && e.daysSince < 90) },
{ label:'Older', items: D.events.filter(e => e.daysSince >= 90) },
].filter(g => g.items.length);
return (
} title="Timeline"
sub="Your memories laid end to end. The spine fades from fresh green to stone as you scroll back through the year."
right={{}} tabs={[{id:'all',label:'All'},{id:'fragile',label:'Fragile'},{id:'media',label:'With media'}]}/>}/>