/* eslint-disable */
/* © 2026 K2B NETWORK SOLUTIONS LLC. All rights reserved.
   Proprietary and confidential. Unauthorized copying, distribution, or use of
   this file, via any medium, is strictly prohibited. Original work product. */
// JBREWS DMS — GM Data System Export (GMDS).
// Modern redesign: feed cards + clear run/schedule controls, empty-state aware.

// Feed catalog — these are GM's standard feeds. Until the dealer hits "Run All",
// they show as "Never run".
const GMDS_FEEDS = [
  { code: "GMDS-PI",  name: "Parts Inventory",   freq: "Daily",  required: true,  desc: "Snapshot of parts on hand, costs, and reorder points." },
  { code: "GMDS-PS",  name: "Parts Sales",       freq: "Daily",  required: true,  desc: "All counter, RO, and special-order parts sales for the day." },
  { code: "GMDS-SSH", name: "Service Hours",     freq: "Daily",  required: true,  desc: "Tech flag/clock hours by RO and op code." },
  { code: "GMDS-SSL", name: "Service Labor",     freq: "Daily",  required: true,  desc: "Labor revenue by op code and pay type (customer/warranty/internal)." },
  { code: "GMDS-SSP", name: "Service Parts",     freq: "Daily",  required: true,  desc: "Parts used on ROs, including warranty parts." },
  { code: "GMDS-VI",  name: "Vehicle Inventory", freq: "Daily",  required: true,  desc: "New + used vehicle inventory snapshot with cost/list/days." },
  { code: "GMDS-VS",  name: "Vehicle Sales",     freq: "Daily",  required: true,  desc: "Retail/lease deals delivered, with F&I detail." },
];

const GMDS_KEY = "jbrews-gmds-state";
const loadGmds = () => {
  try { return JSON.parse(localStorage.getItem(GMDS_KEY) || "{}"); } catch (e) { return {}; }
};
const saveGmds = (s) => { try { localStorage.setItem(GMDS_KEY, JSON.stringify(s)); } catch (e) {} };

const GmdsExport = ({ onClose }) => {
  const [state, setState] = React.useState(() => loadGmds());
  const [running, setRunning] = React.useState(null); // {code, step, log:[]}
  const [showConfig, setShowConfig] = React.useState(false);

  // Per-feed status. {lastRun, lastResult: "ok"|"warn"|"err", rows, ref}
  const feedStatus = (code) => state.feeds && state.feeds[code];

  const configured = !!state.dealerId;

  const runFeed = (feed, onDone) => {
    const lines = [];
    setRunning({ code: feed.code, step: 0, total: 7, log: lines });
    const steps = [
      `Starting feed ${feed.code} (${feed.name})…`,
      `Validating dealer GMDS ID = ${state.dealerId || "—"} …………… OK`,
      `Validating period ${currentPeriod()} vs DMS open period … OK`,
      `Reading records from primary tables ……………………………… 0 rows`,
      `Building submission ${feed.code}.CSV ……………………………… 0 rows`,
      `Compressing & SFTP-uploading to ${state.endpoint || "gmds.gm.com"} … OK`,
      `Submission accepted, ref # ${refNum()}`,
    ];
    let i = 0;
    const tick = () => {
      if (i >= steps.length) {
        const next = { ...state, feeds: { ...(state.feeds || {}), [feed.code]: {
          lastRun: new Date().toISOString(),
          lastResult: "ok",
          rows: 0,
          ref: refNum(),
        }}};
        setState(next); saveGmds(next);
        setTimeout(() => { setRunning(null); onDone && onDone(); }, 600);
        return;
      }
      lines.push({ ts: new Date().toLocaleTimeString(), text: steps[i++] });
      setRunning({ code: feed.code, step: i, total: steps.length, log: [...lines] });
      setTimeout(tick, 320);
    };
    tick();
  };

  const runAll = () => {
    if (!configured) {
      window.k2bToast && window.k2bToast("Configure your GMDS Dealer ID first.", "warn");
      setShowConfig(true);
      return;
    }
    let i = 0;
    const next = () => {
      if (i >= GMDS_FEEDS.length) {
        window.k2bToast && window.k2bToast(
          `All ${GMDS_FEEDS.length} GMDS feeds submitted successfully.`, "ok", 3000);
        return;
      }
      runFeed(GMDS_FEEDS[i++], next);
    };
    next();
  };

  return (
    <div style={{ padding: 20, height: "100%", boxSizing: "border-box", overflow: "auto" }}>

      {/* Page header */}
      <div style={{ display: "flex", alignItems: "center", marginBottom: 16, gap: 12 }}>
        <div>
          <div style={{ fontSize: 22, fontWeight: 700, color: "var(--jb-navy)" }}>
            GM Upload Tool
          </div>
          <div style={{ fontSize: 12, color: "var(--jb-text-dim)" }}>
            Nightly factory feeds to GM Dealer Communication Service (GMDS).
          </div>
        </div>
        <div style={{ flex: 1 }} />
        <K2BButton onClick={() => setShowConfig(true)}>⚙ Configure</K2BButton>
        <K2BButton onClick={runAll}
                    style={{ background: "var(--jb-yellow)", fontWeight: 700 }}>
          ▶ Run All Feeds
        </K2BButton>
      </div>

      {/* Status row */}
      <div style={{ display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 10, marginBottom: 16 }}>
        <StatBox label="Dealer GMDS ID"
                  value={state.dealerId || "Not set"}
                  tone={state.dealerId ? "ok" : "warn"} />
        <StatBox label="Endpoint"
                  value={state.endpoint || "gmds.gm.com"}
                  tone="ok" />
        <StatBox label="Schedule"
                  value={state.schedule || "Nightly @ 3:00 AM"}
                  tone="ok" />
        <StatBox label="Next run"
                  value={configured ? nextRunStr() : "—"}
                  tone={configured ? "ok" : "warn"} />
      </div>

      {/* First-time empty banner */}
      {!configured && (
        <div style={{
          padding: "14px 18px", marginBottom: 16,
          background: "var(--jb-amber-tint)",
          border: "1px solid var(--jb-amber)",
          borderRadius: "var(--jb-r-sm)",
          display: "flex", gap: 12, alignItems: "center",
        }}>
          <span style={{ fontSize: 22 }}>⚠</span>
          <div style={{ flex: 1, fontSize: 12, lineHeight: 1.5 }}>
            <b>GMDS isn't configured yet.</b> Click <b>Configure</b> to enter your dealer's GMDS
            ID (issued by GM, format <code>NNN-XXX-XX</code>) and the SFTP endpoint. After that,
            The system will run all 7 feeds every night automatically.
          </div>
          <K2BButton onClick={() => setShowConfig(true)}
                      style={{ background: "var(--jb-yellow)", fontWeight: 700 }}>
            Configure now ▸
          </K2BButton>
        </div>
      )}

      {/* Feed cards */}
      <div style={{ display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(320px, 1fr))", gap: 12 }}>
        {GMDS_FEEDS.map((f) => {
          const s = feedStatus(f.code);
          const isRun = running && running.code === f.code;
          return (
            <div key={f.code} style={{
              background: "var(--jb-surface)",
              border: "1px solid " + (isRun ? "var(--jb-blue)" : "var(--jb-border)"),
              borderRadius: "var(--jb-r-lg)",
              padding: "14px 16px",
              boxShadow: "var(--jb-shadow-sm)",
            }}>
              <div style={{ display: "flex", alignItems: "center", gap: 8, marginBottom: 6 }}>
                <span style={{
                  fontFamily: "var(--jb-mono)", fontWeight: 700,
                  fontSize: 11, padding: "2px 6px", borderRadius: 3,
                  background: "var(--jb-navy)", color: "var(--jb-yellow)",
                }}>{f.code}</span>
                <span style={{ fontWeight: 700, color: "var(--jb-navy)", fontSize: 13 }}>{f.name}</span>
                <span style={{ flex: 1 }} />
                <FeedBadge status={s} running={isRun} />
              </div>
              <div style={{ fontSize: 12, color: "var(--jb-text-dim)", marginBottom: 10, lineHeight: 1.45 }}>
                {f.desc}
              </div>
              <div style={{ display: "flex", alignItems: "center", gap: 10, fontSize: 11, color: "var(--jb-text-dim)" }}>
                <span>📅 {f.freq}</span>
                <span style={{ color: "var(--jb-border-strong)" }}>·</span>
                <span>{s ? `Last run ${new Date(s.lastRun).toLocaleString()}` : "Never run"}</span>
                <span style={{ flex: 1 }} />
                <K2BButton small disabled={!configured || running}
                            onClick={() => runFeed(f)}>
                  ▶ Run
                </K2BButton>
              </div>
            </div>
          );
        })}
      </div>

      {/* Live run console */}
      {running && (
        <div style={{
          marginTop: 18, padding: "12px 14px",
          background: "#0B1220", color: "#A0E0A0",
          fontFamily: "var(--jb-mono)", fontSize: 12,
          borderRadius: "var(--jb-r-lg)",
          maxHeight: 220, overflow: "auto",
        }}>
          <div style={{ display: "flex", alignItems: "center", gap: 8, marginBottom: 6,
                        color: "var(--jb-yellow)", fontWeight: 700 }}>
            <span style={{
              width: 8, height: 8, borderRadius: "50%", background: "var(--jb-green)",
              animation: "pulse 1s ease-in-out infinite",
            }} />
            Running {running.code}… ({running.step}/{running.total})
          </div>
          <style>{`@keyframes pulse { 0%,100% { opacity:.4; } 50% { opacity:1; } }`}</style>
          {running.log.map((line, i) => (
            <div key={i}>
              <span style={{ color: "#677" }}>[{line.ts}]</span>{" "}
              <span>{line.text}</span>
            </div>
          ))}
        </div>
      )}

      {showConfig && <ConfigModal state={state} onClose={() => setShowConfig(false)}
                                  onSave={(s) => { setState(s); saveGmds(s); setShowConfig(false);
                                    window.k2bToast && window.k2bToast("GMDS configuration saved.", "ok");
                                  }} />}
    </div>
  );
};

const StatBox = ({ label, value, tone }) => (
  <div style={{
    background: "var(--jb-surface)",
    border: "1px solid " + (tone === "warn" ? "var(--jb-amber)" : "var(--jb-border)"),
    borderRadius: "var(--jb-r-sm)",
    padding: "10px 14px",
  }}>
    <div style={{ fontSize: 10, textTransform: "uppercase", letterSpacing: "0.06em",
                  color: "var(--jb-text-dim)", fontWeight: 600 }}>{label}</div>
    <div style={{ fontSize: 14, fontWeight: 700,
                  color: tone === "warn" ? "var(--jb-amber)" : "var(--jb-navy)",
                  marginTop: 3, fontFamily: "var(--jb-mono)" }}>{value}</div>
  </div>
);

const FeedBadge = ({ status, running }) => {
  if (running) return <Badge tone="info">● Running</Badge>;
  if (!status) return <Badge tone="muted">Never run</Badge>;
  if (status.lastResult === "ok")  return <Badge tone="ok">✓ OK</Badge>;
  if (status.lastResult === "warn") return <Badge tone="warn">⚠ Warning</Badge>;
  return <Badge tone="err">✕ Failed</Badge>;
};

const Badge = ({ tone, children }) => {
  const map = {
    ok:    { bg: "var(--jb-green-tint)",  fg: "var(--jb-green)" },
    warn:  { bg: "var(--jb-amber-tint)",  fg: "var(--jb-amber)" },
    err:   { bg: "var(--jb-red-tint)",    fg: "var(--jb-red)"   },
    info:  { bg: "var(--jb-blue-tint)",   fg: "var(--jb-blue)"  },
    muted: { bg: "var(--jb-surface-2)",   fg: "var(--jb-text-dim)" },
  }[tone] || { bg: "var(--jb-surface-2)", fg: "var(--jb-text-dim)" };
  return <span style={{
    padding: "2px 8px", borderRadius: 4, fontSize: 11, fontWeight: 700,
    background: map.bg, color: map.fg,
  }}>{children}</span>;
};

const ConfigModal = ({ state, onClose, onSave }) => {
  const [dealerId, setDealerId]   = React.useState(state.dealerId || "");
  const [endpoint, setEndpoint]   = React.useState(state.endpoint || "gmds.gm.com");
  const [user, setUser]           = React.useState(state.user || "");
  const [schedule, setSchedule]   = React.useState(state.schedule || "Nightly @ 3:00 AM");
  return (
    <K2BModal title="GMDS Configuration" onClose={onClose} width={520}
              buttons={<>
                <K2BButton onClick={onClose}>Cancel</K2BButton>
                <K2BButton style={{ background: "var(--jb-yellow)", fontWeight: 700 }}
                            onClick={() => onSave({ ...state, dealerId, endpoint, user, schedule })}>
                  Save Configuration
                </K2BButton>
              </>}>
      <div style={{ fontSize: 12, color: "var(--jb-text-dim)", marginBottom: 14, lineHeight: 1.5 }}>
        These come from your GM Dealer Communication Service (DCS) packet. If you don't have them,
        call GM Dealer Support at <b>1-888-337-3768</b>.
      </div>
      <div style={{ display: "grid", gridTemplateColumns: "150px 1fr", rowGap: 10, columnGap: 12, alignItems: "center" }}>
        <span>Dealer GMDS ID *</span>
        <input value={dealerId} onChange={(e) => setDealerId(e.target.value)}
                placeholder="e.g. 123-ABC-MO" autoFocus />
        <span>SFTP Endpoint</span>
        <input value={endpoint} onChange={(e) => setEndpoint(e.target.value)} />
        <span>SFTP User</span>
        <input value={user} onChange={(e) => setUser(e.target.value)}
                placeholder="e.g. dealer-123" />
        <span>Schedule</span>
        <select value={schedule} onChange={(e) => setSchedule(e.target.value)}>
          <option>Nightly @ 3:00 AM</option>
          <option>Nightly @ 4:00 AM</option>
          <option>Nightly @ 11:00 PM</option>
          <option>Manual only</option>
        </select>
      </div>
    </K2BModal>
  );
};

function currentPeriod() {
  const d = new Date();
  return String(d.getMonth() + 1).padStart(2, "0") + "/" + d.getFullYear();
}
function refNum() {
  return "26-" + new Date().getFullYear() + "-" + String(new Date().getMonth() + 1).padStart(2, "0") +
          "-" + String(Math.floor(Math.random() * 9000) + 1000);
}
function nextRunStr() {
  const d = new Date();
  d.setDate(d.getDate() + 1);
  d.setHours(3, 0, 0, 0);
  return d.toLocaleString();
}

Object.assign(window, { GmdsExport, GMDS_FEEDS });