@glitchgrab/whatsapp 0.1.0

package/dist/react.mjs

@@ -0,0 +1,435 @@
+"use client";
+
+// src/inbox.tsx
+import { useMemo, useState as useState2 } from "react";
+
+// src/use-inbox.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+async function call(url, init) {
+  const res = await fetch(url, init);
+  const body = await res.json().catch(() => ({}));
+  if (!res.ok) throw new Error(body.error ?? `Request failed (${res.status})`);
+  return body;
+}
+function useInbox(options) {
+  const { api, live = true } = options;
+  const base = api.replace(/\/$/, "");
+  const [conversations, setConversations] = useState([]);
+  const [selected, setSelected] = useState(null);
+  const [agents, setAgents] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [sending, setSending] = useState(false);
+  const [error, setError] = useState(null);
+  const [connected, setConnected] = useState(false);
+  const selectedIdRef = useRef(options.initialConversationId ?? null);
+  const refresh = useCallback(async () => {
+    try {
+      const data = await call(`${base}/conversations`);
+      setConversations(data.conversations);
+      setError(null);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Could not load conversations");
+    } finally {
+      setLoading(false);
+    }
+  }, [base]);
+  const openThread = useCallback(
+    async (conversationId) => {
+      selectedIdRef.current = conversationId;
+      try {
+        const data = await call(
+          `${base}/conversations/${conversationId}`
+        );
+        setSelected(data.conversation);
+        setConversations(
+          (prev) => prev.map((c2) => c2.id === conversationId ? { ...c2, unreadCount: 0 } : c2)
+        );
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Could not open conversation");
+      }
+    },
+    [base]
+  );
+  useEffect(() => {
+    void refresh();
+    void call(`${base}/agents`).then((d) => setAgents(d.agents)).catch(() => void 0);
+    if (options.initialConversationId) void openThread(options.initialConversationId);
+  }, [base, refresh, openThread, options.initialConversationId]);
+  useEffect(() => {
+    if (!live) return;
+    let source = null;
+    let cancelled = false;
+    let retry = null;
+    const connect = async () => {
+      if (cancelled) return;
+      try {
+        const session = await call(`${base}/ticket`, {
+          method: "POST"
+        });
+        if (cancelled) return;
+        source = new EventSource(
+          `${session.baseUrl}/api/v1/wa/inbox/stream?ticket=${encodeURIComponent(session.ticket)}`
+        );
+        source.addEventListener("ready", () => setConnected(true));
+        source.addEventListener("conversation", (event) => {
+          const updated = JSON.parse(event.data);
+          setConversations((prev) => {
+            const rest = prev.filter((c2) => c2.id !== updated.id);
+            return [updated, ...rest];
+          });
+          if (selectedIdRef.current === updated.id) void openThread(updated.id);
+        });
+        source.addEventListener("reconnect", () => {
+          source?.close();
+          setConnected(false);
+          retry = setTimeout(connect, 100);
+        });
+        source.onerror = () => {
+          setConnected(false);
+          source?.close();
+          retry = setTimeout(connect, 3e3);
+        };
+      } catch {
+        if (!cancelled) retry = setTimeout(connect, 5e3);
+      }
+    };
+    void connect();
+    return () => {
+      cancelled = true;
+      if (retry) clearTimeout(retry);
+      source?.close();
+    };
+  }, [base, live, openThread]);
+  const send = useCallback(
+    async (text) => {
+      if (!selected || !text.trim()) return;
+      setSending(true);
+      try {
+        await call(`${base}/send`, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ to: selected.contactPhone, body: text })
+        });
+        await openThread(selected.id);
+        setError(null);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Could not send");
+      } finally {
+        setSending(false);
+      }
+    },
+    [base, selected, openThread]
+  );
+  const patch = useCallback(
+    async (body) => {
+      if (!selected) return;
+      try {
+        await call(`${base}/conversations/${selected.id}`, {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(body)
+        });
+        await openThread(selected.id);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Could not update conversation");
+      }
+    },
+    [base, selected, openThread]
+  );
+  return {
+    conversations,
+    selected,
+    agents,
+    loading,
+    sending,
+    error,
+    connected,
+    select: (id) => void openThread(id),
+    send,
+    assign: (agentId) => patch({ assignedAgentId: agentId }),
+    setStatus: (status) => patch({ status }),
+    refresh
+  };
+}
+
+// src/inbox.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var c = {
+  border: "var(--gg-wa-border, #e4e6eb)",
+  bg: "var(--gg-wa-bg, #ffffff)",
+  panel: "var(--gg-wa-panel, #f7f8fa)",
+  text: "var(--gg-wa-text, #111827)",
+  muted: "var(--gg-wa-muted, #6b7280)",
+  accent: "var(--gg-wa-accent, #128c7e)",
+  bubbleIn: "var(--gg-wa-bubble-in, #ffffff)",
+  bubbleOut: "var(--gg-wa-bubble-out, #d9fdd3)",
+  danger: "var(--gg-wa-danger, #b42318)"
+};
+function messageText(message) {
+  const payload = message.payload;
+  if (payload && "body" in payload && payload.body) return payload.body;
+  if (payload && "name" in payload && payload.name) return `\u{1F4C4} ${payload.name}`;
+  const inbound = payload?.messages?.[0];
+  return inbound?.text?.body ?? "(no text)";
+}
+function timeLabel(iso) {
+  const d = new Date(iso);
+  const today = /* @__PURE__ */ new Date();
+  const sameDay = d.toDateString() === today.toDateString();
+  return sameDay ? d.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" }) : d.toLocaleDateString(void 0, { day: "numeric", month: "short" });
+}
+function ConversationRow(props) {
+  const { conversation: conv, active, onSelect } = props;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: onSelect,
+      style: {
+        display: "block",
+        width: "100%",
+        textAlign: "left",
+        padding: "10px 12px",
+        border: "none",
+        borderBottom: `1px solid ${c.border}`,
+        background: active ? c.panel : "transparent",
+        cursor: "pointer",
+        font: "inherit",
+        color: c.text
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", gap: 8 }, children: [
+          /* @__PURE__ */ jsx("span", { style: { fontWeight: conv.unreadCount > 0 ? 600 : 500, fontSize: 14 }, children: conv.contactName || conv.contactPhone }),
+          /* @__PURE__ */ jsx("span", { style: { fontSize: 11, color: c.muted, whiteSpace: "nowrap" }, children: timeLabel(conv.updatedAt) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6, marginTop: 3 }, children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              style: {
+                fontSize: 12,
+                color: c.muted,
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap",
+                flex: 1
+              },
+              children: conv.lastMessage ? messageText(conv.lastMessage) : "\u2014"
+            }
+          ),
+          conv.unreadCount > 0 && /* @__PURE__ */ jsx(
+            "span",
+            {
+              style: {
+                background: c.accent,
+                color: "#fff",
+                borderRadius: 999,
+                fontSize: 11,
+                padding: "1px 6px"
+              },
+              children: conv.unreadCount
+            }
+          ),
+          conv.optedOut && /* @__PURE__ */ jsx("span", { style: { fontSize: 10, color: c.danger, border: `1px solid ${c.danger}`, borderRadius: 4, padding: "0 4px" }, children: "opted out" })
+        ] })
+      ]
+    }
+  );
+}
+function WhatsappInbox(props) {
+  const { height = 600, emptyLabel = "No conversations yet", ...options } = props;
+  const inbox = useInbox(options);
+  const [draft, setDraft] = useState2("");
+  const selected = inbox.selected;
+  const windowOpen = selected?.windowOpen ?? false;
+  const orderedMessages = useMemo(() => selected?.messages ?? [], [selected]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        height: typeof height === "number" ? `${height}px` : height,
+        border: `1px solid ${c.border}`,
+        borderRadius: 8,
+        overflow: "hidden",
+        background: c.bg,
+        color: c.text,
+        fontFamily: "system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif"
+      },
+      children: [
+        /* @__PURE__ */ jsxs("aside", { style: { width: 280, borderRight: `1px solid ${c.border}`, display: "flex", flexDirection: "column" }, children: [
+          /* @__PURE__ */ jsxs(
+            "header",
+            {
+              style: {
+                padding: "10px 12px",
+                borderBottom: `1px solid ${c.border}`,
+                display: "flex",
+                alignItems: "center",
+                gap: 6
+              },
+              children: [
+                /* @__PURE__ */ jsx("strong", { style: { fontSize: 14, flex: 1 }, children: "Inbox" }),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    title: inbox.connected ? "Live" : "Reconnecting\u2026",
+                    style: {
+                      width: 8,
+                      height: 8,
+                      borderRadius: 999,
+                      background: inbox.connected ? c.accent : c.muted
+                    }
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { style: { overflowY: "auto", flex: 1 }, children: [
+            inbox.loading && /* @__PURE__ */ jsx("p", { style: { padding: 12, fontSize: 13, color: c.muted }, children: "Loading\u2026" }),
+            !inbox.loading && inbox.conversations.length === 0 && /* @__PURE__ */ jsx("p", { style: { padding: 12, fontSize: 13, color: c.muted }, children: emptyLabel }),
+            inbox.conversations.map((conv) => /* @__PURE__ */ jsx(
+              ConversationRow,
+              {
+                conversation: conv,
+                active: selected?.id === conv.id,
+                onSelect: () => inbox.select(conv.id)
+              },
+              conv.id
+            ))
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("section", { style: { flex: 1, display: "flex", flexDirection: "column", background: c.panel }, children: [
+          !selected && /* @__PURE__ */ jsx("div", { style: { margin: "auto", color: c.muted, fontSize: 14 }, children: "Select a conversation" }),
+          selected && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs(
+              "header",
+              {
+                style: {
+                  padding: "10px 14px",
+                  borderBottom: `1px solid ${c.border}`,
+                  background: c.bg,
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 10
+                },
+                children: [
+                  /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: 14, fontWeight: 600 }, children: selected.contactName || selected.contactPhone }),
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: c.muted }, children: selected.contactPhone })
+                  ] }),
+                  inbox.agents.length > 0 && /* @__PURE__ */ jsxs(
+                    "select",
+                    {
+                      value: selected.assignedAgentId ?? "",
+                      onChange: (e) => void inbox.assign(e.target.value || null),
+                      style: { fontSize: 12, padding: "4px 6px", borderRadius: 6, border: `1px solid ${c.border}` },
+                      children: [
+                        /* @__PURE__ */ jsx("option", { value: "", children: "Unassigned" }),
+                        inbox.agents.map((a) => /* @__PURE__ */ jsx("option", { value: a.id, children: a.name }, a.id))
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "select",
+                    {
+                      value: selected.status,
+                      onChange: (e) => void inbox.setStatus(e.target.value),
+                      style: { fontSize: 12, padding: "4px 6px", borderRadius: 6, border: `1px solid ${c.border}` },
+                      children: [
+                        /* @__PURE__ */ jsx("option", { value: "OPEN", children: "Open" }),
+                        /* @__PURE__ */ jsx("option", { value: "SNOOZED", children: "Snoozed" }),
+                        /* @__PURE__ */ jsx("option", { value: "CLOSED", children: "Closed" })
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { style: { flex: 1, overflowY: "auto", padding: 14, display: "flex", flexDirection: "column", gap: 8 }, children: orderedMessages.map((m) => {
+              const outbound = m.direction === "OUTBOUND";
+              return /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    alignSelf: outbound ? "flex-end" : "flex-start",
+                    maxWidth: "72%",
+                    background: outbound ? c.bubbleOut : c.bubbleIn,
+                    border: `1px solid ${c.border}`,
+                    borderRadius: 10,
+                    padding: "7px 10px"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: 13, whiteSpace: "pre-wrap", wordBreak: "break-word" }, children: messageText(m) }),
+                    /* @__PURE__ */ jsxs("div", { style: { fontSize: 10, color: m.status === "FAILED" ? c.danger : c.muted, marginTop: 3, textAlign: "right" }, children: [
+                      timeLabel(m.createdAt),
+                      outbound && ` \xB7 ${m.status.toLowerCase()}`
+                    ] })
+                  ]
+                },
+                m.id
+              );
+            }) }),
+            /* @__PURE__ */ jsxs("footer", { style: { borderTop: `1px solid ${c.border}`, background: c.bg, padding: 10 }, children: [
+              inbox.error && /* @__PURE__ */ jsx("p", { style: { margin: "0 0 8px", fontSize: 12, color: c.danger }, children: inbox.error }),
+              !windowOpen ? /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: 12, color: c.muted }, children: "This contact hasn't messaged in the last 24 hours, so a free reply can't be delivered. Send an approved template instead." }) : /* @__PURE__ */ jsxs(
+                "form",
+                {
+                  onSubmit: (e) => {
+                    e.preventDefault();
+                    const text = draft;
+                    setDraft("");
+                    void inbox.send(text);
+                  },
+                  style: { display: "flex", gap: 8 },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "input",
+                      {
+                        value: draft,
+                        onChange: (e) => setDraft(e.target.value),
+                        placeholder: "Type a reply\u2026",
+                        disabled: inbox.sending,
+                        style: {
+                          flex: 1,
+                          padding: "8px 10px",
+                          borderRadius: 8,
+                          border: `1px solid ${c.border}`,
+                          font: "inherit",
+                          fontSize: 13
+                        }
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "submit",
+                        disabled: inbox.sending || !draft.trim(),
+                        style: {
+                          padding: "8px 14px",
+                          borderRadius: 8,
+                          border: "none",
+                          background: c.accent,
+                          color: "#fff",
+                          fontSize: 13,
+                          cursor: inbox.sending || !draft.trim() ? "not-allowed" : "pointer",
+                          opacity: inbox.sending || !draft.trim() ? 0.6 : 1
+                        },
+                        children: inbox.sending ? "Sending\u2026" : "Send"
+                      }
+                    )
+                  ]
+                }
+              )
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  WhatsappInbox,
+  useInbox
+};
+//# sourceMappingURL=react.mjs.map

package/dist/react.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/inbox.tsx","../src/use-inbox.ts"],"sourcesContent":["\"use client\";\n\nimport { useMemo, useState } from \"react\";\nimport { useInbox, type UseInboxOptions } from \"./use-inbox\";\nimport type { WaConversation, WaMessage } from \"./types\";\n\n/**\n * A drop-in shared inbox.\n *\n * Styled with inline styles rather than a CSS file or a framework: this ships\n * into other people's apps, and a stylesheet that has to be imported (or a\n * Tailwind class that only works if they use Tailwind) is the fastest way to\n * make a \"drop-in\" component not drop in. Colours come from CSS custom\n * properties so a host can restyle without forking.\n */\n\nexport interface WhatsappInboxProps extends UseInboxOptions {\n  height?: number | string;\n  emptyLabel?: string;\n}\n\nconst c = {\n  border: \"var(--gg-wa-border, #e4e6eb)\",\n  bg: \"var(--gg-wa-bg, #ffffff)\",\n  panel: \"var(--gg-wa-panel, #f7f8fa)\",\n  text: \"var(--gg-wa-text, #111827)\",\n  muted: \"var(--gg-wa-muted, #6b7280)\",\n  accent: \"var(--gg-wa-accent, #128c7e)\",\n  bubbleIn: \"var(--gg-wa-bubble-in, #ffffff)\",\n  bubbleOut: \"var(--gg-wa-bubble-out, #d9fdd3)\",\n  danger: \"var(--gg-wa-danger, #b42318)\",\n};\n\nfunction messageText(message: WaMessage): string {\n  const payload = message.payload as\n    | { type?: string; body?: string; name?: string }\n    | { messages?: { text?: { body?: string } }[] }\n    | undefined;\n\n  if (payload && \"body\" in payload && payload.body) return payload.body;\n  if (payload && \"name\" in payload && payload.name) return `📄 ${payload.name}`;\n\n  // Inbound rows store Meta's raw webhook value, which nests the text.\n  const inbound = (payload as { messages?: { text?: { body?: string } }[] } | undefined)?.messages?.[0];\n  return inbound?.text?.body ?? \"(no text)\";\n}\n\nfunction timeLabel(iso: string): string {\n  const d = new Date(iso);\n  const today = new Date();\n  const sameDay = d.toDateString() === today.toDateString();\n  return sameDay\n    ? d.toLocaleTimeString(undefined, { hour: \"2-digit\", minute: \"2-digit\" })\n    : d.toLocaleDateString(undefined, { day: \"numeric\", month: \"short\" });\n}\n\nfunction ConversationRow(props: {\n  conversation: WaConversation;\n  active: boolean;\n  onSelect: () => void;\n}) {\n  const { conversation: conv, active, onSelect } = props;\n  return (\n    <button\n      type=\"button\"\n      onClick={onSelect}\n      style={{\n        display: \"block\",\n        width: \"100%\",\n        textAlign: \"left\",\n        padding: \"10px 12px\",\n        border: \"none\",\n        borderBottom: `1px solid ${c.border}`,\n        background: active ? c.panel : \"transparent\",\n        cursor: \"pointer\",\n        font: \"inherit\",\n        color: c.text,\n      }}\n    >\n      <div style={{ display: \"flex\", justifyContent: \"space-between\", gap: 8 }}>\n        <span style={{ fontWeight: conv.unreadCount > 0 ? 600 : 500, fontSize: 14 }}>\n          {conv.contactName || conv.contactPhone}\n        </span>\n        <span style={{ fontSize: 11, color: c.muted, whiteSpace: \"nowrap\" }}>\n          {timeLabel(conv.updatedAt)}\n        </span>\n      </div>\n      <div style={{ display: \"flex\", alignItems: \"center\", gap: 6, marginTop: 3 }}>\n        <span\n          style={{\n            fontSize: 12,\n            color: c.muted,\n            overflow: \"hidden\",\n            textOverflow: \"ellipsis\",\n            whiteSpace: \"nowrap\",\n            flex: 1,\n          }}\n        >\n          {conv.lastMessage ? messageText(conv.lastMessage) : \"—\"}\n        </span>\n        {conv.unreadCount > 0 && (\n          <span\n            style={{\n              background: c.accent,\n              color: \"#fff\",\n              borderRadius: 999,\n              fontSize: 11,\n              padding: \"1px 6px\",\n            }}\n          >\n            {conv.unreadCount}\n          </span>\n        )}\n        {/* Opted out is worth a permanent marker: it silently changes what an\n            agent is allowed to send, and there is no error until they try. */}\n        {conv.optedOut && (\n          <span style={{ fontSize: 10, color: c.danger, border: `1px solid ${c.danger}`, borderRadius: 4, padding: \"0 4px\" }}>\n            opted out\n          </span>\n        )}\n      </div>\n    </button>\n  );\n}\n\nexport function WhatsappInbox(props: WhatsappInboxProps) {\n  const { height = 600, emptyLabel = \"No conversations yet\", ...options } = props;\n  const inbox = useInbox(options);\n  const [draft, setDraft] = useState(\"\");\n\n  const selected = inbox.selected;\n  const windowOpen = selected?.windowOpen ?? false;\n\n  const orderedMessages = useMemo(() => selected?.messages ?? [], [selected]);\n\n  return (\n    <div\n      style={{\n        display: \"flex\",\n        height: typeof height === \"number\" ? `${height}px` : height,\n        border: `1px solid ${c.border}`,\n        borderRadius: 8,\n        overflow: \"hidden\",\n        background: c.bg,\n        color: c.text,\n        fontFamily:\n          \"system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif\",\n      }}\n    >\n      <aside style={{ width: 280, borderRight: `1px solid ${c.border}`, display: \"flex\", flexDirection: \"column\" }}>\n        <header\n          style={{\n            padding: \"10px 12px\",\n            borderBottom: `1px solid ${c.border}`,\n            display: \"flex\",\n            alignItems: \"center\",\n            gap: 6,\n          }}\n        >\n          <strong style={{ fontSize: 14, flex: 1 }}>Inbox</strong>\n          {/* A dot rather than a label: agents need to know the feed is live,\n              not read a status sentence on every render. */}\n          <span\n            title={inbox.connected ? \"Live\" : \"Reconnecting…\"}\n            style={{\n              width: 8,\n              height: 8,\n              borderRadius: 999,\n              background: inbox.connected ? c.accent : c.muted,\n            }}\n          />\n        </header>\n\n        <div style={{ overflowY: \"auto\", flex: 1 }}>\n          {inbox.loading && <p style={{ padding: 12, fontSize: 13, color: c.muted }}>Loading…</p>}\n          {!inbox.loading && inbox.conversations.length === 0 && (\n            <p style={{ padding: 12, fontSize: 13, color: c.muted }}>{emptyLabel}</p>\n          )}\n          {inbox.conversations.map((conv) => (\n            <ConversationRow\n              key={conv.id}\n              conversation={conv}\n              active={selected?.id === conv.id}\n              onSelect={() => inbox.select(conv.id)}\n            />\n          ))}\n        </div>\n      </aside>\n\n      <section style={{ flex: 1, display: \"flex\", flexDirection: \"column\", background: c.panel }}>\n        {!selected && (\n          <div style={{ margin: \"auto\", color: c.muted, fontSize: 14 }}>\n            Select a conversation\n          </div>\n        )}\n\n        {selected && (\n          <>\n            <header\n              style={{\n                padding: \"10px 14px\",\n                borderBottom: `1px solid ${c.border}`,\n                background: c.bg,\n                display: \"flex\",\n                alignItems: \"center\",\n                gap: 10,\n              }}\n            >\n              <div style={{ flex: 1 }}>\n                <div style={{ fontSize: 14, fontWeight: 600 }}>\n                  {selected.contactName || selected.contactPhone}\n                </div>\n                <div style={{ fontSize: 11, color: c.muted }}>{selected.contactPhone}</div>\n              </div>\n\n              {inbox.agents.length > 0 && (\n                <select\n                  value={selected.assignedAgentId ?? \"\"}\n                  onChange={(e) => void inbox.assign(e.target.value || null)}\n                  style={{ fontSize: 12, padding: \"4px 6px\", borderRadius: 6, border: `1px solid ${c.border}` }}\n                >\n                  <option value=\"\">Unassigned</option>\n                  {inbox.agents.map((a) => (\n                    <option key={a.id} value={a.id}>\n                      {a.name}\n                    </option>\n                  ))}\n                </select>\n              )}\n\n              <select\n                value={selected.status}\n                onChange={(e) => void inbox.setStatus(e.target.value as \"OPEN\" | \"SNOOZED\" | \"CLOSED\")}\n                style={{ fontSize: 12, padding: \"4px 6px\", borderRadius: 6, border: `1px solid ${c.border}` }}\n              >\n                <option value=\"OPEN\">Open</option>\n                <option value=\"SNOOZED\">Snoozed</option>\n                <option value=\"CLOSED\">Closed</option>\n              </select>\n            </header>\n\n            <div style={{ flex: 1, overflowY: \"auto\", padding: 14, display: \"flex\", flexDirection: \"column\", gap: 8 }}>\n              {orderedMessages.map((m) => {\n                const outbound = m.direction === \"OUTBOUND\";\n                return (\n                  <div\n                    key={m.id}\n                    style={{\n                      alignSelf: outbound ? \"flex-end\" : \"flex-start\",\n                      maxWidth: \"72%\",\n                      background: outbound ? c.bubbleOut : c.bubbleIn,\n                      border: `1px solid ${c.border}`,\n                      borderRadius: 10,\n                      padding: \"7px 10px\",\n                    }}\n                  >\n                    <div style={{ fontSize: 13, whiteSpace: \"pre-wrap\", wordBreak: \"break-word\" }}>\n                      {messageText(m)}\n                    </div>\n                    <div style={{ fontSize: 10, color: m.status === \"FAILED\" ? c.danger : c.muted, marginTop: 3, textAlign: \"right\" }}>\n                      {timeLabel(m.createdAt)}\n                      {outbound && ` · ${m.status.toLowerCase()}`}\n                    </div>\n                  </div>\n                );\n              })}\n            </div>\n\n            <footer style={{ borderTop: `1px solid ${c.border}`, background: c.bg, padding: 10 }}>\n              {inbox.error && (\n                <p style={{ margin: \"0 0 8px\", fontSize: 12, color: c.danger }}>{inbox.error}</p>\n              )}\n\n              {/* The single most confusing thing about WhatsApp for an agent:\n                  outside the 24-hour window free text is accepted by Meta and\n                  never delivered. Saying so up front beats a silent failure. */}\n              {!windowOpen ? (\n                <p style={{ margin: 0, fontSize: 12, color: c.muted }}>\n                  This contact hasn&apos;t messaged in the last 24 hours, so a free reply\n                  can&apos;t be delivered. Send an approved template instead.\n                </p>\n              ) : (\n                <form\n                  onSubmit={(e) => {\n                    e.preventDefault();\n                    const text = draft;\n                    setDraft(\"\");\n                    void inbox.send(text);\n                  }}\n                  style={{ display: \"flex\", gap: 8 }}\n                >\n                  <input\n                    value={draft}\n                    onChange={(e) => setDraft(e.target.value)}\n                    placeholder=\"Type a reply…\"\n                    disabled={inbox.sending}\n                    style={{\n                      flex: 1,\n                      padding: \"8px 10px\",\n                      borderRadius: 8,\n                      border: `1px solid ${c.border}`,\n                      font: \"inherit\",\n                      fontSize: 13,\n                    }}\n                  />\n                  <button\n                    type=\"submit\"\n                    disabled={inbox.sending || !draft.trim()}\n                    style={{\n                      padding: \"8px 14px\",\n                      borderRadius: 8,\n                      border: \"none\",\n                      background: c.accent,\n                      color: \"#fff\",\n                      fontSize: 13,\n                      cursor: inbox.sending || !draft.trim() ? \"not-allowed\" : \"pointer\",\n                      opacity: inbox.sending || !draft.trim() ? 0.6 : 1,\n                    }}\n                  >\n                    {inbox.sending ? \"Sending…\" : \"Send\"}\n                  </button>\n                </form>\n              )}\n            </footer>\n          </>\n        )}\n      </section>\n    </div>\n  );\n}\n","\"use client\";\n\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { WaAgent, WaConversation, WaMessage } from \"./types\";\n\n/**\n * The inbox's data layer.\n *\n * Talks to *your* proxy route (see `createInboxHandler`), never to us directly —\n * except the SSE stream, which needs a long-lived connection and so goes to us\n * with a short-lived ticket your route mints.\n */\n\nexport interface UseInboxOptions {\n  /** Where you mounted `createInboxHandler`. */\n  api: string;\n  /** Open this thread on mount. */\n  initialConversationId?: string;\n  /** Set false to load once and skip the live stream. */\n  live?: boolean;\n}\n\nexport interface UseInboxResult {\n  conversations: WaConversation[];\n  selected: (WaConversation & { messages: WaMessage[] }) | null;\n  agents: WaAgent[];\n  loading: boolean;\n  sending: boolean;\n  error: string | null;\n  connected: boolean;\n  select: (conversationId: string) => void;\n  send: (text: string) => Promise<void>;\n  assign: (agentId: string | null) => Promise<void>;\n  setStatus: (status: \"OPEN\" | \"SNOOZED\" | \"CLOSED\") => Promise<void>;\n  refresh: () => Promise<void>;\n}\n\nasync function call<T>(url: string, init?: RequestInit): Promise<T> {\n  const res = await fetch(url, init);\n  const body = (await res.json().catch(() => ({}))) as T & { error?: string };\n  if (!res.ok) throw new Error(body.error ?? `Request failed (${res.status})`);\n  return body as T;\n}\n\nexport function useInbox(options: UseInboxOptions): UseInboxResult {\n  const { api, live = true } = options;\n  const base = api.replace(/\\/$/, \"\");\n\n  const [conversations, setConversations] = useState<WaConversation[]>([]);\n  const [selected, setSelected] = useState<(WaConversation & { messages: WaMessage[] }) | null>(null);\n  const [agents, setAgents] = useState<WaAgent[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [sending, setSending] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n  const [connected, setConnected] = useState(false);\n\n  const selectedIdRef = useRef<string | null>(options.initialConversationId ?? null);\n\n  const refresh = useCallback(async () => {\n    try {\n      const data = await call<{ conversations: WaConversation[] }>(`${base}/conversations`);\n      setConversations(data.conversations);\n      setError(null);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Could not load conversations\");\n    } finally {\n      setLoading(false);\n    }\n  }, [base]);\n\n  const openThread = useCallback(\n    async (conversationId: string) => {\n      selectedIdRef.current = conversationId;\n      try {\n        const data = await call<{ conversation: WaConversation & { messages: WaMessage[] } }>(\n          `${base}/conversations/${conversationId}`\n        );\n        setSelected(data.conversation);\n        // Reading clears the badge server-side; mirror it so the list does not\n        // keep showing an unread count until the next stream tick.\n        setConversations((prev) =>\n          prev.map((c) => (c.id === conversationId ? { ...c, unreadCount: 0 } : c))\n        );\n      } catch (err) {\n        setError(err instanceof Error ? err.message : \"Could not open conversation\");\n      }\n    },\n    [base]\n  );\n\n  useEffect(() => {\n    void refresh();\n    void call<{ agents: WaAgent[] }>(`${base}/agents`)\n      .then((d) => setAgents(d.agents))\n      .catch(() => undefined); // seats are optional; the inbox works without them\n    if (options.initialConversationId) void openThread(options.initialConversationId);\n  }, [base, refresh, openThread, options.initialConversationId]);\n\n  /**\n   * The live stream.\n   *\n   * `EventSource` reconnects on its own and replays `Last-Event-ID`, so a\n   * dropped connection resumes rather than losing messages. The server closes\n   * the stream deliberately before the platform's function timeout; that arrives\n   * as a `reconnect` event and is a normal part of the lifecycle, not an error.\n   */\n  useEffect(() => {\n    if (!live) return;\n\n    let source: EventSource | null = null;\n    let cancelled = false;\n    let retry: ReturnType<typeof setTimeout> | null = null;\n\n    const connect = async () => {\n      if (cancelled) return;\n      try {\n        const session = await call<{ ticket: string; baseUrl: string }>(`${base}/ticket`, {\n          method: \"POST\",\n        });\n        if (cancelled) return;\n\n        source = new EventSource(\n          `${session.baseUrl}/api/v1/wa/inbox/stream?ticket=${encodeURIComponent(session.ticket)}`\n        );\n\n        source.addEventListener(\"ready\", () => setConnected(true));\n\n        source.addEventListener(\"conversation\", (event) => {\n          const updated = JSON.parse((event as MessageEvent).data) as WaConversation;\n          setConversations((prev) => {\n            const rest = prev.filter((c) => c.id !== updated.id);\n            return [updated, ...rest];\n          });\n          // Refresh the open thread so a new message appears in it, not just in\n          // the list beside it.\n          if (selectedIdRef.current === updated.id) void openThread(updated.id);\n        });\n\n        source.addEventListener(\"reconnect\", () => {\n          source?.close();\n          setConnected(false);\n          // Immediate: the server closed on purpose and a new ticket is needed.\n          retry = setTimeout(connect, 100);\n        });\n\n        source.onerror = () => {\n          setConnected(false);\n          source?.close();\n          // The ticket may simply have expired, so reconnect rather than\n          // surfacing an error the user cannot act on.\n          retry = setTimeout(connect, 3000);\n        };\n      } catch {\n        if (!cancelled) retry = setTimeout(connect, 5000);\n      }\n    };\n\n    void connect();\n\n    return () => {\n      cancelled = true;\n      if (retry) clearTimeout(retry);\n      source?.close();\n    };\n  }, [base, live, openThread]);\n\n  const send = useCallback(\n    async (text: string) => {\n      if (!selected || !text.trim()) return;\n      setSending(true);\n      try {\n        await call(`${base}/send`, {\n          method: \"POST\",\n          headers: { \"Content-Type\": \"application/json\" },\n          body: JSON.stringify({ to: selected.contactPhone, body: text }),\n        });\n        await openThread(selected.id);\n        setError(null);\n      } catch (err) {\n        setError(err instanceof Error ? err.message : \"Could not send\");\n      } finally {\n        setSending(false);\n      }\n    },\n    [base, selected, openThread]\n  );\n\n  const patch = useCallback(\n    async (body: Record<string, unknown>) => {\n      if (!selected) return;\n      try {\n        await call(`${base}/conversations/${selected.id}`, {\n          method: \"PATCH\",\n          headers: { \"Content-Type\": \"application/json\" },\n          body: JSON.stringify(body),\n        });\n        await openThread(selected.id);\n      } catch (err) {\n        setError(err instanceof Error ? err.message : \"Could not update conversation\");\n      }\n    },\n    [base, selected, openThread]\n  );\n\n  return {\n    conversations,\n    selected,\n    agents,\n    loading,\n    sending,\n    error,\n    connected,\n    select: (id) => void openThread(id),\n    send,\n    assign: (agentId) => patch({ assignedAgentId: agentId }),\n    setStatus: (status) => patch({ status }),\n    refresh,\n  };\n}\n"],"mappings":"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","names":["useState","c","useState"]}

package/dist/types-BKOEzRzb.d.mts

@@ -0,0 +1,97 @@
+/** Shared shapes. Mirrors the `/api/v1/wa` responses. */
+type WaTemplateCategory = "MARKETING" | "UTILITY" | "AUTHENTICATION" | "SERVICE";
+type WaTemplateStatus = "DRAFT" | "PENDING" | "APPROVED" | "REJECTED" | "PAUSED" | "DISABLED";
+type WaMessageDirection = "INBOUND" | "OUTBOUND";
+type WaMessageStatus = "QUEUED" | "SENT" | "DELIVERED" | "READ" | "FAILED";
+type WaConversationStatus = "OPEN" | "SNOOZED" | "CLOSED";
+type WaMatchType = "EXACT" | "CONTAINS" | "STARTS_WITH" | "REGEX" | "ANY";
+/**
+ * Every failure carries a stable `code`, so callers branch on that rather than
+ * matching on a message that may be reworded.
+ */
+type WaErrorCode = "UNAUTHORIZED" | "PLATFORM_INACTIVE" | "TENANT_NOT_FOUND" | "INSUFFICIENT_FUNDS" | "NO_PRICE_RULE" | "INVALID_AMOUNT" | "DUPLICATE_REQUEST" | "INTERNAL";
+declare class WhatsappError extends Error {
+    readonly code: WaErrorCode | string;
+    readonly status: number;
+    readonly detail?: Record<string, unknown> | undefined;
+    constructor(code: WaErrorCode | string, message: string, status: number, detail?: Record<string, unknown> | undefined);
+    /** The owner has run out of balance. `detail.shortfallPaise` says by how much. */
+    get isInsufficientFunds(): boolean;
+}
+interface WaNumber {
+    phoneNumberId: string;
+    displayNumber: string;
+    verifiedName: string;
+    status: "PENDING" | "VERIFIED" | "REGISTERED" | "DISCONNECTED";
+    qualityRating?: string | null;
+    messagingLimitTier?: string | null;
+}
+interface WaMessage {
+    id: string;
+    direction: WaMessageDirection;
+    status: WaMessageStatus;
+    contactPhone?: string;
+    category?: WaTemplateCategory | null;
+    payload: unknown;
+    error?: string | null;
+    sentAt?: string | null;
+    deliveredAt?: string | null;
+    readAt?: string | null;
+    createdAt: string;
+}
+interface WaConversation {
+    id: string;
+    contactPhone: string;
+    contactName?: string | null;
+    windowExpiresAt?: string | null;
+    /** Whether free-form text is legal right now. Computed server-side. */
+    windowOpen: boolean;
+    lastInboundAt?: string | null;
+    lastOutboundAt?: string | null;
+    optedOut: boolean;
+    status: WaConversationStatus;
+    assignedAgentId?: string | null;
+    unreadCount: number;
+    updatedAt: string;
+    lastMessage?: WaMessage | null;
+}
+interface WaTemplate {
+    id: string;
+    name: string;
+    language: string;
+    category: WaTemplateCategory;
+    status: WaTemplateStatus;
+    rejectionReason?: string | null;
+    components?: unknown;
+    submittedAt?: string | null;
+    lastSyncedAt?: string | null;
+}
+interface WaAgent {
+    id: string;
+    externalAgentId: string;
+    name: string;
+    email?: string | null;
+    role: "AGENT" | "ADMIN";
+    active: boolean;
+}
+interface WaBalance {
+    balancePaise: number;
+    heldPaise: number;
+    spendablePaise: number;
+}
+interface WaSendResult {
+    messageId: string;
+    metaMessageId: string;
+    status: "SENT";
+    category: WaTemplateCategory;
+    tenantPricePaise: number;
+    tenantBalancePaise: number;
+}
+interface WaSignupLaunch {
+    appId: string;
+    configId: string;
+    scopes: string[];
+    state: string;
+}
+
+export { type WaAgent as W, type WaBalance as a, type WaConversation as b, type WaConversationStatus as c, type WaErrorCode as d, type WaMatchType as e, type WaMessage as f, type WaMessageDirection as g, type WaMessageStatus as h, type WaNumber as i, type WaSendResult as j, type WaSignupLaunch as k, type WaTemplate as l, type WaTemplateCategory as m, type WaTemplateStatus as n, WhatsappError as o };