import { api } from "../lib/api.js";
import { emit, on } from "../lib/bus.js";
class ChatSimulator extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: "open" });
this._lastPayload = null;
this._sending = false;
this.shadowRoot.innerHTML = `
`;
}
connectedCallback() {
const evoInstanceEl = this.shadowRoot.getElementById("instance");
const evoFromEl = this.shadowRoot.getElementById("evoFrom");
const evoToEl = this.shadowRoot.getElementById("evoTo");
const evoPushEl = this.shadowRoot.getElementById("pushName");
const evoTextEl = this.shadowRoot.getElementById("evoText");
const sendEvoEl = this.shadowRoot.getElementById("sendEvo");
const retryEl = this.shadowRoot.getElementById("retry");
const statusEl = this.shadowRoot.getElementById("status");
const genId = () =>
(self.crypto?.randomUUID?.() || `${Date.now()}${Math.random()}`)
.replace(/-/g, "")
.slice(0, 22)
.toUpperCase();
const buildPayload = ({ text, from, to, instance, pushName }) => {
const nowSec = Math.floor(Date.now() / 1000);
return {
body: {
event: "messages.upsert",
instance,
data: {
key: {
remoteJid: from,
fromMe: false,
id: genId(),
participant: "",
addressingMode: "pn",
},
pushName: pushName || "test_lucas",
status: "DELIVERY_ACK",
message: { conversation: text },
messageType: "conversation",
messageTimestamp: nowSec,
instanceId: genId(),
source: "sim",
to,
},
date_time: new Date().toISOString(),
sender: from,
server_url: "http://localhost",
apikey: "SIM",
},
};
};
const setSending = (v) => {
this._sending = Boolean(v);
sendEvoEl.disabled = this._sending;
retryEl.disabled = this._sending;
statusEl.textContent = this._sending ? "Enviando…" : "—";
};
const sendAction = async ({ payloadOverride = null } = {}) => {
const instance = evoInstanceEl.value.trim() || "Piaf";
const from = evoFromEl.value.trim() || "5491133230322@s.whatsapp.net"; // cliente
const to = evoToEl.value.trim() || "5491137887040@s.whatsapp.net"; // canal/destino
const text = evoTextEl.value.trim();
const pushName = evoPushEl.value.trim();
if (!from || !text) {
alert("Falta from o text");
return;
}
// Optimistic: que aparezca en la columna izquierda al instante
emit("conversation:upsert", {
chat_id: from,
from: pushName || "test_lucas",
state: "IDLE",
intent: "other",
status: "ok",
last_activity: new Date().toISOString(),
last_run_id: null,
});
emit("ui:selectedChat", { chat_id: from });
// Optimistic: mostrar burbuja del usuario inmediatamente
emit("message:optimistic", {
chat_id: from,
message_id: `optimistic-${Date.now()}`,
direction: "in",
text,
ts: new Date().toISOString(),
provider: "sim",
pushName: pushName || "test_lucas",
});
const payload = payloadOverride || buildPayload({ text, from, to, instance, pushName });
this._lastPayload = { ...payload, body: { ...payload.body, data: { ...payload.body.data, key: { ...payload.body.data.key, id: genId() } } } };
setSending(true);
try {
const data = await api.simEvolution(payload);
console.log("[evolution sim] webhook response:", data);
if (!data.ok) {
statusEl.textContent = "Error enviando (ver consola)";
return;
}
evoTextEl.value = "";
evoTextEl.focus();
} catch (e) {
statusEl.textContent = `Error: ${String(e?.message || e)}`;
} finally {
setSending(false);
}
};
sendEvoEl.onclick = sendAction;
retryEl.onclick = () => {
const chat_id = evoFromEl.value.trim() || "5491133230322@s.whatsapp.net";
setSending(true);
api
.retryLast(chat_id)
.then((r) => {
if (!r?.ok) statusEl.textContent = `Retry error: ${r?.error || "unknown"}`;
else statusEl.textContent = "Retry enviado.";
})
.catch((e) => (statusEl.textContent = `Retry error: ${String(e?.message || e)}`))
.finally(() => setSending(false));
};
retryEl.disabled = false;
evoTextEl.addEventListener("keydown", (e) => {
if (e.key === "Enter" && !e.shiftKey) {
e.preventDefault();
sendAction();
}
});
this._unsub = on("conversation:upsert", (c) => {
const chat_id = evoFromEl.value.trim() || "5491133230322@s.whatsapp.net";
if (c.chat_id === chat_id) {
// placeholder: podrías reflejar estado/intent acá si querés
}
});
}
disconnectedCallback() {
this._unsub?.();
}
append(who, text) {
void who;
void text;
}
}
customElements.define("chat-simulator", ChatSimulator);