// Log — the <30-second symptom log. Front-load the common path; context fields
// expand on one tap and never block saving. Smart defaults from last entries.
function SymptomSearchSheet({ open, onClose, onPick }) {
const [q, setQ] = React.useState('');
const list = DEMO.COMMON_SYMPTOMS.filter(s => s.name.toLowerCase().includes(q.toLowerCase()));
const freeText = q.trim().length > 1 && !list.some(s => s.name.toLowerCase() === q.toLowerCase());
return (
setQ(e.target.value)}
leading={} aria-label="Search symptoms" />
{list.map(s => (
))}
{freeText && (
)}
Names follow the SNOMED CT clinical list. You can add your own words too.
);
}
// Multi-select chip group with a free-text "Other" option. Custom entries are
// stored alongside presets in the same value array and render as removable pills.
function ChipMultiSelect({ presets, value, onChange, placeholder = 'Type your own' }) {
const { ChoicePill, TextInput, Button } = NB;
const [adding, setAdding] = React.useState(false);
const [draft, setDraft] = React.useState('');
const custom = value.filter(v => !presets.includes(v));
const toggle = (v) => onChange(value.includes(v) ? value.filter(x => x !== v) : [...value, v]);
const addCustom = () => {
const t = draft.trim();
if (t && !value.some(v => v.toLowerCase() === t.toLowerCase())) onChange([...value, t]);
setDraft('');
setAdding(false);
};
return (
{presets.map(t => toggle(t)}>{t})}
{custom.map(t => (
toggle(t)}>
{t}
))}
setAdding(a => !a)}>
Other
{adding && (
setDraft(e.target.value)}
onKeyDown={e => { if (e.key === 'Enter') { e.preventDefault(); addCustom(); } }}
style={{ flex: 1, height: 48 }} aria-label={placeholder} />
)}
);
}
function LogFlow({ initial, onClose, onSave, onRedFlag, onHome }) {
const seed = initial || {};
const [symptom, setSymptom] = React.useState(seed.name ? { name: seed.name, code: seed.code } : null);
const [severity, setSeverity] = React.useState(seed.severity || 5);
const [markers, setMarkers] = React.useState(seed.markers || []);
const [character, setCharacter] = React.useState(seed.character || []);
const [onset, setOnset] = React.useState(seed.onset || 'On waking');
const [duration, setDuration] = React.useState(seed.duration || 'Ongoing');
const [time, setTime] = React.useState(seed.time || '08:24');
const [note, setNote] = React.useState(seed.note || '');
const [showContext, setShowContext] = React.useState(false);
const [ctxTriggers, setCtxTriggers] = React.useState((seed.context && seed.context.triggers) || []);
const [ctxRelieving, setCtxRelieving] = React.useState((seed.context && seed.context.relieving) || []);
const [ctxMood, setCtxMood] = React.useState((seed.context && seed.context.mood) || null);
const [searchOpen, setSearchOpen] = React.useState(!seed.name);
const [voiceOpen, setVoiceOpen] = React.useState(false);
const { Button, Card, Field, SectionLabel, ChoicePill, Chip, StatusPanel, SelfReportedNote } = NB;
const toggle = (arr, set, v) => set(arr.includes(v) ? arr.filter(x => x !== v) : [...arr, v]);
// Red-flag rule check on save.
const isRedFlag = symptom && /chest|thunderclap|suicid|crushing/i.test((symptom.name + ' ' + note).toLowerCase()) && severity >= 7;
const applyVoice = (p) => {
if (p.name) setSymptom({ name: p.name, code: p.code || 'Free text — not coded' });
if (p.severity != null) setSeverity(p.severity);
if (p.character && p.character.length) setCharacter(prev => Array.from(new Set([...prev, ...p.character])));
if (p.note) setNote(prev => prev ? prev : p.note);
setVoiceOpen(false);
};
const save = () => {
if (isRedFlag) { onRedFlag({ name: symptom.name, severity }); return; }
onSave({
id: 'new-' + Date.now(),
name: symptom.name, code: symptom.code, severity, time,
date: DEMO.TODAY_LABEL, dateKey: DEMO.TODAY_KEY,
onset, duration, character, note, markers,
context: { triggers: ctxTriggers, relieving: ctxRelieving, mood: ctxMood },
});
};
const TRIGGERS = ['Poor sleep', 'Stress', 'Lifting', 'Standing', 'Sitting', 'Cold weather', 'Screen time', 'Food'];
const RELIEVING = ['Rest', 'Heat', 'Ice', 'Walking', 'Medication', 'Stretching', 'Lying down'];
return (
setVoiceOpen(true)}>} />}
footer={
{isRedFlag && (
This needs a safety check before saving.
)}
{/* Symptom */}
{/* Severity */}
{/* Onset & duration */}
{/* Location — body map */}
{/* Character */}
{DEMO.CHARACTERS.map(c => (
toggle(character, setCharacter, c)}>{c}
))}
{/* Timestamp */}
{/* Context — optional, one tap to expand */}
{showContext && (
Possible triggers
What helped
Mood & stress right now
)}
{/* Note */}
setNote(e.target.value)} rows={3} />
);
}
Object.assign(window, { LogFlow, SymptomSearchSheet, NativeSelect });