// CampaignModal.jsx — generic renderer for the outreach plan. // Takes a `lead`, builds the plan via CP_buildCampaign(lead), and renders the // same assemble-then-reveal flow as before — but every line of copy, the step // count, channels and cadence now come from the plan (type + phase aware). const { useState: useModalState, useEffect: useModalEffect } = React; const HelmAvatar = ({ size = 40 }) => (
); const HelmBy = () => (
Drafted by Helm Co-pilot
); const StepIcon = ({ type, size = 22 }) => { const common = { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "var(--helm-dark-green)", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }; if (type === "email") return ; if (type === "sms") return ; if (type === "call") return ; return null; }; // ----------------------------------------------------------------- content blocks const EmailContent = ({ c, attachment }) => (
To {c.to}  ·  From {c.from}
{c.subject}
{c.body.map((p, i) =>

{p}

)}
); const SmsContent = ({ c }) => (
To {c.to}  ·  From {CP_PRODUCER}'s iMessage
{c.text}
Delivered · 1 message
); const CallContent = ({ c }) => (
You call {c.who}  ·  {c.note}
{c.opener}
Talk-track
    {c.beats.map((b, i) =>
  1. {b}
    2. )}
); const StepContent = ({ content }) => { if (content.kind === "email") return ; if (content.kind === "sms") return ; return ; }; const Stat = ({ label, value }) => (
{label}
{value}
); // ----------------------------------------------------------------- modal const CampaignModal = ({ lead, onClose }) => { const plan = CP_buildCampaign(lead); const STEPS = plan.steps; const [active, setActive] = useModalState(0); const step = STEPS[active]; const [generating, setGenerating] = useModalState(true); const [revealed, setRevealed] = useModalState(0); const [statusIdx, setStatusIdx] = useModalState(0); useModalEffect(() => { const timers = []; for (let i = 1; i <= STEPS.length; i++) timers.push(setTimeout(() => setRevealed(i), 250 + i * 430)); plan.buildStatus.forEach((_, i) => timers.push(setTimeout(() => setStatusIdx(i), i * 660))); timers.push(setTimeout(() => setGenerating(false), 3500)); return () => timers.forEach(clearTimeout); }, [lead.id]); return ( <>
{/* Header */}

{plan.title}

{plan.kicker}
{/* Stepper */}
{STEPS.map((s, i) => { const shown = !generating || i < revealed; return ( {i < STEPS.length - 1 &&
} ); })}
{generating ? (
{plan.buildStatus[statusIdx]}
{plan.buildStatus.map((_, i) => ( ))}
) : (
{step.day} · {step.short} {step.note}
)} {/* Footer */}
); }; Object.assign(window, { CampaignModal });