/* ============================================================
   SpiderBot v2.0.1 — shell do painel (nova UI)
   ============================================================ */
const { useState, useEffect, useRef, useCallback } = React;

/* ---------------- icon set ---------------- */
const P = {
  home:["M3 9.5 12 2.5l9 7","M5.5 8.5V20a1 1 0 0 0 1 1H10v-6h4v6h3.5a1 1 0 0 0 1-1V8.5"],
  key:[["circle",{cx:8,cy:15,r:4.5}],"M11 12 21 2","M17 6l3 3","M14 9l2.5 2.5"],
  users:["M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2",["circle",{cx:9,cy:7,r:4}],"M22 21v-2a4 4 0 0 0-3-3.9","M16 3.1a4 4 0 0 1 0 7.8"],
  globe:[["circle",{cx:12,cy:12,r:9}],"M3 12h18","M12 3c2.5 2.5 3.8 5.8 3.8 9S14.5 18.5 12 21c-2.5-2.5-3.8-5.8-3.8-9S9.5 5.5 12 3z"],
  monitor:[["rect",{x:2.5,y:4,width:19,height:13,rx:2}],"M8 21h8","M12 17v4"],
  playc:[["circle",{cx:12,cy:12,r:9}],"M10 8.4l6 3.6-6 3.6z"],
  card:[["rect",{x:2,y:5,width:20,height:14,rx:2}],"M2 10h20"],
  logout:["M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4","M16 17l5-5-5-5","M21 12H9"],
  chevs:["M11 17l-5-5 5-5","M18 17l-5-5 5-5"],
  min:["M4 12h16"],
  maxi:[["rect",{x:5,y:5,width:14,height:14,rx:1}]],
  close:["M6 6l12 12","M18 6 6 18"],
  search:[["circle",{cx:11,cy:11,r:7}],"m21 21-4-4"],
  upload:["M12 16V4","M7 9l5-5 5 5","M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"],
  download:["M12 3v12m0 0 4-4m-4 4-4-4","M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"],
  plus:["M12 5v14","M5 12h14"],
  minus:["M5 12h14"],
  pencil:["M4 20h4L20 8l-4-4L4 16z","M14 6l4 4"],
  trash:["M4 7h16","M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2","M6 7l1 13a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1l1-13"],
  power:["M12 3v9","M18.4 6.6a9 9 0 1 1-12.8 0"],
  refresh:["M3 12a9 9 0 0 1 15-6.7L21 8","M21 3v5h-5","M21 12a9 9 0 0 1-15 6.7L3 16","M3 21v-5h5"],
  save:[["rect",{x:4,y:4,width:16,height:16,rx:2}],"M8 4v6h8V4","M8 20v-5h8v5"],
  gear:[["circle",{cx:12,cy:12,r:3.2}],"M12 2v3","M12 19v3","M2 12h3","M19 12h3","M4.9 4.9 7 7","M17 17l2.1 2.1","M19.1 4.9 17 7","M7 17l-2.1 2.1"],
  sliders:["M4 6h10","M18 6h2","M4 12h2","M10 12h10","M4 18h7","M15 18h5","M14 4v4","M6 10v4","M11 16v4"],
  link:["M9 15 15 9","M10.5 6.5 13 4a4.5 4.5 0 0 1 6.5 6.5L17 13","M13.5 17.5 11 20a4.5 4.5 0 0 1-6.5-6.5L7 11"],
  eyeoff:["M3 3l18 18","M10.6 10.6a2 2 0 0 0 2.8 2.8","M9.4 5.3A9.5 9.5 0 0 1 12 5c5 0 9 4.5 9 7a12 12 0 0 1-2.4 3.2","M6.5 6.9C4.3 8.3 3 10.6 3 12c0 2.5 4 7 9 7 1.4 0 2.7-.3 3.8-.9"],
  qr:[["rect",{x:3,y:3,width:7,height:7,rx:1}],["rect",{x:14,y:3,width:7,height:7,rx:1}],["rect",{x:3,y:14,width:7,height:7,rx:1}],"M14 14h3v3h-3z","M20 14v3","M14 20h7"],
  folder:["M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"],
  bug:["M8 6a4 4 0 0 1 8 0","M6 10h12v4a6 6 0 0 1-12 0z","M3 11h3","M18 11h3","M4 18l2.5-2","M20 18l-2.5-2","M5 5l2 2","M19 5l-2 2"],
  check:["M4 12.5l5 5L20 6.5"],
  chevdown:["M6 9l6 6 6-6"],
  chevup:["M6 15l6-6 6 6"],
  chevleft:["M15 18l-6-6 6-6"],
  chevright:["M9 6l6 6-6 6"],
  rocket:["M5 15c-1.5 1.5-2 5-2 5s3.5-.5 5-2c.8-.8.8-2.2 0-3s-2.2-.8-3 0z","M9 13l-2-2 1.5-3.5C10 4 14 2.5 20 2c-.5 6-2 10-5.5 11.5L11 15z",["circle",{cx:14.5,cy:9.5,r:1.6}]],
  archive:[["rect",{x:3,y:4,width:18,height:5,rx:1}],"M5 9v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9","M10 13h4"],
  chart:["M4 20V4","M4 20h16","M8 17v-6","M13 17V7","M18 17v-4"],
  filepen:["M13 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6","M13 3l5 5v3","M13 3v5h5","M13 21l6-6 2 2-6 6h-2z"],
  target:[["circle",{cx:12,cy:12,r:8}],["circle",{cx:12,cy:12,r:4}],["circle",{cx:12,cy:12,r:.9}]],
  tag:["M3 4h8l10 10-7 7L4 11V4z",["circle",{cx:7.5,cy:7.5,r:1.4}]],
  msg:["M20 4H4a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h3v4l5-4h8a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1z"],
  ban:[["circle",{cx:12,cy:12,r:9}],"M5.6 5.6l12.8 12.8"],
  shield:["M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z"],
  phone:[["rect",{x:6,y:2,width:12,height:20,rx:2.5}],"M10.5 18.5h3"],
  network:[["rect",{x:9,y:2,width:6,height:5,rx:1}],["rect",{x:2,y:17,width:6,height:5,rx:1}],["rect",{x:16,y:17,width:6,height:5,rx:1}],"M12 7v4","M5 17v-3h14v3","M12 11v3"],
  puzzle:["M10 4a2 2 0 1 1 4 0c0 .7-.3 1.2-.3 1.5 0 .3.2.5.5.5H17a1 1 0 0 1 1 1v2.8c0 .3.2.5.5.5.3 0 .8-.3 1.5-.3a2 2 0 1 1 0 4c-.7 0-1.2-.3-1.5-.3-.3 0-.5.2-.5.5V18a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1c0-.7.3-1 .3-1.5 0-.3-.2-.5-.5-.5H9a1 1 0 0 1-1-1v-2.5c0-.3-.2-.5-.5-.5-.5 0-.8.3-1.5.3a2 2 0 1 1 0-4c.7 0 1 .3 1.5.3.3 0 .5-.2.5-.5V6a1 1 0 0 1 1-1h2.5c.3 0 .5-.2.5-.5 0-.3-.3-.8-.3-.5z"],
  clock:[["circle",{cx:12,cy:12,r:9}],"M12 7v5l3.5 2"],
  spark:["M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z"],
  hdd:[["rect",{x:3,y:5,width:18,height:14,rx:2}],"M3 13h18","M7 16.4h.01","M11 16.4h.01"],
  play:[["path",{d:"M6 4l13 8-13 8z",fill:"currentColor",stroke:"none"}]],
  stop:[["rect",{x:6,y:6,width:12,height:12,rx:1.5,fill:"currentColor",stroke:"none"}]],
  max:[["rect",{x:5,y:5,width:14,height:14,rx:2}]],
  swap:["M7 4 3 8l4 4","M3 8h14","M17 20l4-4-4-4","M21 16H7"],
  grid:[["rect",{x:3,y:3,width:7,height:7,rx:1.4}],["rect",{x:14,y:3,width:7,height:7,rx:1.4}],["rect",{x:3,y:14,width:7,height:7,rx:1.4}],["rect",{x:14,y:14,width:7,height:7,rx:1.4}]],
  bolt:["M13 2 4 14h7l-1 8 9-12h-7z"],
  activity:["M3 12h4l3 8 4-16 3 8h4"],
  cpu:[["rect",{x:6,y:6,width:12,height:12,rx:2}],"M9 2v2","M15 2v2","M9 20v2","M15 20v2","M2 9h2","M2 15h2","M20 9h2","M20 15h2"],
  user:[["circle",{cx:12,cy:8,r:4}],"M4 21c0-4 3.5-6 8-6s8 2 8 6"],
  eye:["M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z",["circle",{cx:12,cy:12,r:3}]],
  lock:[["rect",{x:4.5,y:10,width:15,height:11,rx:2}],"M8 10V7a4 4 0 0 1 8 0v3"],
  edit:["M14 4 18 8 8 18 4 19l1-4z"],
  cog:[["circle",{cx:12,cy:12,r:3.2}],"M12 2v3","M12 19v3","M4.2 4.2l2.1 2.1","M17.7 17.7l2.1 2.1","M2 12h3","M19 12h3","M4.2 19.8l2.1-2.1","M17.7 6.3l2.1-2.1"],
  dots:[["circle",{cx:5,cy:12,r:1.4,fill:"currentColor"}],["circle",{cx:12,cy:12,r:1.4,fill:"currentColor"}],["circle",{cx:19,cy:12,r:1.4,fill:"currentColor"}]],
  copy:[["rect",{x:9,y:9,width:11,height:11,rx:2}],"M5 15V5a2 2 0 0 1 2-2h8"],
  chevron:["M6 9l6 6 6-6"],
};

function I({ n, s = 16 }) {
  const d = P[n];
  if (!d) return null;
  return (
    <svg viewBox="0 0 24 24" width={s} height={s} fill="none" stroke="currentColor"
         strokeWidth="1.7" strokeLinecap="round" strokeLinejoin="round">
      {d.map((x, i) => typeof x === 'string'
        ? <path key={i} d={x}/>
        : React.createElement(x[0], Object.assign({ key: i }, x[1])))}
    </svg>
  );
}
window.SBIcon = I;

/* ---------------- nav ---------------- */
const NAV = [
  ['inicio','Início','home'], ['pix','Chaves PIX','key'], ['contas','Contas','users'],
  ['proxy','Proxy','globe'], ['telas','Telas','monitor'], ['operacao','Operação','playc'],
  ['mp','Mercado Pago','card'],
];

/* ---------------- dados simulados ---------------- */
const CASAS = ['betmax.bet','sorte7.bet','luckyx.bet','goldbet.bet','fortuna.bet'];
const rnd = a => a[Math.floor(Math.random() * a.length)];
const digits = n => Array.from({ length: n }, () => Math.floor(Math.random() * 10)).join('');
const now = () => new Date().toLocaleTimeString('pt-BR', { hour12: false });

function makeConta(i, valor) {
  const d = new Date();
  return {
    id: 'c' + i + '-' + Math.random().toString(36).slice(2, 7),
    data: d.toLocaleDateString('pt-BR') + ' ' + d.toLocaleTimeString('pt-BR', { hour12: false }),
    casa: rnd(CASAS),
    login: 'user' + digits(4),
    senha: '••••••••',
    saque: '••••••',
    conta: digits(8),
    saldo: 'R$ ' + valor + ',00',
  };
}

/* ---------------- shell ---------------- */
function SpiderBotPanel() {
  /* navegação */
  const [tab, setTab] = useState('inicio');
  const [rail, setRail] = useState(false);
  const [modal, setModal] = useState(null);

  /* execução */
  const [running, setRunning] = useState(false);
  const [logs, setLogs] = useState([]);
  const [contas, setContas] = useState([]);
  const [lit, setLit] = useState(0);
  const [qr, setQr] = useState(false);

  /* Início — navegação/execução */
  const [modo, setModo] = useState({ app: true, mobile: false });
  const [oculta, setOculta] = useState(false);
  const [delay, setDelay] = useState('');
  const [delayLink, setDelayLink] = useState(false);
  const [qtd, setQtd] = useState(1);
  const [dep, setDep] = useState(['10', '30']);
  const [func, setFunc] = useState({ proxy: true, captcha: false, ads: false, retrato: false, guia: false, escada: false });
  const [link, setLink] = useState('');

  /* dados das abas */
  const [pixKeys, setPixKeys] = useState([]);
  const [proxies, setProxies] = useState([
    { id: 'p1', label: 'proxy.spiderproxy.com:3120', proto: 'SOCKS5', addr: 'proxy.spiderproxy.com:3120', auth: true, pais: 'BR', on: true },
  ]);
  const [mp, setMp] = useState([]);

  /* Telas */
  const [grid, setGrid] = useState({ x: 5, y: 2 });
  const [monAtivo, setMonAtivo] = useState(true);
  const [reduzir, setReduzir] = useState(false);
  const [render, setRender] = useState('GPU');

  /* Operação */
  const [speed, setSpeed] = useState('4x');
  const [tools, setTools] = useState({ espelho: false, dados: false, ext: false });
  const [slots, setSlots] = useState({});
  const [mesmasChaves, setMesmasChaves] = useState(false);

  const total = grid.x * grid.y;
  const timers = useRef([]);
  const clearTimers = () => { timers.current.forEach(clearTimeout); timers.current = []; };
  useEffect(() => () => clearTimers(), []);

  const pushLog = (k, msg) => setLogs(p => [...p, { k, msg, ts: now(), id: Math.random() }].slice(-60));

  const stop = useCallback(() => {
    clearTimers();
    setRunning(false);
    pushLog('rd', 'Operação interrompida pelo usuário.');
  }, []);

  const start = useCallback(() => {
    clearTimers();
    setRunning(true);
    setLogs([]);
    setContas([]);
    setLit(0);
    setQr(false);

    const at = (ms, fn) => timers.current.push(setTimeout(fn, ms));
    let t = 0;

    at(t += 120, () => pushLog('nf', 'Iniciando operação — emulação: ' + (modo.app ? 'Modo Aplicativo' : 'Modo Mobile') + '.'));
    at(t += 380, () => pushLog(func.proxy ? 'ok' : 'wr', func.proxy ? 'Proxy SOCKS5 conectado · proxy.spiderproxy.com:3120' : 'Proxy desativado — usando conexão direta.'));
    at(t += 330, () => pushLog('nf', 'Abrindo ' + total + ' janela(s) na grade ' + grid.y + ' x ' + grid.x + '.'));

    for (let i = 1; i <= total; i++) {
      at(t += 340, () => {
        setLit(i);
        pushLog('', 'Janela ' + i + '/' + total + ' provisionada.');
      });
      at(t += 190, () => {
        const conta = makeConta(i, dep[i % 2] || '10');
        setContas(p => [conta, ...p]);
        pushLog('ok', 'Conta criada: ' + conta.login + ' · ' + conta.casa);
        if (func.captcha) pushLog('wr', 'Captcha resolvido automaticamente (janela ' + i + ').');
      });
    }

    at(t += 380, () => { setQr(true); pushLog('ok', 'QR de depósito capturado · R$ ' + dep[0] + ',00'); });
    at(t += 420, () => {
      pushLog('ok', 'Operação concluída — ' + total + ' conta(s) provisionada(s).');
      setRunning(false);
    });
  }, [total, grid.x, grid.y, modo.app, func.proxy, func.captcha, dep]);

  const togglePlay = () => (running ? stop() : start());

  const shared = {
    tab, setTab, running, togglePlay, logs, setLogs, contas, setContas, lit, total, qr,
    modo, setModo, oculta, setOculta, delay, setDelay, delayLink, setDelayLink,
    qtd, setQtd, dep, setDep, func, setFunc, link, setLink,
    pixKeys, setPixKeys, proxies, setProxies, mp, setMp,
    grid, setGrid, monAtivo, setMonAtivo, reduzir, setReduzir, render, setRender,
    speed, setSpeed, tools, setTools, slots, setSlots, mesmasChaves, setMesmasChaves,
    modal, setModal,
  };

  const TabView = window.TabView;
  const Modals = window.SBModals;

  return (
    <div className="sb-shell">
      <div className={'sb' + (rail ? ' rail' : '')}>

        {/* ---- title bar ---- */}
        <div className="sb-tbar">
          <img src="assets/spider-mark.png" alt=""/>
          <span className="t">Spider Bot — PRINCIPAL</span>
          <div className="sb-wctrl">
            <button aria-label="Minimizar"><I n="min" s={11}/></button>
            <button aria-label="Maximizar"><I n="maxi" s={10}/></button>
            <button aria-label="Fechar"><I n="close" s={11}/></button>
          </div>
        </div>

        <div className="sb-body">
          {/* ---- sidebar ---- */}
          <aside className="sb-side">
            <div className="sb-brand">
              <img src="assets/spider-mark.png" alt=""/>
              <div className="txt">
                <b>Spider Bot</b>
                <span>V 2.0.1</span>
              </div>
            </div>

            <div className="sb-navlabel">Funções</div>
            <div className="sb-navlist">
              {NAV.map(([id, label, icon]) => (
                <button key={id} className={'sb-nav' + (tab === id ? ' on' : '')}
                        onClick={() => setTab(id)} title={label}>
                  <I n={icon} s={18}/>
                  <span className="lb">{label}</span>
                  <span className="dot"/>
                </button>
              ))}
            </div>

            <div className="sb-side-foot">
              <div className="sb-user">
                <div className="sb-ava">AD</div>
                <div className="txt">
                  <b>Administrador</b>
                  <span>Admin</span>
                </div>
                <button className="out" aria-label="Sair"><I n="logout" s={16}/></button>
              </div>
              <button className="sb-collapse" onClick={() => setRail(v => !v)}>
                <I n="chevs" s={12}/><span className="lb">Recolher</span>
              </button>
            </div>
          </aside>

          {/* ---- main ---- */}
          <main className="sb-main">
            <div className="sb-wm"><img src="assets/spider-mark.png" alt=""/></div>
            {TabView ? <TabView {...shared}/> : <div className="sb-page"><div className="sb-empty">Carregando…</div></div>}
          </main>
        </div>

        {Modals && modal ? <Modals {...shared}/> : null}
      </div>
    </div>
  );
}

window.SpiderBotPanel = SpiderBotPanel;