);
};
// ── Reusable: post-creation magic-link sender ────────────────────────────────
// `mode='create'` (default): the account was just created. The Supabase signUp
// call already emails a login link, so we just show a confirmation — no
// second-send button needed.
// `mode='resend'`: the account already exists — used by the Students-tab
// magic-link button. Auto-sends the link on open so the admin doesn't have
// to click twice; the modal just shows progress + outcome.
const MagicLinkPostCreate = ({ name, email, onClose, mode = 'create', studentId }) => {
const data = window.useAdminData();
const [sent, setSent] = React.useState(false);
const [busy, setBusy] = React.useState(true);
const [err, setErr] = React.useState('');
// Auto-send the link in BOTH 'create' and 'resend' modes. Previously
// 'create' mode just claimed a link was sent without actually firing
// one — leading to silent no-email bugs.
React.useEffect(() => {
let cancelled = false;
(async () => {
try {
// studentId (v56) lets the helper stamp student_info.magic_link_sent_at
// so the dashboard's "No invite sent" chip clears immediately.
await data.sendInviteMagicLink(email, studentId);
if (!cancelled) setSent(true);
} catch (e) {
if (!cancelled) setErr(window.friendlyError(e, 'Could not send'));
} finally {
if (!cancelled) setBusy(false);
}
})();
return () => { cancelled = true; };
}, [email]);
return (
e.stopPropagation()}>
{busy ? '⏳' : (err ? '⚠️' : '📧')}
{busy
? `Sending login link to ${name}…`
: err
? "Couldn't send login link"
: (mode === 'create' ? 'Account created — login link sent' : 'Login link sent')}
{err
? <>We couldn't send a link to {email}. The account itself was created — try Resend on their row later.
: sent
? <>A login link was sent to {email}. {name} just clicks it to log in.
: <>Asking Supabase to send a magic link to {email}…
}
);
};
// ── Availability Editor (uses shared AvailabilityPicker) ─────────────────────
const AIAvailModal = ({ instructor, onClose }) => {
const data = window.useAdminData();
const [avail, setAvail] = React.useState(null); // multi-block shape: {0:{enabled,blocks:[...]},...}
const [busy, setBusy] = React.useState(false);
const [error, setError] = React.useState('');
// Timezone lives on profiles.timezone for the instructor's user_id.
// Loaded with the avail slots so the dropdown can show the current value
// immediately. Saved alongside on Save. Phase 2 auto-detect: if the
// instructor's profile has no timezone yet, prefill with the admin's
// detected browser zone — better than always defaulting to EST when the
// admin is in Beirut adding teachers in Lebanon.
const [tz, setTz] = React.useState(() => window.Calendar.time.detect());
React.useEffect(() => {
let cancelled = false;
(async () => {
try {
const [slotsR, profR] = await Promise.all([
window.supa.from('availability_slots').select('*').eq('instructor_id', instructor.id),
instructor.userId
? window.supa.from('profiles').select('timezone').eq('id', instructor.userId).maybeSingle()
: Promise.resolve({ data: null }),
]);
if (slotsR.error) throw slotsR.error;
if (cancelled) return;
setAvail(window.Calendar.shape.slotsToBlocks(slotsR.data || []));
if (profR?.data?.timezone) setTz(profR.data.timezone);
} catch (e) {
if (!cancelled) {
setError(e.message || 'Could not load availability.');
setAvail(Object.fromEntries([0,1,2,3,4,5,6].map(i => [i, { enabled:false, blocks:[{from:9,to:17}] }])));
}
}
})();
return () => { cancelled = true; };
}, [instructor.id, instructor.userId]);
const save = async () => {
setBusy(true); setError('');
try {
// Convert blocks → DB rows (Sun=0 day-of-week, HH:MM:SS times).
const rows = window.Calendar.shape.blocksToSlots(avail);
// Replace all of this instructor's slots with the new ones in one shot.
const { error: delE } = await window.supa.from('availability_slots').delete().eq('instructor_id', instructor.id);
if (delE) throw delE;
if (rows.length) {
const payload = rows.map(r => ({ instructor_id: instructor.id, day_of_week: r.dayOfWeek, start_time: r.startTime, end_time: r.endTime }));
const { error } = await window.supa.from('availability_slots').insert(payload);
if (error) throw error;
}
// Save timezone to profiles.timezone. Soft-fails: if it errors we still
// close because availability saved.
if (instructor.userId) {
try {
await window.supa.from('profiles').update({ timezone: tz }).eq('id', instructor.userId);
} catch (e) { console.warn('[admin avail] timezone save failed', e); }
}
onClose();
} catch (e) { setError(e.message || 'Could not save.'); }
finally { setBusy(false); }
};
return (
e.stopPropagation()}>
Availability — {instructor.name}
Pick start/end times per day. Add multiple blocks if there's a break.
{avail === null ? (
Loading…
) : (
)}
{error &&
{error}
}
);
};
Object.assign(window, {
AddressAutosuggest,
MagicLinkPostCreate,
AIEditStudioModal,
AIAvailModal,
// Legacy alias for admin-view-as.jsx. AdminEditInstructorModal +
// AdminBookLessonModal travel with their components in -edit.jsx
// and -modals-3.jsx respectively.
AdminAvailabilityModal: AIAvailModal,
});
// AIAddModal lives in admin-instructors-modals-add.jsx.
// AIEditInstructorModal lives in admin-instructors-modals-edit.jsx.