/* ───────────────────────────────────────────────────────────────── CorpSol — animated dashboard mock for hero ───────────────────────────────────────────────────────────────── */ function QuantaDash() { const t = useT(); const [activeIdx, setActiveIdx] = React.useState(0); const [conv, setConv] = React.useState(18.4); const [callsNow, setCallsNow] = React.useState(412); const [leadsToday, setLeadsToday] = React.useState(247); const [pulse, setPulse] = React.useState(0); // Animate metrics ticking up / breathing React.useEffect(() => { const id = setInterval(() => { setPulse((p) => p + 1); setConv((c) => { const next = c + (Math.random() - 0.4) * 0.4; return Math.max(15.5, Math.min(22.5, next)); }); setCallsNow((c) => c + Math.round((Math.random() - 0.3) * 8)); setLeadsToday((l) => l + (Math.random() > 0.65 ? 1 : 0)); }, 1400); return () => clearInterval(id); }, []); React.useEffect(() => { const id = setInterval(() => setActiveIdx((i) => (i + 1) % 3), 3200); return () => clearInterval(id); }, []); // Sparkline data — generate a smooth-ish line const sparkPoints = React.useMemo(() => { const n = 28; let acc = 50; const arr = []; for (let i = 0; i < n; i++) { acc += (Math.random() - 0.45) * 8; acc = Math.max(20, Math.min(86, acc)); arr.push(acc); } return arr; }, [pulse % 10 === 0 ? Math.floor(pulse / 10) : 0]); const sparkPath = (() => { const W = 280, H = 60; const dx = W / (sparkPoints.length - 1); let d = ''; sparkPoints.forEach((y, i) => { const X = i * dx; const Y = H - (y / 100) * H; d += (i === 0 ? 'M' : 'L') + X.toFixed(1) + ',' + Y.toFixed(1) + ' '; }); return d.trim(); })(); const sparkFill = (() => { const W = 280, H = 60; return `${sparkPath} L${W},${H} L0,${H} Z`; })(); const lines = [ { who: 'A', label: t('dash.line1'), tag: null }, { who: 'B', label: t('dash.line2'), tag: t('dash.tag.hot') }, { who: 'A', label: t('dash.line3'), tag: t('dash.tag.crm') }, ]; return (

{/* window chrome */}

{t('dash.title')}

{t('dash.status')}

{/* metrics row */}

{/* chart card */}

Конверсия в лид · 24 ч RU 64% KZ 36%

{/* transcript */}

{t('dash.transcript')} {t('dash.lang.ru')} {t('dash.lang.kz')}

{lines.map((l, i) => (

{l.who === 'A' ? 'AI' : 'CL'} {l.label} {i === activeIdx && ( )} {l.tag && i <= activeIdx && ( {l.tag} )}

))}

{/* queue strip */}

{t('dash.queue')} · {t('dash.agents')}: 76 обновлено сейчас

{Array.from({ length: 14 }).map((_, i) => { const h = 24 + ((Math.sin((i + pulse) * 0.55) + 1) * 16) + (i % 3) * 4; const on = i < 9; return (
); })}

); } function Metric({ label, value, format, suffix, plain }) { // Smoothly format numbers let display = value; if (format === 'pct') display = (typeof value === 'number' ? value.toFixed(1) : value) + '%'; else if (format === 'int') display = typeof value === 'number' ? value.toLocaleString('ru-RU') : value; return (

{label}

{display} {suffix && {suffix}}

); } window.QuantaDash = QuantaDash;