// Save Conversation — store finished conversations with an editable title + // summary so they're findable later (also feeds the Search history). // // Storage: localStorage key 'ct_saved_convos_v1' → array of // { id, title, summary, partner, date, label, messages } // Shape matches CT_HISTORY entries so Search can read both. window.CT_SAVED = { KEY: 'ct_saved_convos_v1', all() { try { return JSON.parse(localStorage.getItem(this.KEY) || '[]'); } catch (e) { return []; } }, save(entry) { const list = this.all(); list.unshift(entry); try { localStorage.setItem(this.KEY, JSON.stringify(list)); } catch (e) {} window.dispatchEvent(new CustomEvent('ct-saved-changed')); }, remove(id) { const list = this.all().filter(e => e.id !== id); try { localStorage.setItem(this.KEY, JSON.stringify(list)); } catch (e) {} window.dispatchEvent(new CustomEvent('ct-saved-changed')); }, }; function todayLabel() { const d = new Date(); return `${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`; } function SaveConvoSheet({ palette, dark, convo, target, native, mode = 'practice', onSaved, onDelete, onDismiss, onSnooze, autoOpened, pendingNew }) { const c = palette; const nativeLang = window.CT_LANG.byCode(native); const [title, setTitle] = React.useState(''); const [summary, setSummary] = React.useState(''); // Manual open → generate immediately (the user came here to save). Auto-open // (the 45s idle nudge) → defer: most nudges get dismissed, so we only spend an // API call once the user actually engages (focuses a field or taps Save). const [loadingSummary, setLoadingSummary] = React.useState(!autoOpened); const genRef = React.useRef(false); // has generation already started? const mountedRef = React.useRef(true); React.useEffect(() => () => { mountedRef.current = false; }, []); // Generate a title + summary from the transcript. Runs at most once; returns // the generated { title, summary } so a caller (doSave) can use the values // without waiting for a state update. async function generate() { if (genRef.current) return { title, summary }; genRef.current = true; if (mountedRef.current) setLoadingSummary(true); const transcript = convo.map(m => { const who = m.side === 'me' ? 'Me' : 'Them'; let line = `${who}: ${m.orig}${m.trans ? ' (' + m.trans + ')' : ''}`; if (m.side === 'them' && typeof m.pickedIdx === 'number' && m.suggestions && m.suggestions[m.pickedIdx]) { const pick = m.suggestions[m.pickedIdx]; line += `\nMe: ${pick.en}${pick.ko ? ' (' + pick.ko + ')' : ''}`; } return line; }).join('\n'); let t = '', s = ''; try { const res = await window.CT_API.complete( `Here is a bilingual conversation transcript. In ${nativeLang.native}, produce:\n` + `1) a short title (max 6 words) — guess the other person's name if mentioned, else the topic\n` + `2) a 2-3 sentence summary of what was discussed.\n` + `Return strict JSON on one line: {"title":"...","summary":"..."}\n\nTranscript:\n${transcript}`, { silent: true } ); const raw = String(res).trim().replace(/^```json\s*/i,'').replace(/```\s*$/,''); let parsed = null; try { parsed = JSON.parse(raw); } catch (e) {} if (parsed) { t = parsed.title || ''; s = parsed.summary || ''; } else { s = raw; } } catch (e) { /* leave blank on failure */ } if (mountedRef.current) { setTitle(t); setSummary(s); setLoadingSummary(false); } return { title: t, summary: s }; } // Manual open: generate now. Auto-open: defer until the user engages. React.useEffect(() => { if (!autoOpened) generate(); }, []); async function doSave() { // If the sheet auto-opened and the user taps Save without engaging, generate // the title/summary now (once) so the saved entry still gets one. let t = title, s = summary; if (!genRef.current && convo.length) { const g = await generate(); t = g.title || t; s = g.summary || s; } const entry = { id: 'saved-' + Date.now(), title: (t || window.t('untitledConvo')).trim(), summary: s.trim(), partner: (t || window.t('convoWord')).trim(), topic: s.trim().slice(0, 60) || window.t('savedConvoTopic'), date: todayLabel(), label: window.t('savedLabel'), mode: mode === 'live' ? 'live' : 'practice', // which screen produced it // Flatten: for each "them" message, keep it; if I picked one of its // suggestions, append my chosen reply as a "me" message so the saved // transcript reads as a real back-and-forth. messages: (() => { const out = []; for (const m of convo) { out.push({ side: m.side, orig: m.orig, trans: m.trans, time: m.time }); if (m.side === 'them' && typeof m.pickedIdx === 'number' && m.suggestions && m.suggestions[m.pickedIdx]) { const pick = m.suggestions[m.pickedIdx]; out.push({ side: 'me', orig: pick.ko, trans: pick.en, time: m.time, inputKind: 'picked' }); } } return out; })(), }; window.CT_SAVED.save(entry); onSaved && onSaved(entry); } return (
e.stopPropagation()} style={{ width: '100%', background: c.surface, borderRadius: '24px 24px 0 0', padding: '10px 18px 20px', animation: 'svSlide .24s ease-out', boxShadow: '0 -8px 24px rgba(0,18,38,0.22)', maxHeight: '88%', overflowY: 'auto', }}>
{pendingNew ? window.t('startNewQ') : window.t('saveThisQ')}
{pendingNew ? window.t('startNewDesc') : window.t('saveThisDesc')}
{/* Title */}
setTitle(e.target.value)} onFocus={() => generate()} placeholder={loadingSummary ? window.t('titleGenerating') : window.t('titlePlaceholder')} style={{ width: '100%', marginTop: 5, border: `1.5px solid ${c.divider}`, borderRadius: 12, padding: '10px 12px', fontSize: 14, color: c.ink, background: c.bg, outline: 'none', fontFamily: 'inherit', fontWeight: 600, }} />
{/* Summary */}