// Warm Coach — Control habits page + Habit detail popup // Self-contained: only relies on globals from shared.jsx (A, AWrap, AHeader, // ADateStrip, ATabBar, Iq, ICheck, IFire, IArrowUp, IArrowDown) and screens.jsx // (A_Discipline, for the dimmed backdrop behind the detail sheet). // ── local helpers (uniquely named to avoid collisions) ── function CCard({ children, style, accent }) { return (
{children}
); } function CPill({ tone = 'good', children, icon }) { const map = { bad: { bg: '#FCE6E6', fg: A.bad }, warn: { bg: '#FFF1DC', fg: A.warn }, good: { bg: '#E2F7EC', fg: A.good }, ink: { bg: A.ink, fg: '#fff' }, }[tone]; return (
{icon}{children}
); } // ─────────────────────────────────────────────────────── // 1) CONTROL HABITS — quitting / resisting bad habits // ─────────────────────────────────────────────────────── function A_Control() { const settings = ( ); const controlled = [ { name: 'SUGAR', emoji: '🍩', clean: 3, state: 'resisted' }, { name: 'DOOMSCROLLING', emoji: '📱', clean: 0, state: 'slipped' }, { name: 'ALCOHOL', emoji: '🍺', clean: 21, state: 'resisted' }, { name: 'LATE NIGHTS', emoji: '🌙', clean: 6, state: 'resisted' }, ]; return (
{/* BUILD / CONTROL toggle — CONTROL active */}
{['BUILD', 'CONTROL'].map((t, i) => (
{t}
))}
{/* Featured: QUIT SMOKING hero */}
🚭
QUITTING
SMOKING
}>STAYING CLEAN
12
DAYS CLEAN
{/* mini stats */}
{[ { v: '240', l: 'CIGS AVOIDED' }, { v: '$96', l: 'SAVED' }, { v: '21d', l: 'BEST STREAK' }, { v: '23', l: 'CIGS THIS MONTH' }, ].map((s) => (
{s.v}
{s.l}
))}
{/* identity insight */}
21 days of choosing yourself.
You're doing better than 64% of people trying to quit smoking.
{/* milestone bar */}
NEXT MILESTONE 14-DAY · 2 LEFT
{/* resist list */}
TODAY · DID YOU RESIST?
3 / 4 CLEAN
{controlled.map((h) => { const resisted = h.state === 'resisted'; return (
{h.emoji}
{h.name}
{h.clean > 0 ? ( {h.clean}d clean ) : ( STREAK RESET )}
{/* resisted / slipped toggle */}
); })}
{/* identity analysis — who you're becoming, not just streaks */}
who you're becoming
{[ "You're taking your evenings back.", 'The cravings are losing.', 'Focus is returning.', "You've saved 14 hours this month.", ].map((line) => (
{line}
))}
{/* add controlled habit */}
); } // ─────────────────────────────────────────────────────── // 2) HABIT DETAIL — bottom sheet over the discipline list // ─────────────────────────────────────────────────────── function A_HabitDetail() { // 30-day heatmap (1 = done, 0 = missed, null = future) const days = [ 1,1,0,1,1,1,1, 1,0,1,1,1,1,1, 0,1,1,1,0,1,1, 1,1,1,1,1,0,1, 1,1,null,null, ]; return (
{/* dimmed discipline list behind */}
{/* sheet */}
{/* header */}
🚿
COLD SHOWERS
+5% DISCIPLINE
{/* stat grid */}
{[ { v: '4', l: 'STREAK', fire: true }, { v: '21', l: 'BEST' }, { v: '26', l: 'TOTAL' }, { v: '88%', l: 'RATE' }, ].map((s) => (
{s.fire && }{s.v}
{s.l}
))}
{/* heatmap */}
LAST 30 DAYS
26 DONE · 4 MISSED
{days.map((d, i) => (
{d === 1 && } {d === 0 && ·}
))}
{/* why it matters */}
🧊
WHY THIS MATTERS
It increases your testosterone production, reduces stress, clears brain fog, and increases blood flow.
You're doing better than 74% of people
{/* actions */}
); } // ─────────────────────────────────────────────────────── // 3) CHALLENGE DETAIL — bottom sheet over the challenges list, // with the crowd drop-off graph + an AI analysis CTA. // Reuses InsSection + SurvivalChart from insights.jsx. // ─────────────────────────────────────────────────────── function A_ChallengeDetail() { return (
{/* dimmed challenges list behind */}
{/* sheet */}
{/* header */}
🏃
PHYSICAL ACTIVITY
HEALTH · 21 DAYS
{/* description */}
Move for at least 20 minutes, every day for 21 days. Walk, run, lift — anything that raises your heart rate counts.
{/* the graph — where people drop off */}
The drop-off curve
{/* transformation — what this says about who you're becoming */}
the transformation
You stayed consistent when most people quit.
{[ 'The limits you believed in are fading.', "You've proven more to yourself this month than last.", 'Hard things are becoming normal.', ].map((line) => (
{line}
))}
{/* AI analysis CTA */}
); } Object.assign(window, { A_Control, A_HabitDetail, A_ChallengeDetail });