{c.cleared ? (
No history yet
Log a workout and your weight, volume and streak charts will start building here.
) : (
<>
{['Weight', 'Volume', 'Reps', 'Streak'].map(t => setTab(t)}>{t})}
{tab === 'Weight' && (
<>
{[['bench', 'Bench'], ['squat', 'Squat'], ['deadlift', 'Deadlift'], ['ohp', 'OHP']].map(([id, l]) =>
setExId(id)} style={{ borderStyle: 'dashed' }}>{l})}
{dispSeries[dispSeries.length - 1]}
{c.wtLabel} working set
+{delta} {c.wtLabel} since week 1
)}
{tab === 'Volume' && (
<>
Total volume per session (lb)
)}
{tab === 'Reps' && (
<>
Reps completed per session
({ label: r.label, value: r.reps }))} accent={c.accent} text={c.muted} surface={c.surface3} height={180} />
)}
{tab === 'Streak' && (
<>
{PROFILE.stats.streak}
Day streak
{PROFILE.stats.bestStreak}
Best ever{PROFILE.stats.workouts}
Total workouts
Consistency · last 12 weeks
Less
{[0, 1, 2, 3].map(v =>
)}
More
)}
)}
);
}
// ── CALENDAR ─────────────────────────────────────────────────
function CalendarScreen() {
const c = useTheme();
const today = new Date();
const [view, setView] = React.useState({ y: today.getFullYear(), m: today.getMonth() });
const [sel, setSel] = React.useState(today.getDate());
const first = new Date(view.y, view.m, 1);
const startDow = (first.getDay() + 6) % 7; // Mon=0
const daysInMonth = new Date(view.y, view.m + 1, 0).getDate();
const isCurMonth = view.y === today.getFullYear() && view.m === today.getMonth();
function statusOf(day) {
const d = new Date(view.y, view.m, day);
const idx = (d.getDay() + 6) % 7;
if (WEEK_SPLIT[idx].rest) return 'rest';
const t0 = new Date(today.getFullYear(), today.getMonth(), today.getDate());
if (d.getTime() === t0.getTime()) return 'today';
if (d > t0) return 'planned';
if (c.cleared) return 'planned';
return (day % 11 === 4) ? 'missed' : 'done';
}
const cells = [];
for (let i = 0; i < startDow; i++) cells.push(null);
for (let d = 1; d <= daysInMonth; d++) cells.push(d);
const monthName = first.toLocaleDateString('en-US', { month: 'long', year: 'numeric' });
const shift = (dir) => setView(v => {
let m = v.m + dir, y = v.y;
if (m < 0) { m = 11; y--; } if (m > 11) { m = 0; y++; }
return { y, m };
});
const selStatus = statusOf(sel);
const selDow = (new Date(view.y, view.m, sel).getDay() + 6) % 7;
const selDay = WEEK_SPLIT[selDow];
const dotStyle = (st) => {
if (st === 'done') return { background: c.accent, color: c.accentInk, border: 'none' };
if (st === 'missed') return { background: 'transparent', color: c.danger, border: `1.5px solid ${c.danger}` };
if (st === 'today') return { background: 'transparent', color: c.accent, border: `2px solid ${c.accent}` };
if (st === 'rest') return { background: 'var(--surface-2)', color: 'var(--dim)', border: '1px solid var(--border)' };
return { background: 'transparent', color: 'var(--muted)', border: '1px solid var(--border)' }; // planned
};
return (
{monthName}
{['M', 'T', 'W', 'T', 'F', 'S', 'S'].map((d, i) =>
{d}
)}
{cells.map((d, i) => {
if (!d) return
;
const st = statusOf(d);
const isSel = d === sel;
return (
);
})}
{/* legend */}
{[['done', 'Completed'], ['missed', 'Missed'], ['rest', 'Rest'], ['planned', 'Planned']].map(([k, l]) => (
{l}
))}
{/* selected detail */}
{new Date(view.y, view.m, sel).toLocaleDateString('en-US', { weekday: 'long', month: 'short', day: 'numeric' })}
{selStatus === 'done' ? 'Crushed it' : selStatus === 'missed' ? 'Missed day' : selStatus === 'rest' ? 'Rest day' : selStatus === 'today' ? 'On deck' : 'Upcoming'}
{selDay.rest ? selDay.muscles : `${selDay.focus} · ${selDay.muscles}`}
);
}
// ── PROFILE ──────────────────────────────────────────────────
function fmtTime12(hhmm) {
const [h, m] = String(hhmm || '18:00').split(':').map(Number);
const ap = h >= 12 ? 'PM' : 'AM';
const h12 = h % 12 === 0 ? 12 : h % 12;
return `${h12}:${String(m).padStart(2, '0')} ${ap}`;
}
function ProfileScreen({ openSheet, profile, settings }) {
const c = useTheme();
const p = profile || PROFILE;
const st = settings || { unit: 'lb', reminderOn: true, reminderTime: '18:00', weeklyGoal: 5 };
const weekDone = c.cleared ? 0 : HEATMAP.slice(-7).filter(v => v > 0).length;
const goalPct = Math.min(100, Math.round((weekDone / Math.max(1, st.weeklyGoal)) * 100));
const rows = [
{ kind: 'units', icon: 'ruler', label: 'Units', detail: st.unit === 'kg' ? 'Metric (kg)' : 'Imperial (lb)' },
{ kind: 'reminders', icon: 'bell', label: 'Reminders', detail: st.reminderOn ? 'Daily ' + fmtTime12(st.reminderTime) : 'Off' },
{ kind: 'goal', icon: 'target', label: 'Weekly goal', detail: st.weeklyGoal + ' / week' },
{ kind: 'preferences', icon: 'settings', label: 'Preferences', detail: '' },
{ kind: 'data', icon: 'share', label: 'Backup & export', detail: '' },
];
const camBadge = (