/* Track & Train — utilities & shared components */ const { useState, useEffect, useRef, useMemo, useCallback, createContext, useContext, Fragment } = React; // ---------- Utilities ---------- const uid = (p='id') => `${p}_${Math.random().toString(36).slice(2,9)}${Date.now().toString(36).slice(-3)}`; // date helpers — all dates as 'YYYY-MM-DD' local const pad = (n) => String(n).padStart(2, '0'); const toKey = (d) => `${d.getFullYear()}-${pad(d.getMonth()+1)}-${pad(d.getDate())}`; const todayKey = () => toKey(new Date()); const parseKey = (k) => { const [y,m,d] = k.split('-').map(Number); return new Date(y, m-1, d); }; // Build a 6-row (42-cell) month matrix, Monday-first const monthMatrix = (year, month) => { const first = new Date(year, month, 1); let startDow = first.getDay(); // 0=Sun startDow = (startDow + 6) % 7; // Mon=0 const cells = []; const start = new Date(year, month, 1 - startDow); for (let i = 0; i < 42; i++) { const d = new Date(start.getFullYear(), start.getMonth(), start.getDate() + i); cells.push(d); } return cells; }; // ---------- Feeling scale ---------- const FEELINGS = [ { v: 1, emoji: '😣', key: 'feel1' }, { v: 2, emoji: '😕', key: 'feel2' }, { v: 3, emoji: '😐', key: 'feel3' }, { v: 4, emoji: '🙂', key: 'feel4' }, { v: 5, emoji: '🤩', key: 'feel5' }, ]; const feelingOf = (v) => FEELINGS.find(f => f.v === v) || null; const feelLabel = (v) => { const f = feelingOf(v); return f ? t(f.key) : ''; }; // ---------- Type colors ---------- const TYPE_COLORS = ['#ff6b1a','#2f74c0','#1f8a5b','#7a5af0','#d6457e','#d99a16','#128a82','#5a6472']; // ---------- Storage ---------- const STORAGE_KEY = 'track-train-data-v1'; const loadData = () => { try { const raw = localStorage.getItem(STORAGE_KEY); return raw ? JSON.parse(raw) : null; } catch (e) { return null; } }; const saveData = (data) => { try { localStorage.setItem(STORAGE_KEY, JSON.stringify(data)); } catch (e) {} }; // ---------- Seed ---------- const demoSeed = () => { const types = [ { id: 'typ_musc', name: 'Strength', color: '#ff6b1a' }, { id: 'typ_sprint',name: 'Sprint', color: '#2f74c0' }, { id: 'typ_lancer',name: 'Throwing', color: '#1f8a5b' }, { id: 'typ_endur', name: 'Endurance', color: '#7a5af0' }, { id: 'typ_mobil', name: 'Mobility', color: '#d99a16' }, ]; const today = new Date(); const dk = (offset) => { const d = new Date(today.getFullYear(), today.getMonth(), today.getDate() + offset); return toKey(d); }; const sessions = [ { id: uid('ses'), date: dk(0), typeId: 'typ_musc', feeling: 4, notes: 'Squat 5x5 at 100kg, bench press 4x6. Felt strong.', createdAt: Date.now() }, { id: uid('ses'), date: dk(0), typeId: 'typ_mobil', feeling: 3, notes: 'Hip + shoulder mobility, 20 min.', createdAt: Date.now()+1 }, { id: uid('ses'), date: dk(-1), typeId: 'typ_sprint', feeling: 5, notes: '6x60m block starts. Explosive, best times of the season.', createdAt: Date.now()+2 }, { id: uid('ses'), date: dk(-2), typeId: 'typ_lancer', feeling: 2, notes: 'Javelin technique, arm felt a bit stiff today.', createdAt: Date.now()+3 }, { id: uid('ses'), date: dk(-4), typeId: 'typ_endur', feeling: 4, notes: '45 min easy aerobic run.', createdAt: Date.now()+4 }, { id: uid('ses'), date: dk(-5), typeId: 'typ_musc', feeling: 3, notes: 'Lower body: lunges, Romanian deadlift.', createdAt: Date.now()+5 }, { id: uid('ses'), date: dk(-7), typeId: 'typ_sprint', feeling: 4, notes: 'Cadence work, skipping + high knees.', createdAt: Date.now()+6 }, { id: uid('ses'), date: dk(-9), typeId: 'typ_lancer', feeling: 5, notes: 'Great throwing session, good rotation.', createdAt: Date.now()+7 }, { id: uid('ses'), date: dk(-11),typeId: 'typ_endur', feeling: 3, notes: '1h bike, active recovery.', createdAt: Date.now()+8 }, { id: uid('ses'), date: dk(-14),typeId: 'typ_musc', feeling: 4, notes: 'Upper body + core.', createdAt: Date.now()+9 }, ]; return { types, sessions }; }; const blankData = () => ({ types: [ { id: 'typ_musc', name: 'Strength', color: '#ff6b1a' }, { id: 'typ_cardio',name: 'Cardio', color: '#2f74c0' }, { id: 'typ_tech', name: 'Technique',color: '#1f8a5b' }, ], sessions: [], }); // ---------- Icons (inline SVG, Track & Throw stroke style) ---------- const Icon = { calendar:(p) => , layers: (p) => , tag: (p) => , settings:(p) => , plus: (p) => , plusSm: (p) => , back: (p) => , trash: (p) => , close: (p) => , chev: (p) => , chevL: (p) => , chevR: (p) => , edit: (p) => , check: (p) => , dots: (p) => , download:(p) => , upload: (p) => , flame: (p) => , }; // ---------- Toast ---------- const ToastContext = createContext(null); const useToast = () => useContext(ToastContext); const ToastProvider = ({ children }) => { const [msg, setMsg] = useState(null); const tRef = useRef(null); const show = useCallback((text) => { setMsg(text); clearTimeout(tRef.current); tRef.current = setTimeout(() => setMsg(null), 1800); }, []); return ( {children}
{msg}
 ); }; // ---------- Sheet (bottom modal) ---------- const Sheet = ({ open, onClose, title, children, action, maxWidth }) => { useEffect(() => { if (!open) return; const h = (e) => { if (e.key === 'Escape') onClose(); }; window.addEventListener('keydown', h); return () => window.removeEventListener('keydown', h); }, [open, onClose]); return (

{title}

{action}
{children}
); }; // ---------- Confirm dialog ---------- const useConfirm = () => { const [state, setState] = useState(null); const ask = useCallback((opts) => new Promise(res => setState({ ...opts, res })), []); const close = (v) => { if (state) { state.res(v); setState(null); } }; const ui = state && (
close(false)}>

{state.title}

{state.message &&

{state.message}

}
); return { ask, ui }; }; // Expose globals Object.assign(window, { React, useState, useEffect, useRef, useMemo, useCallback, Fragment, uid, pad, toKey, todayKey, parseKey, monthMatrix, FEELINGS, feelingOf, feelLabel, TYPE_COLORS, loadData, saveData, demoSeed, blankData, Icon, ToastProvider, useToast, Sheet, useConfirm, });