// idea-3-squads.jsx - Study Squads MVP. // Invite-only structured sessions: no chat, no DMs, no video. const SQ_PHASES = [ { icon: 'target', label: 'Check-in', copy: 'Each student sets one exam-practice goal for the session.' }, { icon: 'pencil', label: 'Attempt', copy: 'Students answer the same question pack individually first.' }, { icon: 'book', label: 'Reveal', copy: 'Model answers and rubrics unlock after the attempt window.' }, { icon: 'check', label: 'Repair', copy: 'Everyone rewrites one weak response before the session closes.' }, ]; const SQ_SESSION_PHASES = [ { key: 'scheduled', label: 'Scheduled', icon: 'clock', copy: 'The session is ready, but students have not checked in yet.' }, { key: 'check_in', label: 'Check-in', icon: 'flag', copy: 'Students arrive and set one goal for the question pack.' }, { key: 'attempt', label: 'Attempt', icon: 'pencil', copy: 'Students answer independently before seeing anyone else.' }, { key: 'reveal', label: 'Reveal', icon: 'book', copy: 'Responses and model-answer comparison can unlock.' }, { key: 'repair', label: 'Repair', icon: 'pencil', copy: 'Students rewrite one weak response using model and peer feedback.' }, { key: 'complete', label: 'Complete', icon: 'check', copy: 'The session is closed and ready for review.' }, ]; const SQ_GUARDS = [ 'Invite-only squads of 3-5 students (target 4)', 'Avatar/display-name identity only', 'No open chat, direct messages, voice, or video', 'Answers stay private until reveal phase', ]; const SQ_SUBJECTS = [ { value: 'biology', label: 'Biology' }, { value: 'chemistry', label: 'Chemistry' }, { value: 'physics', label: 'Physics' }, { value: 'maths-standard', label: 'Maths Standard' }, { value: 'maths-advanced', label: 'Maths Advanced' }, ]; const SQ_DAYS = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']; // Timed attempt window (client-side). 2 MC + 2 SA under exam-like time pressure. const SQ_ATTEMPT_MINUTES = 12; // Answer JSON budget. The DB column check is char_length(answer_text) 1..8000, // so the SERIALISED JSON (attempt + repair) must fit within 8000. Field caps are // chosen so a full attempt (2 SA) plus a repair always serialises under budget // without ever slicing the JSON string. Textarea maxLengths match these caps. const SQ_MAX_ANSWER_JSON = 8000; const SQ_SA_CAP = 2500; // per short-answer const SQ_REPAIR_CAP = 2000; // repaired answer const SQ_REAL_PACKS = [ { ref: 'biology-y11-module1', title: 'Biology Y11 Module 1', path: 'subjects/biology/year11/module1/question-bank-data.js', prefix: 'bio-y11-m1-l' }, { ref: 'biology-y11-module2', title: 'Biology Y11 Module 2', path: 'subjects/biology/year11/module2/question-bank-data.js', prefix: 'bio-y11-m2-l' }, { ref: 'biology-y11-module3', title: 'Biology Y11 Module 3', path: 'subjects/biology/year11/module3/question-bank-data.js', prefix: 'bio-y11-m3-l' }, { ref: 'biology-y11-module4', title: 'Biology Y11 Module 4', path: 'subjects/biology/year11/module4/question-bank-data.js', prefix: 'bio-y11-m4-l' }, { ref: 'biology-y12-module5', title: 'Biology Y12 Module 5', path: 'subjects/biology/year12/module5/question-bank-data.js', prefix: 'bio-y12-m5-l' }, { ref: 'biology-y12-module6', title: 'Biology Y12 Module 6', path: 'subjects/biology/year12/module6/question-bank-data.js', prefix: 'bio-y12-m6-l' }, { ref: 'biology-y12-module7', title: 'Biology Y12 Module 7', path: 'subjects/biology/year12/module7/question-bank-data.js', prefix: 'bio-y12-m7-l' }, { ref: 'biology-y12-module8', title: 'Biology Y12 Module 8', path: 'subjects/biology/year12/module8/question-bank-data.js', prefix: 'bio-y12-m8-l' }, { ref: 'chemistry-y11-module1', title: 'Chemistry Y11 Module 1', path: 'subjects/chemistry/year11/module1/question-bank-data.js', prefix: 'chem-y11-m1-l' }, { ref: 'chemistry-y11-module2', title: 'Chemistry Y11 Module 2', path: 'subjects/chemistry/year11/module2/question-bank-data.js', prefix: 'chem-y11-m2-l' }, { ref: 'chemistry-y11-module3', title: 'Chemistry Y11 Module 3', path: 'subjects/chemistry/year11/module3/question-bank-data.js', prefix: 'chem-y11-m3-l' }, { ref: 'chemistry-y11-module4', title: 'Chemistry Y11 Module 4', path: 'subjects/chemistry/year11/module4/question-bank-data.js', prefix: 'chem-y11-m4-l' }, { ref: 'chemistry-y12-module5', title: 'Chemistry Y12 Module 5', path: 'subjects/chemistry/year12/module5/question-bank-data.js', prefix: 'chem-y12-m5-l' }, { ref: 'chemistry-y12-module6', title: 'Chemistry Y12 Module 6', path: 'subjects/chemistry/year12/module6/question-bank-data.js', prefix: 'chem-y12-m6-l' }, { ref: 'chemistry-y12-module7', title: 'Chemistry Y12 Module 7', path: 'subjects/chemistry/year12/module7/question-bank-data.js', prefix: 'chem-y12-m7-l' }, { ref: 'chemistry-y12-module8', title: 'Chemistry Y12 Module 8', path: 'subjects/chemistry/year12/module8/question-bank-data.js', prefix: 'chem-y12-m8-l' }, { ref: 'maths-advanced-y11-module1', title: 'Maths Advanced Y11 Module 1', path: 'subjects/maths-advanced/year11/module1/question-bank-data.js', prefix: 'maths-adv-y11-m1' }, { ref: 'maths-advanced-y11-module2', title: 'Maths Advanced Y11 Module 2', path: 'subjects/maths-advanced/year11/module2/question-bank-data.js', prefix: 'maths-adv-y11-m2' }, { ref: 'maths-advanced-y11-module3', title: 'Maths Advanced Y11 Module 3', path: 'subjects/maths-advanced/year11/module3/question-bank-data.js', prefix: 'maths-adv-y11-m3-l' }, { ref: 'maths-y7-unit3', title: 'Maths Y7 Unit 3', path: 'subjects/maths/year7/unit3/question-bank-data.js', prefix: 'maths-y7-u3' }, { ref: 'maths-y8-unit1', title: 'Maths Y8 Unit 1', path: 'subjects/maths/year8/unit1/question-bank-data.js', prefix: 'maths-y8-u1' }, { ref: 'maths-standard-y11-module1', title: 'Maths Standard Y11 Module 1', path: 'subjects/maths-standard/year11/module1/question-bank-data.js', prefix: 'maths-std-y11-m1-l' }, { ref: 'maths-standard-y11-module2', title: 'Maths Standard Y11 Module 2', path: 'subjects/maths-standard/year11/module2/question-bank-data.js', prefix: 'ms-y11-m2' }, { ref: 'maths-standard-y11-module3', title: 'Maths Standard Y11 Module 3', path: 'subjects/maths-standard/year11/module3/question-bank-data.js', prefix: 'maths-std-y11-m3-l' }, { ref: 'maths-standard-y11-module4', title: 'Maths Standard Y11 Module 4', path: 'subjects/maths-standard/year11/module4/question-bank-data.js', prefix: 'ms-y11-m4' }, { ref: 'maths-standard-y12-module5', title: 'Maths Standard Y12 Module 5', path: 'subjects/maths-standard/year12/module5/question-bank-data.js', prefix: 'maths-std-y12-m5-l' }, { ref: 'maths-standard-y12-module6', title: 'Maths Standard Y12 Module 6', path: 'subjects/maths-standard/year12/module6/question-bank-data.js', prefix: 'maths-std-y12-m6-l' }, { ref: 'maths-standard-y12-module7', title: 'Maths Standard Y12 Module 7', path: 'subjects/maths-standard/year12/module7/question-bank-data.js', prefix: 'ms-y12-m7' }, { ref: 'maths-standard-y12-module8', title: 'Maths Standard Y12 Module 8', path: 'subjects/maths-standard/year12/module8/question-bank-data.js', prefix: 'ms-y12-m8' }, { ref: 'physics-y11-module1', title: 'Physics Y11 Module 1', path: 'subjects/physics/year11/module1/question-bank-data.js', prefix: 'phys-y11-m1' }, { ref: 'physics-y11-module2', title: 'Physics Y11 Module 2', path: 'subjects/physics/year11/module2/question-bank-data.js', prefix: 'phys-y11-m2-l' }, { ref: 'physics-y11-module3', title: 'Physics Y11 Module 3', path: 'subjects/physics/year11/module3/question-bank-data.js', prefix: 'phys-y11-m3-l' }, { ref: 'physics-y11-module4', title: 'Physics Y11 Module 4', path: 'subjects/physics/year11/module4/question-bank-data.js', prefix: 'phys-y11-m4-l' }, { ref: 'physics-y12-module5', title: 'Physics Y12 Module 5', path: 'subjects/physics/year12/module5/question-bank-data.js', prefix: 'phys-y12-m5-l' }, { ref: 'physics-y12-module6', title: 'Physics Y12 Module 6', path: 'subjects/physics/year12/module6/question-bank-data.js', prefix: 'phys-y12-m6-l' }, { ref: 'physics-y12-module7', title: 'Physics Y12 Module 7', path: 'subjects/physics/year12/module7/question-bank-data.js', prefix: 'phys-y12-m7-l' }, { ref: 'physics-y12-module8', title: 'Physics Y12 Module 8', path: 'subjects/physics/year12/module8/question-bank-data.js', prefix: 'phys-y12-m8-l' }, ]; const SQ_PACK_ALIASES = { 'bio-y12-m5': 'biology-y12-module5', 'bio-y12-m7': 'biology-y12-module7', 'chem-y11-m3': 'chemistry-y11-module3', 'chem-y12-m5': 'chemistry-y12-module5', 'chem-y12-m6': 'chemistry-y12-module6', 'physics-y12-m5': 'physics-y12-module5', 'maths-advanced-y11-m3': 'maths-advanced-y11-module3', 'maths-standard-y11-m3': 'maths-standard-y11-module3', }; const SQ_QUESTION_PACKS = { 'manual-pack-1': { title: 'Practice pack', question: 'Answer the assigned practice questions, then choose one response to compare during reveal.', model: 'Use the official class notes or teacher-provided solution as the model response for this pack.', rubric: ['Addresses the command verb', 'Uses relevant syllabus terms', 'Links evidence to the final judgement'], }, 'bio-y12-m7-pack-01': { title: 'Immune response short answer', question: 'Explain how antibodies help the body respond to a pathogen.', model: 'Antibodies are specific proteins produced by B cells that bind to antigens on a pathogen. This can neutralise the pathogen, tag it for phagocytosis, or activate other immune responses.', rubric: ['Identifies antibodies as specific proteins', 'Links antibody binding to antigens', 'Explains at least one outcome such as neutralisation or phagocytosis'], }, }; function StudySquads() { const db = window.HSC && window.HSC.supabase; const auth = window.HSC && window.HSC.auth; const [authReady, setAuthReady] = React.useState(!auth); const [user, setUser] = React.useState(null); const [squads, setSquads] = React.useState([]); const [sessions, setSessions] = React.useState([]); const [answers, setAnswers] = React.useState([]); const [invites, setInvites] = React.useState([]); const [attendance, setAttendance] = React.useState([]); const [peerReviews, setPeerReviews] = React.useState([]); const [memberBlocks, setMemberBlocks] = React.useState([]); const [aiFeedback, setAiFeedback] = React.useState([]); const [questionPack, setQuestionPack] = React.useState(null); const [questionPackState, setQuestionPackState] = React.useState(''); const [loadingSquads, setLoadingSquads] = React.useState(false); const [loadingSessions, setLoadingSessions] = React.useState(false); const [saveState, setSaveState] = React.useState(''); const [sessionSaveState, setSessionSaveState] = React.useState(''); const [phaseSaveState, setPhaseSaveState] = React.useState(''); const [answerSaveState, setAnswerSaveState] = React.useState(''); const [inviteSaveState, setInviteSaveState] = React.useState(''); const [attendanceSaveState, setAttendanceSaveState] = React.useState(''); const [peerSaveState, setPeerSaveState] = React.useState(''); const [reportSaveState, setReportSaveState] = React.useState(''); const [blockSaveState, setBlockSaveState] = React.useState(''); const [aiSaveState, setAiSaveState] = React.useState(''); const [joinState, setJoinState] = React.useState(''); const [selectedSessionId, setSelectedSessionId] = React.useState(''); const [error, setError] = React.useState(''); const [answerText, setAnswerText] = React.useState(''); const [commitmentText, setCommitmentText] = React.useState(''); const [peerDrafts, setPeerDrafts] = React.useState({}); // Structured attempt (2 MC + 2 SA): drafts keyed by question id. const [attemptDraft, setAttemptDraft] = React.useState({ mc: {}, sa: {} }); const [nowTs, setNowTs] = React.useState(Date.now()); // Repair phase: which of the student's own answers they rewrite, and the rewrite. const [repairTarget, setRepairTarget] = React.useState(''); const [repairText, setRepairText] = React.useState(''); const [repairSaveState, setRepairSaveState] = React.useState(''); const [joinCode, setJoinCode] = React.useState(''); const [reportForm, setReportForm] = React.useState({ category: 'safety', detail: '', }); const [form, setForm] = React.useState({ name: 'Exam practice squad', subject: 'biology', year_group: '12', module_label: 'Module focus', max_members: '4', recurring_days: ['Tue', 'Thu'], recurring_time_local: '19:30', }); const [sessionForm, setSessionForm] = React.useState({ squad_id: '', title: 'Question pack practice', date: nextLocalDate(), time: '19:30', question_pack_ref: 'manual-pack-1', }); const [inviteForm, setInviteForm] = React.useState({ squad_id: '', max_uses: '4', }); React.useEffect(() => { let alive = true; async function init() { if (!auth) { setAuthReady(true); return; } const resolvedUser = await auth.ready; if (!alive) return; setUser(resolvedUser || null); setAuthReady(true); } init(); return () => { alive = false; }; }, []); React.useEffect(() => { if (!user || !db) { setSquads([]); return; } loadSquads(); }, [user, db]); React.useEffect(() => { if (!user || !db) { setSessions([]); return; } loadSessions(); loadInvites(); }, [user, db]); React.useEffect(() => { if (!user || !db || !selectedSessionId) { setAnswers([]); setAnswerText(''); setAttendance([]); setPeerReviews([]); setMemberBlocks([]); setAiFeedback([]); setCommitmentText(''); setPeerDrafts({}); setRepairTarget(''); setRepairText(''); return; } // Clear repair state up front so nothing stale flashes across a session // switch; loadAnswers re-hydrates it deterministically for this session. setRepairTarget(''); setRepairText(''); loadAnswers(selectedSessionId); loadAttendance(selectedSessionId); loadPeerReviews(selectedSessionId); loadMemberBlocks(selectedSessionId); loadAiFeedback(selectedSessionId); }, [user, db, selectedSessionId, sessions]); React.useEffect(() => { if (!selectedSessionId || !sessions.length) { setQuestionPack(null); setQuestionPackState(''); return; } const session = sessions.find(item => item.id === selectedSessionId) || sessions[0]; loadQuestionPack(session && session.question_pack_ref); }, [selectedSessionId, sessions]); async function loadSquads() { if (!db || !user) return; setLoadingSquads(true); const result = await db.from('study_squads') .select('id, name, subject, year_group, module_label, status, max_members, recurring_days, recurring_time_local, created_at, created_by') .order('created_at', { ascending: false }) .limit(12); setLoadingSquads(false); if (result.error) { setError('Could not load your squads yet.'); return; } const nextSquads = result.data || []; setSquads(nextSquads); setSessionForm(prev => prev.squad_id || !nextSquads.length ? prev : Object.assign({}, prev, { squad_id: nextSquads[0].id, question_pack_ref: chooseDefaultPackForSquad(nextSquads[0]) || prev.question_pack_ref })); setInviteForm(prev => prev.squad_id || !nextSquads.length ? prev : Object.assign({}, prev, { squad_id: nextSquads[0].id, max_uses: String(nextSquads[0].max_members || 4) })); } async function loadSessions() { if (!db || !user) return; setLoadingSessions(true); const result = await db.from('study_sessions') .select('id, squad_id, title, scheduled_for, phase, question_pack_ref, created_at, updated_at') .order('scheduled_for', { ascending: true, nullsFirst: false }) .limit(20); setLoadingSessions(false); if (result.error) { setError('Could not load squad sessions yet.'); return; } const nextSessions = result.data || []; setSessions(nextSessions); setSelectedSessionId(prev => prev || (nextSessions[0] && nextSessions[0].id) || ''); } async function loadAnswers(sessionId) { if (!db || !user || !sessionId) return; const result = await db.from('study_session_answers') .select('id, session_id, user_id, answer_text, submitted_at') .eq('session_id', sessionId) .order('submitted_at', { ascending: true }); if (result.error) { setAnswers([]); return; } const nextAnswers = result.data || []; setAnswers(nextAnswers); const ownAnswer = nextAnswers.find(answer => answer.user_id === user.id); setAnswerText(ownAnswer ? ownAnswer.answer_text : ''); // Hydrate the structured attempt draft + any existing repair from own row. // Repair state is set deterministically for THIS session (never carried over // stale from a previously-selected session), and the target is validated // against the current SA ids so a stale/invalid target can't persist. if (ownAnswer) { const parsed = parseSquadAnswer(ownAnswer.answer_text); const mc = {}; const sa = {}; (parsed.mc || []).forEach(m => { if (m.choiceIndex != null) mc[m.qid] = m.choiceIndex; }); (parsed.sa || []).forEach(s => { sa[s.qid] = s.text || ''; }); setAttemptDraft({ mc: mc, sa: sa }); const validTargets = (parsed.sa || []).map(s => 'sa:' + s.qid); const repairTargetValid = parsed.repair && parsed.repair.text && validTargets.indexOf(parsed.repair.target) !== -1; setRepairTarget(repairTargetValid ? parsed.repair.target : ''); setRepairText(repairTargetValid ? (parsed.repair.text || '') : ''); } else { setAttemptDraft({ mc: {}, sa: {} }); setRepairTarget(''); setRepairText(''); } } async function loadAttendance(sessionId) { if (!db || !user || !sessionId) return; const result = await db.from('study_session_attendance') .select('id, session_id, user_id, status, checked_in_at, completed_at, commitment_text') .eq('session_id', sessionId) .order('updated_at', { ascending: false }); if (result.error) { setAttendance([]); return; } const nextAttendance = result.data || []; setAttendance(nextAttendance); const ownAttendance = nextAttendance.find(row => row.user_id === user.id); setCommitmentText(ownAttendance && ownAttendance.commitment_text ? ownAttendance.commitment_text : ''); } async function loadPeerReviews(sessionId) { if (!db || !user || !sessionId) return; const result = await db.from('study_session_peer_reviews') .select('id, session_id, answer_id, reviewer_id, reviewed_user_id, rubric_hits, improvement_text, updated_at') .eq('session_id', sessionId) .order('updated_at', { ascending: false }); if (result.error) { setPeerReviews([]); return; } const nextReviews = result.data || []; setPeerReviews(nextReviews); setPeerDrafts(prev => { const next = Object.assign({}, prev); nextReviews.filter(review => review.reviewer_id === user.id).forEach(review => { next[review.answer_id] = { rubric_hits: review.rubric_hits || {}, improvement_text: review.improvement_text || '' }; }); return next; }); } async function loadMemberBlocks(sessionId) { if (!db || !user || !sessionId) return; const session = sessions.find(item => item.id === sessionId); if (!session) return; const result = await db.from('study_squad_member_blocks') .select('id, blocker_id, blocked_user_id, squad_id, session_id, reason, created_at') .eq('blocker_id', user.id) .eq('squad_id', session.squad_id); if (result.error) { setMemberBlocks([]); return; } setMemberBlocks(result.data || []); } async function loadAiFeedback(sessionId) { if (!db || !user || !sessionId) return; const result = await db.from('study_session_ai_feedback') .select('id, session_id, answer_id, user_id, requested_by, model, mark_estimate, confidence, strengths, missing_criteria, improvement, exemplar, safety_note, created_at, updated_at') .eq('session_id', sessionId) .eq('requested_by', user.id) .order('updated_at', { ascending: false }); if (result.error) { setAiFeedback([]); return; } setAiFeedback(result.data || []); } async function loadInvites() { if (!db || !user) return; const result = await db.from('study_squad_invites') .select('id, squad_id, invite_code, status, max_uses, uses_count, expires_at, created_at') .order('created_at', { ascending: false }) .limit(20); if (result.error) { setInvites([]); return; } setInvites(result.data || []); } function updateForm(key, value) { setForm(prev => Object.assign({}, prev, { [key]: value })); } function updateSessionForm(key, value) { setSessionForm(prev => Object.assign({}, prev, { [key]: value })); } function updateSessionSquad(squadId) { const squad = squads.find(item => item.id === squadId); setSessionForm(prev => Object.assign({}, prev, { squad_id: squadId, question_pack_ref: chooseDefaultPackForSquad(squad) || prev.question_pack_ref })); } function updateInviteForm(key, value) { setInviteForm(prev => Object.assign({}, prev, { [key]: value })); } function toggleDay(day) { setForm(prev => { const days = prev.recurring_days.includes(day) ? prev.recurring_days.filter(d => d !== day) : prev.recurring_days.concat(day).slice(0, 2); return Object.assign({}, prev, { recurring_days: days }); }); } async function createSquad() { if (!db || !user) return; setError(''); setSaveState('saving'); const payload = { created_by: user.id, name: cleanSquadText(form.name, 60) || 'Exam practice squad', subject: form.subject, year_group: Number(form.year_group) || 12, module_label: cleanSquadText(form.module_label, 40) || null, visibility: 'invite_only', status: 'forming', max_members: Math.max(3, Math.min(5, Number(form.max_members) || 4)), recurring_days: form.recurring_days, recurring_time_local: form.recurring_time_local || null, timezone: 'Australia/Sydney' }; const created = await db.from('study_squads').insert(payload).select('id').single(); if (created.error || !created.data) { setSaveState(''); setError('Could not create the squad. Try again in a moment.'); return; } const member = await db.from('study_squad_members').insert({ squad_id: created.data.id, user_id: user.id, role: 'owner', status: 'active', joined_at: new Date().toISOString() }); if (member.error) { setSaveState(''); setError('Squad was created, but owner membership could not be saved yet.'); await loadSquads(); return; } setSaveState('saved'); await loadSquads(); await loadSessions(); } async function createSession() { if (!db || !user || !sessionForm.squad_id) return; setError(''); setSessionSaveState('saving'); const scheduledFor = makeScheduledIso(sessionForm.date, sessionForm.time); const payload = { squad_id: sessionForm.squad_id, created_by: user.id, title: cleanSquadText(sessionForm.title, 120) || 'Question pack practice', scheduled_for: scheduledFor, phase: 'scheduled', question_pack_ref: cleanSquadText(sessionForm.question_pack_ref, 80) || null }; const result = await db.from('study_sessions').insert(payload); if (result.error) { setSessionSaveState(''); setError('Could not schedule that session yet.'); return; } setSessionSaveState('saved'); await loadSessions(); } async function createInvite() { if (!db || !user || !inviteForm.squad_id) return; setError(''); setInviteSaveState('saving'); const payload = { squad_id: inviteForm.squad_id, created_by: user.id, invite_code: makeInviteCode(), status: 'active', max_uses: Math.max(1, Math.min(5, Number(inviteForm.max_uses) || 4)), uses_count: 0 }; const result = await db.from('study_squad_invites').insert(payload); if (result.error) { setInviteSaveState(''); setError('Could not create that invite code yet.'); return; } setInviteSaveState('saved'); await loadInvites(); } async function revokeInvite(invite) { if (!db || !user || !invite) return; setError(''); setInviteSaveState('saving'); const result = await db.from('study_squad_invites') .update({ status: 'revoked', updated_at: new Date().toISOString() }) .eq('id', invite.id); if (result.error) { setInviteSaveState(''); setError('Could not revoke that invite yet.'); return; } setInviteSaveState('saved'); await loadInvites(); } async function joinSquadByCode() { if (!db || !user) return; const code = cleanInviteCode(joinCode); if (!code) return; setError(''); setJoinState('joining'); const result = await db.rpc('join_study_squad_by_code', { p_invite_code: code }); if (result.error) { setJoinState(''); setError('That invite code could not be used.'); return; } setJoinState('joined'); setJoinCode(''); await loadSquads(); await loadSessions(); await loadInvites(); } async function updateSessionPhase(session, phase) { if (!db || !user || !session || !phase) return; setError(''); setPhaseSaveState('saving'); const stampedAt = new Date().toISOString(); const result = await db.from('study_sessions') .update({ phase: phase, updated_at: stampedAt }) .eq('id', session.id); if (result.error) { setPhaseSaveState(''); setError('Could not update that session phase yet.'); return; } // Keep updated_at in sync locally so the shared attempt timer (derived from // updated_at) starts immediately for the owner without a full reload. setSessions(prev => prev.map(item => item.id === session.id ? Object.assign({}, item, { phase: phase, updated_at: stampedAt }) : item)); setSelectedSessionId(session.id); setPhaseSaveState('saved'); await loadAnswers(session.id); await loadAttendance(session.id); await loadPeerReviews(session.id); await loadAiFeedback(session.id); } async function submitAnswer() { if (!db || !user || !selectedSession || selectedSession.phase !== 'attempt') return; // Serialise the structured 2 MC + 2 SA attempt to JSON in answer_text. // SEAM: photo capture → AI transcription. Today students TYPE their SA // answers into attemptDraft.sa. When the transcription edge function is // added later, it fills the same attemptDraft.sa[qid] strings from a photo // and this submit path is unchanged. const q = attemptQuestions; const answerObj = { v: 1, mc: q.mc.map(m => ({ qid: m.qid, choiceIndex: attemptDraft.mc[m.qid] == null ? null : attemptDraft.mc[m.qid] })), sa: q.sa.map(s => ({ qid: s.qid, text: cleanAnswerText(attemptDraft.sa[s.qid] || '') })), repair: null }; const serialised = serialiseSquadAnswer(answerObj); if (!answerHasContent(answerObj)) return; setError(''); setAnswerSaveState('saving'); // The UPDATE privilege is now column-scoped to answer_text only, so we must // not upsert (which would try to write visibility/submitted_at on conflict). // Insert on first submit (other columns take their DB defaults); update only // answer_text on re-submit. Fall back to update if a row already exists. const existing = answers.find(a => a.user_id === user.id); let result; if (existing) { result = await db.from('study_session_answers') .update({ answer_text: serialised }) .eq('session_id', selectedSession.id) .eq('user_id', user.id); } else { result = await db.from('study_session_answers') .insert({ session_id: selectedSession.id, user_id: user.id, answer_text: serialised }); if (result.error && result.error.code === '23505') { result = await db.from('study_session_answers') .update({ answer_text: serialised }) .eq('session_id', selectedSession.id) .eq('user_id', user.id); } } if (result.error) { setAnswerSaveState(''); setError('Could not save your answer yet.'); return; } setAnswerSaveState('saved'); await loadAnswers(selectedSession.id); } // Repair phase: rewrite ONE weak answer using the feedback received. Stored // inside the same answer row's JSON (original attempt preserved), written via // the repair-phase UPDATE policy. async function saveRepair() { if (!db || !user || !selectedSession || selectedSession.phase !== 'repair') return; const rewrite = cleanAnswerText(repairText); if (!repairTarget || !rewrite) return; const ownRow = answers.find(a => a.user_id === user.id); if (!ownRow) { setError('Submit an answer during the attempt phase before repairing.'); return; } const parsed = parseSquadAnswer(ownRow.answer_text); // Validate the target against the current answer's SA ids so a stale target // can never be written. The server trigger also preserves mc/sa regardless. const validTargets = (parsed.sa || []).map(s => 'sa:' + s.qid); if (validTargets.indexOf(repairTarget) === -1) { setError('Choose which short answer you are repairing.'); return; } parsed.repair = { target: repairTarget, text: rewrite, at: new Date().toISOString() }; setError(''); setRepairSaveState('saving'); const result = await db.from('study_session_answers') .update({ answer_text: serialiseSquadAnswer(parsed) }) .eq('session_id', selectedSession.id) .eq('user_id', user.id); if (result.error) { setRepairSaveState(''); setError('Could not save your repaired answer yet.'); return; } setRepairSaveState('saved'); await loadAnswers(selectedSession.id); } function updateAttemptMc(qid, choiceIndex) { setAttemptDraft(prev => Object.assign({}, prev, { mc: Object.assign({}, prev.mc, { [qid]: choiceIndex }) })); } function updateAttemptSa(qid, text) { setAttemptDraft(prev => Object.assign({}, prev, { sa: Object.assign({}, prev.sa, { [qid]: text }) })); } async function markAttendance(status) { if (!db || !user || !selectedSession) return; setError(''); setAttendanceSaveState('saving'); const existing = attendance.find(row => row.user_id === user.id); const now = new Date().toISOString(); const payload = { session_id: selectedSession.id, user_id: user.id, status: status, checked_in_at: existing && existing.checked_in_at ? existing.checked_in_at : now, completed_at: status === 'completed' ? now : existing ? existing.completed_at : null, commitment_text: status === 'completed' ? cleanCommitmentText(commitmentText) || null : existing ? existing.commitment_text : null, updated_at: now }; const result = await db.from('study_session_attendance') .upsert(payload, { onConflict: 'session_id,user_id' }); if (result.error) { setAttendanceSaveState(''); setError('Could not save your attendance yet.'); return; } setAttendanceSaveState('saved'); await loadAttendance(selectedSession.id); } function togglePeerHit(answerId, index) { setPeerDrafts(prev => { const draft = prev[answerId] || { rubric_hits: {}, improvement_text: '' }; const hits = Object.assign({}, draft.rubric_hits || {}); hits[index] = !hits[index]; return Object.assign({}, prev, { [answerId]: Object.assign({}, draft, { rubric_hits: hits }) }); }); } function updatePeerImprovement(answerId, value) { setPeerDrafts(prev => { const draft = prev[answerId] || { rubric_hits: {}, improvement_text: '' }; return Object.assign({}, prev, { [answerId]: Object.assign({}, draft, { improvement_text: cleanCommitmentText(value) }) }); }); } async function submitPeerReview(answer) { if (!db || !user || !selectedSession || !canSeeSharedAnswers || !answer || answer.user_id === user.id) return; // Client guard: only submit for answers this reviewer is actually assigned. // The server RPC re-derives the same ring and rejects anything unassigned, // so this is a UX guard, not the security boundary. if (!reviewAssignment[answer.id]) { setError('You are not assigned to review this answer.'); return; } const draft = peerDrafts[answer.id] || { rubric_hits: {}, improvement_text: '' }; setError(''); setPeerSaveState(answer.id); const result = await db.rpc('submit_study_session_peer_review', { p_answer_id: answer.id, p_rubric_hits: draft.rubric_hits || {}, p_improvement_text: cleanCommitmentText(draft.improvement_text) || null }); if (result.error) { setPeerSaveState(''); setError('Could not save that peer review yet.'); return; } setPeerSaveState('saved'); await loadPeerReviews(selectedSession.id); } async function submitSafetyReport() { if (!db || !user) return; const detail = cleanReportText(reportForm.detail); if (!detail) return; const payload = { reporter_id: user.id, squad_id: selectedSession ? selectedSession.squad_id : (squads[0] && squads[0].id) || null, session_id: selectedSession ? selectedSession.id : null, category: reportForm.category, detail: detail }; setError(''); setReportSaveState('saving'); const result = await db.from('study_squad_safety_reports').insert(payload); if (result.error) { setReportSaveState(''); setError('Could not send that report yet.'); return; } setReportSaveState('saved'); setReportForm({ category: reportForm.category, detail: '' }); } async function blockMember(answer) { if (!db || !user || !selectedSession || !answer || answer.user_id === user.id) return; const payload = { blocker_id: user.id, blocked_user_id: answer.user_id, squad_id: selectedSession.squad_id, session_id: selectedSession.id, reason: 'Hidden from revealed answer view' }; setError(''); setBlockSaveState(answer.user_id); const result = await db.from('study_squad_member_blocks') .insert(payload) .select('id, blocker_id, blocked_user_id, squad_id, session_id, reason, created_at') .single(); if (result.error) { setBlockSaveState(''); setError('Could not hide that student yet.'); return; } setMemberBlocks(prev => prev.concat(result.data || Object.assign({ id: 'local-' + answer.user_id + '-' + Date.now(), created_at: new Date().toISOString() }, payload))); setBlockSaveState(''); } async function unblockMember(block) { if (!db || !user || !block) return; setError(''); setBlockSaveState(block.blocked_user_id); const result = await db.from('study_squad_member_blocks') .delete() .eq('id', block.id); if (result.error) { setBlockSaveState(''); setError('Could not unhide that student yet.'); return; } setMemberBlocks(prev => prev.filter(item => item.id !== block.id)); setBlockSaveState(''); } async function requestAiFeedback(answer) { if (!db || !user || !selectedSession || !answer || answer.user_id !== user.id || !canSeeSharedAnswers) return; if (!db.functions || typeof db.functions.invoke !== 'function') { setError('AI feedback is not available in this environment yet.'); return; } setError(''); setAiSaveState(answer.id); const payload = { answer_id: answer.id, question_pack_title: questionPack ? questionPack.title : selectedSession.question_pack_ref, question_prompt: questionPack ? questionPack.question : '', rubric: questionPack && questionPack.rubric ? questionPack.rubric : [] }; const result = await db.functions.invoke('study-squad-ai-marker', { body: payload }); if (result.error) { setAiSaveState(''); setError('Could not generate AI feedback yet.'); return; } const feedback = result.data && result.data.feedback; if (feedback) { setAiFeedback(prev => [feedback].concat(prev.filter(item => item.answer_id !== feedback.answer_id))); } else { await loadAiFeedback(selectedSession.id); } setAiSaveState('saved'); } const signedIn = Boolean(user); const selectedSession = sessions.find(session => session.id === selectedSessionId) || sessions[0] || null; const currentPhaseIndex = selectedSession ? getSessionPhaseIndex(selectedSession.phase) : 0; const nextPhase = selectedSession ? SQ_SESSION_PHASES[currentPhaseIndex + 1] : null; const canSubmitAnswer = selectedSession && selectedSession.phase === 'attempt'; const canSeeSharedAnswers = selectedSession && (selectedSession.phase === 'reveal' || selectedSession.phase === 'repair' || selectedSession.phase === 'complete'); const ownAttendance = user ? attendance.find(row => row.user_id === user.id) : null; const attendanceSummary = getAttendanceSummary(attendance); const scheduleSquad = squads.find(squad => squad.id === sessionForm.squad_id) || squads[0] || null; const packGroups = getPackGroupsForSquad(scheduleSquad); const blockByUserId = memberBlocks.reduce((map, block) => { map[block.blocked_user_id] = block; return map; }, {}); const aiByAnswerId = aiFeedback.reduce((map, feedback) => { map[feedback.answer_id] = feedback; return map; }, {}); // The 2 MC + 2 SA question set for this session, built from the loaded pack. const attemptQuestions = React.useMemo(() => buildAttemptQuestions(questionPack), [questionPack]); const selectedSquad = selectedSession ? (squads.find(s => s.id === selectedSession.squad_id) || null) : null; const reviewSubject = selectedSquad ? selectedSquad.subject : 'default'; const activeMemberCount = attendance.filter(r => r.status === 'checked_in' || r.status === 'completed').length; // Peer-review assignment: each answer gets 2 reviewers where the squad is ≥4 // (STUDY_ROUTINE_DESIGN.md — "each answer gets 2 reviewers"). Deterministic // ring over the submitted answers so coverage is even and stable. const reviewAssignment = React.useMemo( () => computeReviewAssignment(answers, user && user.id), [answers, user && user.id] ); // Attempt countdown derived from the SERVER timestamp: study_sessions.updated_at // is stamped when the owner moves the session into 'attempt', so every member // and device shares one authoritative window. This avoids the per-device // localStorage deadline (which could be reset by clearing storage, differed // across devices, and leaked stale keys), and a re-opened attempt phase gets a // fresh window because updated_at is re-stamped on the phase change. const attemptDeadline = (selectedSession && selectedSession.phase === 'attempt' && selectedSession.updated_at) ? new Date(selectedSession.updated_at).getTime() + SQ_ATTEMPT_MINUTES * 60 * 1000 : null; React.useEffect(() => { if (!selectedSession || selectedSession.phase !== 'attempt') return undefined; const timer = window.setInterval(() => setNowTs(Date.now()), 1000); return () => window.clearInterval(timer); }, [selectedSession && selectedSession.id, selectedSession && selectedSession.phase]); const attemptSecondsLeft = attemptDeadline ? Math.max(0, Math.floor((attemptDeadline - nowTs) / 1000)) : null; const attemptTimeUp = attemptSecondsLeft === 0; const ownAnswerRow = user ? answers.find(a => a.user_id === user.id) : null; const ownAnswerObj = ownAnswerRow ? parseSquadAnswer(ownAnswerRow.answer_text) : null; const ownReviews = ownAnswerRow ? peerReviews.filter(r => r.answer_id === ownAnswerRow.id) : []; const reviewLabelMap = (window.HSC && window.HSC.squadReview) ? window.HSC.squadReview.labelMap() : {}; // Expected reviewers per answer under the ring: 2 where ≥3 submitted, else 1. const expectedReviewsPerAnswer = answers.length >= 3 ? 2 : (answers.length === 2 ? 1 : 0); // Owner-only squad-weakness summary: which checkbox reasons fired most across // all peer reviews this session (only the owner can read every review under // RLS). Turns the peer-review round into a teaching signal for the tutor. const isSessionOwner = Boolean(selectedSquad && user && selectedSquad.created_by === user.id); const squadWeaknessSummary = React.useMemo(() => { if (!isSessionOwner) return []; // Count how often each NEGATIVE checkbox fired (ignore pos_* reinforcement). const counts = {}; (peerReviews || []).forEach(r => { const hits = r.rubric_hits || {}; Object.keys(hits).forEach(id => { if (hits[id] && id.indexOf('pos_') !== 0) counts[id] = (counts[id] || 0) + 1; }); }); return Object.keys(counts) .map(id => ({ id: id, label: reviewLabelMap[id] || id, count: counts[id] })) .sort((a, b) => b.count - a.count) .slice(0, 5); }, [isSessionOwner, peerReviews, reviewLabelMap]); async function loadQuestionPack(ref) { const cleanedRef = cleanSquadText(ref, 80); if (!cleanedRef) { setQuestionPack(null); setQuestionPackState(''); return; } setQuestionPackState('loading'); try { const pack = await resolveQuestionPack(cleanedRef); setQuestionPack(pack); setQuestionPackState(pack && pack.questions && pack.questions.length ? 'loaded' : 'fallback'); } catch (err) { setQuestionPack(getQuestionPack(cleanedRef)); setQuestionPackState('fallback'); } } return (

Study Squads

Invite-only question sessions · no chat · no public discovery
Focus Rooms
Your accountability squad
{squads.length ? squads.length + ' squad' + (squads.length === 1 ? '' : 's') : 'Create'}
Same 3–5 students, same year and subject, every week. Attempt 2 MC + 2 SA under time, reveal to the squad, mark each other with the rubric, then repair one weak answer — where the real learning happens.
{!authReady &&
Checking sign-in...
} {authReady && !signedIn && (
Sign in to create a private Study Squad. Sign in
)} {signedIn && (

Create a squad

Create a private squad, then use invite codes to add members.

invite-only
updateForm('name', e.target.value)}/>
updateForm('module_label', e.target.value)} placeholder="Example: Module 7 immunity"/>
{SQ_DAYS.map(day => ( ))}
updateForm('recurring_time_local', e.target.value)}/>
{saveState === 'saved' && Squad created.} {error && {error}}
)} {signedIn && (

Join with invite code

Codes only work for active invite-only squads. No public squad browsing.

private
setJoinCode(cleanInviteCode(e.target.value))} placeholder="example: sq-7k3m9p2q"/>
{joinState === 'joined' &&
Joined squad.
}
)} {signedIn && squads.length > 0 && (

Schedule a session

Create the next timed practice block for this squad.

scheduled
updateSessionForm('title', e.target.value)}/>
updateSessionForm('date', e.target.value)}/>
updateSessionForm('time', e.target.value)}/>
{scheduleSquad &&
Showing {packGroups[0] && packGroups[0].priority ? 'matching packs first' : 'all available packs'} for {formatSquadMeta(scheduleSquad)}.
}
{sessionSaveState === 'saved' && Session scheduled.}
)} {signedIn && squads.length > 0 && (

Invite codes

Generate short-lived-style codes for private testing. Only squad owners can create or revoke them.

owner
{inviteSaveState === 'saved' && Invite updated.}
{invites.length ? invites.map(invite => (
{invite.invite_code} {formatInviteMeta(invite, squads)}
)) : (
No owner invite codes yet.
)}
)}

My squads {loadingSquads ? 'loading' : squads.length ? 'private' : 'none yet'}

{squads.length ? squads.map(squad => (
{squad.name} {formatSquadMeta(squad)}
)) : ( SQ_PHASES.map((phase) => (
{phase.label} {phase.copy}
)) )}

Scheduled sessions {loadingSessions ? 'loading' : sessions.length ? 'upcoming' : 'none yet'}

{sessions.length ? sessions.map(session => (
{session.title} {formatSessionMeta(session, squads)}
)) : (
Schedule a session after creating a squad, then run it through check-in, attempt, reveal, repair and complete.
)}
{signedIn && selectedSession && (

Session room

Move the group through the structured loop: check-in → attempt → reveal → repair → complete.

{selectedSession.phase}
{sessions.length > 1 && (
)}
{selectedSession.title} {formatSessionMeta(selectedSession, squads)}
{SQ_SESSION_PHASES.map((phase, index) => { const phaseClass = index < currentPhaseIndex ? 'done' : index === currentPhaseIndex ? 'active' : 'locked'; return (
{phase.label} {phase.copy}
); })}
{getSessionPhase(selectedSession.phase).label} workflow {getSessionPhase(selectedSession.phase).copy}
{selectedSession.phase}
{getPhaseTasks(selectedSession.phase).map(task => (
{task.title} {task.copy}
))}
Owner controls Only the squad owner should be able to advance phases under RLS.
{nextPhase ? ( ) : ( )} {phaseSaveState === 'saved' && Phase updated.}
Attendance {ownAttendance ? formatAttendanceMeta(ownAttendance) : 'Mark yourself present when you join the session.'}
{attendanceSummary}
setCommitmentText(e.target.value)} placeholder="Next commitment before the next session"/>
{attendanceSaveState === 'saved' &&
Attendance saved.
}
Question pack {questionPack ? questionPack.title : 'Loading assigned questions'}
{questionPackState || 'ready'}
{(attemptQuestions.mc.length || 2)} multiple-choice + {(attemptQuestions.sa.length || 2)} short-answer · {SQ_ATTEMPT_MINUTES}-minute timed attempt. {' '}Answers stay private until the owner starts reveal.
Answer pad {canSubmitAnswer ? 'Answer under timed conditions — private until reveal.' : canSeeSharedAnswers ? 'Answers are unlocked to the squad.' : 'Locked until the attempt phase starts.'}
{answers.length ? answers.length + ' submitted' : 'no answers'}
{canSubmitAnswer ? ( ) : canSeeSharedAnswers ? (
{answers.length ? answers.map((answer, index) => { const isOwn = answer.user_id === user.id; const blocked = !isOwn && blockByUserId[answer.user_id]; const parsed = parseSquadAnswer(answer.answer_text); const assigned = Boolean(reviewAssignment[answer.id]); return (
{isOwn ? 'Your answer' : 'Squad member ' + (index + 1)}{!isOwn && assigned ? ' · your review task' : ''} {!isOwn && ( blocked ? ( ) : ( ) )}
{blocked ? (
This student's answer is hidden for you. Peer review prompts from this student are muted in this session view.
) : ( {isOwn ? (
{expectedReviewsPerAnswer ? countReviewsForAnswer(peerReviews, answer.id) + ' of ' + expectedReviewsPerAnswer + ' reviews received' : countReviewsForAnswer(peerReviews, answer.id) + ' peer review' + (countReviewsForAnswer(peerReviews, answer.id) === 1 ? '' : 's') + ' received'}
) : assigned ? ( ) : (
Not assigned to you for review — each answer gets two reviewers so the load is shared.
)} )}
); }) : (
No submitted answers yet.
)}
) : (
Students answer 2 MC + 2 SA independently here once the owner starts the attempt phase.
)}
{selectedSession.phase === 'repair' && ownAnswerObj && ( )} {canSeeSharedAnswers && ( )} {canSeeSharedAnswers && isSessionOwner && ( )}
)}
Safety locks required
HOW THIS STAYS SAFE Study Squads are structured question sessions. There is no open chat, DMs, or video by design — you communicate only through constrained rubric feedback, and reporting, blocking and moderation are always on.
{SQ_GUARDS.map((guard) => (
Guardrail {guard}
))} {signedIn && (
Report an issue