/* ============================================================
IRONLOG — Sections 1: Hero (Before/After), Goal, PRs
============================================================ */
/* ---------- helpers ---------- */
function parseMDY(s) { const [m,d,y] = s.split("/").map(Number); return new Date(y, m-1, d); }
function daysBetween(a, b) { return Math.round(Math.abs(parseMDY(b) - parseMDY(a)) / 86400000); }
/* ============================================================
HERO — Before / After transformation
============================================================ */
function Hero({ data, admin, onUpdate, onUploadImage, onRemoveImage }) {
const { before, after } = data;
const [edit, setEdit] = useState(null); // 'before' | 'after' | null
const bwUnit = after.bwUnit || before.bwUnit || "kg";
const rawDelta = (after.bodyweightKg || 0) - (before.bodyweightKg || 0);
const deltaSign = rawDelta < 0 ? "−" : "+";
const deltaMag = Math.abs(rawDelta);
const days = daysBetween(before.date, after.date);
return (
● The Ledger · {IRONLOG.profile.federation}
BUILT. NOT
BORN.
{IRONLOG.profile.name} — {IRONLOG.profile.discipline}. A running record of every plate added to the bar.
setEdit("before")} onUploadImage={onUploadImage} onRemoveImage={onRemoveImage} />
{/* center delta seal */}
The Delta
{deltaSign}{deltaMag}{bwUnit}
DAYS
of staying under the bar
setEdit("after")} onUploadImage={onUploadImage} onRemoveImage={onRemoveImage} />
{edit && (
setEdit(null)}
onSave={(rec) => { onUpdate(edit, rec); setEdit(null); }}
/>
)}
);
}
function BACol({ which, rec, delay, admin, onEdit, onUploadImage, onRemoveImage }) {
const images = rec.images && rec.images.length ? rec.images : (rec.image ? [rec.image] : []);
const imageIds = rec.imageIds || [];
const [active, setActive] = useState(0);
const idx = Math.min(active, Math.max(0, images.length - 1));
const canAdd = images.length < 3;
return (
{which === "before" ? "BEFORE" : "AFTER"}
{rec.date}
{images.length
?
:
{which} physique}
{admin && canAdd && (
)}
{admin && images.length > 0 && (
)}
{/* thumbnail strip for the 1–3 side pics */}
{images.length > 1 && (
{images.map((src, i) => (
))}
)}
{admin &&
{images.length}/3 photos
}
Bodyweight
{rec.bodyweightKg}{rec.bwUnit || "kg"}
);
}
function BeforeAfterEdit({ which, rec, onClose, onSave }) {
const [date, setDate] = useState(rec.date);
const [bw, setBw] = useState(rec.bodyweightKg);
const [unit, setUnit] = useState(rec.bwUnit || "kg");
const [image, setImage] = useState(rec.image || null);
const [imageId, setImageId] = useState(rec.imageId || null);
const [busy, setBusy] = useState(false);
// convert MM/DD/YYYY <-> yyyy-mm-dd for the picker
const toISO = (s) => { const [m,d,y] = s.split("/"); return `${y}-${m}-${d}`; };
const fromISO = (s) => { const [y,m,d] = s.split("-"); return `${m}/${d}/${y}`; };
async function upload() {
const picked = await pickImageFile();
if (!picked) return;
setBusy(true);
try {
const r = await API.upload(picked.dataUrl, { target: "profile", which });
setImage(r.url); setImageId(r.id);
} catch (ex) { alert(ex.message || "Upload failed"); }
finally { setBusy(false); }
}
return (
}>
setDate(fromISO(e.target.value))} />
{image
?
:
no image · {which}}
);
}
/* ============================================================
GOAL — manifesto banner
============================================================ */
function Goal({ data, admin, onUpdate }) {
const [edit, setEdit] = useState(false);
return (
setEdit(true)}>
The Mandate
{data.headline}
{data.sub}
{edit && (
setEdit(false)}
footer={null}>
setEdit(false)} onSave={(d) => { onUpdate(d); setEdit(false); }} />
)}
);
}
function GoalForm({ data, onCancel, onSave }) {
const [h, setH] = useState(data.headline);
const [s, setS] = useState(data.sub);
return (
<>
setH(e.target.value)} />