);
}
function SummaryView({ material, editing, readAloud }) {
const t = topicById(material.topic) || { name: material.title || 'Topic', notes: 0, domain: (DOMAINS[0] || {}).id };
const preset = (window.SUMMARIES || {})[material.id];
const [doc, setDoc] = React.useState(() => preset ? {
head: preset.head,
intro: preset.intro,
secs: preset.secs.map((s) => ({ ...s })),
links: preset.links || []
} : {
head: `${t.name}: the essentials`,
intro: `This summary distills your notes on ${t.name.toLowerCase()} into the ideas most worth remembering. Each section maps back to a source note, so you can jump to the original when you need depth.`,
secs: [
{ h: 'Core idea', b: 'A few sentences captured from your notes would appear here — the key claim, an example, and the takeaway you should be able to recall on demand.' },
{ h: 'Why it matters', b: 'A few sentences captured from your notes would appear here — the key claim, an example, and the takeaway you should be able to recall on demand.' },
{ h: 'Common pitfalls', b: 'A few sentences captured from your notes would appear here — the key claim, an example, and the takeaway you should be able to recall on demand.' }]
});
const eStyle = editing ? { outline: '1px dashed var(--blue)', outlineOffset: '2px', borderRadius: '6px', cursor: 'text' } : {};
const Ed = ({ value, onSave, tag = 'div', className, style }) =>
React.createElement(tag, {
className, contentEditable: editing, suppressContentEditableWarning: true, spellCheck: false,
onBlur: editing ? (e) => onSave(e.currentTarget.textContent) : undefined,
style: { ...style, ...eStyle }
}, value);
const [activeKey, setActiveKey] = React.useState(null);
const heardRef = React.useRef(false); // earns the "listen to a summary" mastery step on first playback
const blocks = React.useMemo(() => [
{ key: 'head', text: doc.head },
{ key: 'intro', text: doc.intro },
...doc.secs.map((s, i) => ({ key: 'sec' + i, text: s.h + '. ' + s.b }))
], [doc]);
const showPlayer = readAloud && !editing;
const cls = (k) => showPlayer && activeKey === k ? 'ra-active' : undefined;
React.useEffect(() => { if (!showPlayer) setActiveKey(null); }, [showPlayer]);
return (
{editing &&
Editing this summary
Click any heading or paragraph to change the words, then press “Done”.
{editing ? 'Editing — click any label to rename it.' : 'Concept map generated from your linked notes — drag a node to rearrange, or tap a concept to see its explanation.'}
A key concept from this topic. Open the summary for the full explanation.
}
);
})()}
{cmData && cmData.length > 0 &&
Key concepts
{cmData.map((c, i) =>
{c.label}
{noteText(c.label, c.note)}
)}
}
);
}
function ReviewScreen({ material, go, goBack, openTopic, openMaterial, openGenerate, toast, session, sessionGo, endSession, readAloud }) {
const [editing, setEditing] = React.useState(false);
React.useEffect(() => {setEditing(false);}, [material.id]);
// Bump when materials are (re)generated, so an in-place regenerate of the
// material currently on screen remounts with its fresh content.
const [genV, setGenV] = React.useState(0);
React.useEffect(() => {
const onGen = () => setGenV((v) => v + 1);
window.addEventListener('pl-generated', onGen);
return () => window.removeEventListener('pl-generated', onGen);
}, []);
// Completion is now explicit: the “Mark complete” button in the header records the
// review (a deck also auto-completes once every card has been rated).
return (