@anakin824/prdg-chat-ui 0.3.1 → 0.3.3

package/dist/index.d.mts

@@ -482,6 +482,8 @@ type Props = {
 };
 declare function TypingIndicator({ names }: Props): react.JSX.Element | null;
 
+/** UUIDs are case-insensitive; normalize so NATS + UI always share one cache entry. */
+declare function normalizeConversationCacheId(conversationId: string | null): string | null;
 /** Stable React Query keys for chat — use with invalidateQueries / host integrations. */
 declare const chatKeys: {
     all: readonly ["chat"];
@@ -734,4 +736,4 @@ declare function useVoiceRecorder(): {
     } | null>;
 };
 
-export { type AppUser, ChatAPI, type ChatAppearance, MessageInput as ChatComposer, type ChatConfig, type ChatContextValue, ChatConversationView, type ChatConversationViewProps, ChatInboxSidebar, type ChatInboxSidebarProps, ChatMainColumn, type ChatMainColumnProps, ChatPanel, type ChatPanelProps, ChatProvider, type ChatProviderProps, type ChatTheme, ChatWidget, type ChatWidgetProps, type Conversation, ConversationList, type EntityConversationContext as EntityContext, INITIAL_MESSAGE_PAGE_SIZE, type Message, type MessageAttachment, MessageBubble, MessageInput, type MessagePage, MessageThread, NewChatModal, type SidebarTab, StandaloneChatPage, type StandaloneChatPageProps, TypingIndicator, type UserIdentityMode, type WSServerEvent, chatKeys, convDisplayName, convLabel, formatConvTime, initials, mergeMessagePages, useChat, useChatActions, useChatPanelController, useConversationMembers, useConversations, useMessages, usePresignedUrl, useUpload, useVoiceRecorder };
+export { type AppUser, ChatAPI, type ChatAppearance, MessageInput as ChatComposer, type ChatConfig, type ChatContextValue, ChatConversationView, type ChatConversationViewProps, ChatInboxSidebar, type ChatInboxSidebarProps, ChatMainColumn, type ChatMainColumnProps, ChatPanel, type ChatPanelProps, ChatProvider, type ChatProviderProps, type ChatTheme, ChatWidget, type ChatWidgetProps, type Conversation, ConversationList, type EntityConversationContext as EntityContext, INITIAL_MESSAGE_PAGE_SIZE, type Message, type MessageAttachment, MessageBubble, MessageInput, type MessagePage, MessageThread, NewChatModal, type SidebarTab, StandaloneChatPage, type StandaloneChatPageProps, TypingIndicator, type UserIdentityMode, type WSServerEvent, chatKeys, convDisplayName, convLabel, formatConvTime, initials, mergeMessagePages, normalizeConversationCacheId, useChat, useChatActions, useChatPanelController, useConversationMembers, useConversations, useMessages, usePresignedUrl, useUpload, useVoiceRecorder };

package/dist/index.d.ts

@@ -482,6 +482,8 @@ type Props = {
 };
 declare function TypingIndicator({ names }: Props): react.JSX.Element | null;
 
+/** UUIDs are case-insensitive; normalize so NATS + UI always share one cache entry. */
+declare function normalizeConversationCacheId(conversationId: string | null): string | null;
 /** Stable React Query keys for chat — use with invalidateQueries / host integrations. */
 declare const chatKeys: {
     all: readonly ["chat"];
@@ -734,4 +736,4 @@ declare function useVoiceRecorder(): {
     } | null>;
 };
 
-export { type AppUser, ChatAPI, type ChatAppearance, MessageInput as ChatComposer, type ChatConfig, type ChatContextValue, ChatConversationView, type ChatConversationViewProps, ChatInboxSidebar, type ChatInboxSidebarProps, ChatMainColumn, type ChatMainColumnProps, ChatPanel, type ChatPanelProps, ChatProvider, type ChatProviderProps, type ChatTheme, ChatWidget, type ChatWidgetProps, type Conversation, ConversationList, type EntityConversationContext as EntityContext, INITIAL_MESSAGE_PAGE_SIZE, type Message, type MessageAttachment, MessageBubble, MessageInput, type MessagePage, MessageThread, NewChatModal, type SidebarTab, StandaloneChatPage, type StandaloneChatPageProps, TypingIndicator, type UserIdentityMode, type WSServerEvent, chatKeys, convDisplayName, convLabel, formatConvTime, initials, mergeMessagePages, useChat, useChatActions, useChatPanelController, useConversationMembers, useConversations, useMessages, usePresignedUrl, useUpload, useVoiceRecorder };
+export { type AppUser, ChatAPI, type ChatAppearance, MessageInput as ChatComposer, type ChatConfig, type ChatContextValue, ChatConversationView, type ChatConversationViewProps, ChatInboxSidebar, type ChatInboxSidebarProps, ChatMainColumn, type ChatMainColumnProps, ChatPanel, type ChatPanelProps, ChatProvider, type ChatProviderProps, type ChatTheme, ChatWidget, type ChatWidgetProps, type Conversation, ConversationList, type EntityConversationContext as EntityContext, INITIAL_MESSAGE_PAGE_SIZE, type Message, type MessageAttachment, MessageBubble, MessageInput, type MessagePage, MessageThread, NewChatModal, type SidebarTab, StandaloneChatPage, type StandaloneChatPageProps, TypingIndicator, type UserIdentityMode, type WSServerEvent, chatKeys, convDisplayName, convLabel, formatConvTime, initials, mergeMessagePages, normalizeConversationCacheId, useChat, useChatActions, useChatPanelController, useConversationMembers, useConversations, useMessages, usePresignedUrl, useUpload, useVoiceRecorder };

package/dist/index.js

@@ -185,10 +185,15 @@ function chatDebugWarn(debug, ...args) {
 }
 
 // src/chat/lib/queryKeys.ts
+function normalizeConversationCacheId(conversationId) {
+  if (conversationId == null) return null;
+  const t = conversationId.trim();
+  return t ? t.toLowerCase() : null;
+}
 var chatKeys = {
   all: ["chat"],
   conversations: () => [...chatKeys.all, "conversations"],
-  messages: (conversationId) => [...chatKeys.all, "messages", conversationId],
+  messages: (conversationId) => [...chatKeys.all, "messages", normalizeConversationCacheId(conversationId)],
   members: (conversationId) => [...chatKeys.all, "members", conversationId],
   contacts: (q) => [...chatKeys.all, "contacts", q]
 };
@@ -227,74 +232,149 @@ function userInboxSubject(natsTenantId, userId) {
 function entityConversationSubject(natsTenantId, conversationId) {
   return `chat.${natsTenantId}.conversation.${conversationId}`;
 }
+function parseMessage(raw) {
+  if (typeof raw.id !== "string" || typeof raw.conversation_id !== "string") {
+    return null;
+  }
+  return {
+    id: raw.id,
+    conversation_id: raw.conversation_id,
+    sender_id: typeof raw.sender_id === "string" ? raw.sender_id : "",
+    body: typeof raw.body === "string" ? raw.body : null,
+    created_at: typeof raw.created_at === "string" ? raw.created_at : (/* @__PURE__ */ new Date()).toISOString(),
+    edited_at: typeof raw.edited_at === "string" ? raw.edited_at : null,
+    deleted_at: typeof raw.deleted_at === "string" ? raw.deleted_at : null,
+    attachments: Array.isArray(raw.attachments) ? raw.attachments : [],
+    mentioned_user_ids: Array.isArray(raw.mentioned_user_ids) ? raw.mentioned_user_ids : []
+  };
+}
+function getMessagePageSummary(queryClient, conversationId) {
+  const page = queryClient.getQueryData(chatKeys.messages(conversationId));
+  const lastItem = page && page.items.length > 0 ? page.items[page.items.length - 1] : null;
+  return {
+    count: page?.items.length ?? 0,
+    firstId: page?.items[0]?.id ?? null,
+    lastId: lastItem?.id ?? null
+  };
+}
 function pushMessageToCache(queryClient, msg) {
-  let inserted = false;
-  queryClient.setQueryData(
-    chatKeys.messages(msg.conversation_id),
-    (prev) => {
-      if (!prev) return void 0;
-      if (prev.items.some((m) => m.id === msg.id)) return prev;
-      inserted = true;
-      return { ...prev, items: [msg, ...prev.items] };
+  let result = "missing-cache";
+  queryClient.setQueryData(chatKeys.messages(msg.conversation_id), (prev) => {
+    if (!prev) {
+      result = "seeded";
+      return { items: [msg], next_cursor: "" };
     }
-  );
-  return inserted;
+    if (prev.items.some((m) => m.id === msg.id)) {
+      result = "duplicate";
+      return prev;
+    }
+    result = "updated";
+    return { ...prev, items: [msg, ...prev.items] };
+  });
+  return result;
 }
 function markDeletedInCache(queryClient, conversationId, messageId, deletedAt) {
+  let result = "missing-cache";
   queryClient.setQueryData(
     chatKeys.messages(conversationId),
     (prev) => {
       if (!prev) return void 0;
       const idx = prev.items.findIndex((m) => m.id === messageId);
-      if (idx === -1) return prev;
+      if (idx === -1) {
+        result = "missing-message";
+        return prev;
+      }
       const updated = [...prev.items];
       updated[idx] = { ...updated[idx], deleted_at: deletedAt };
+      result = "updated";
       return { ...prev, items: updated };
     }
   );
+  return result;
 }
 function applyEditInCache(queryClient, updated) {
+  let result = "missing-cache";
   queryClient.setQueryData(
     chatKeys.messages(updated.conversation_id),
     (prev) => {
       if (!prev) return void 0;
       const idx = prev.items.findIndex((m) => m.id === updated.id);
-      if (idx === -1) return prev;
+      if (idx === -1) {
+        result = "missing-message";
+        return prev;
+      }
       const items = [...prev.items];
       items[idx] = { ...items[idx], ...updated };
+      result = "updated";
       return { ...prev, items };
     }
   );
+  return result;
 }
-function invalidateQueriesFromNatsPayload(payload, queryClient) {
-  if (!payload || typeof payload !== "object") return;
+function invalidateQueriesFromNatsPayload(payload, queryClient, debug = false) {
+  if (!payload || typeof payload !== "object") {
+    chatDebugWarn(debug, "NATS cache update ignored: payload was not an object", payload);
+    return;
+  }
   const p = payload;
   const eventType = p.type;
-  if (typeof eventType !== "string") return;
+  if (typeof eventType !== "string") {
+    chatDebugWarn(debug, "NATS cache update ignored: payload.type missing", p);
+    return;
+  }
   const ed = p.event_data;
-  if (!ed || typeof ed !== "object") return;
+  if (!ed || typeof ed !== "object") {
+    chatDebugWarn(debug, "NATS cache update ignored: payload.event_data missing", {
+      eventType,
+      payload: p
+    });
+    return;
+  }
   const eventData = ed;
+  const conversationId = typeof eventData.conversation_id === "string" ? eventData.conversation_id : null;
+  chatDebugLog(debug, "NATS cache update received", {
+    eventType,
+    conversationId,
+    hasMessage: !!eventData.message && typeof eventData.message === "object"
+  });
   if (eventType === "chat.message.new") {
     const convId = eventData.conversation_id;
-    if (typeof convId !== "string" || !convId.trim()) return;
+    if (typeof convId !== "string" || !convId.trim()) {
+      chatDebugWarn(debug, "NATS message.new ignored: missing conversation_id", eventData);
+      return;
+    }
+    const before = getMessagePageSummary(queryClient, convId);
     const msgRaw = eventData.message;
     if (msgRaw && typeof msgRaw === "object") {
       const raw = msgRaw;
-      if (typeof raw.id === "string" && typeof raw.conversation_id === "string") {
-        const msg = {
-          id: raw.id,
-          conversation_id: raw.conversation_id,
-          sender_id: typeof raw.sender_id === "string" ? raw.sender_id : "",
-          body: typeof raw.body === "string" ? raw.body : null,
-          created_at: typeof raw.created_at === "string" ? raw.created_at : (/* @__PURE__ */ new Date()).toISOString(),
-          edited_at: typeof raw.edited_at === "string" ? raw.edited_at : null,
-          deleted_at: typeof raw.deleted_at === "string" ? raw.deleted_at : null,
-          attachments: Array.isArray(raw.attachments) ? raw.attachments : [],
-          mentioned_user_ids: Array.isArray(raw.mentioned_user_ids) ? raw.mentioned_user_ids : []
-        };
-        pushMessageToCache(queryClient, msg);
+      const msg = parseMessage(raw);
+      if (msg) {
+        const mutation = pushMessageToCache(queryClient, msg);
+        const after = getMessagePageSummary(queryClient, convId);
+        chatDebugLog(debug, "NATS message.new cache mutation", {
+          conversationId: convId,
+          messageId: msg.id,
+          mutation,
+          before,
+          after
+        });
+      } else {
+        chatDebugWarn(debug, "NATS message.new ignored: event_data.message missing required ids", {
+          conversationId: convId,
+          message: raw
+        });
       }
+    } else {
+      chatDebugWarn(debug, "NATS message.new ignored: event_data.message missing or not an object", {
+        conversationId: convId,
+        eventData
+      });
     }
+    chatDebugLog(debug, "NATS message.new invalidating queries", {
+      conversationId: convId,
+      messageQueryKey: chatKeys.messages(convId),
+      conversationsQueryKey: chatKeys.conversations()
+    });
     void queryClient.invalidateQueries({ queryKey: chatKeys.messages(convId) });
     void queryClient.invalidateQueries({ queryKey: chatKeys.conversations() });
     return;
@@ -303,21 +383,20 @@ function invalidateQueriesFromNatsPayload(payload, queryClient) {
     const msgRaw = eventData.message;
     if (msgRaw && typeof msgRaw === "object") {
       const raw = msgRaw;
-      if (typeof raw.id === "string" && typeof raw.conversation_id === "string") {
-        const updated = {
-          id: raw.id,
-          conversation_id: raw.conversation_id,
-          sender_id: typeof raw.sender_id === "string" ? raw.sender_id : "",
-          body: typeof raw.body === "string" ? raw.body : null,
-          created_at: typeof raw.created_at === "string" ? raw.created_at : (/* @__PURE__ */ new Date()).toISOString(),
-          edited_at: typeof raw.edited_at === "string" ? raw.edited_at : null,
-          deleted_at: typeof raw.deleted_at === "string" ? raw.deleted_at : null,
-          attachments: Array.isArray(raw.attachments) ? raw.attachments : [],
-          mentioned_user_ids: Array.isArray(raw.mentioned_user_ids) ? raw.mentioned_user_ids : []
-        };
-        applyEditInCache(queryClient, updated);
+      const updated = parseMessage(raw);
+      if (updated) {
+        const mutation = applyEditInCache(queryClient, updated);
+        chatDebugLog(debug, "NATS message.edited cache mutation", {
+          conversationId: updated.conversation_id,
+          messageId: updated.id,
+          mutation
+        });
         void queryClient.invalidateQueries({ queryKey: chatKeys.messages(updated.conversation_id) });
+      } else {
+        chatDebugWarn(debug, "NATS message.edited ignored: event_data.message missing required ids", raw);
       }
+    } else {
+      chatDebugWarn(debug, "NATS message.edited ignored: event_data.message missing or not an object", eventData);
     }
     return;
   }
@@ -329,16 +408,27 @@ function invalidateQueriesFromNatsPayload(payload, queryClient) {
       const convId = raw.conversation_id;
       const deletedAt = typeof raw.deleted_at === "string" ? raw.deleted_at : (/* @__PURE__ */ new Date()).toISOString();
       if (typeof msgId === "string" && typeof convId === "string") {
-        markDeletedInCache(queryClient, convId, msgId, deletedAt);
+        const mutation = markDeletedInCache(queryClient, convId, msgId, deletedAt);
+        chatDebugLog(debug, "NATS message.deleted cache mutation", {
+          conversationId: convId,
+          messageId: msgId,
+          mutation
+        });
         void queryClient.invalidateQueries({ queryKey: chatKeys.messages(convId) });
+      } else {
+        chatDebugWarn(debug, "NATS message.deleted ignored: event_data.message missing required ids", raw);
       }
+    } else {
+      chatDebugWarn(debug, "NATS message.deleted ignored: event_data.message missing or not an object", eventData);
     }
+    return;
   }
+  chatDebugLog(debug, "NATS payload ignored: unsupported event type", { eventType, eventData });
 }
 
 // src/chat/provider/ChatNatsBridge.tsx
 function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
-  const { natsTenantId, userId, queryClient } = useChat();
+  const { natsTenantId, userId, queryClient, debug } = useChat();
   const { data: convData } = useConversations();
   const entityConversationIds = react.useMemo(() => {
     const items = convData?.items ?? [];
@@ -351,6 +441,13 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
   const connRef = react.useRef(null);
   react.useEffect(() => {
     if (servers.length === 0) return;
+    const entityConvIds = entityKey ? entityKey.split(",").filter(Boolean) : [];
+    chatDebugLog(debug, "ChatNatsBridge: starting subscriptions", {
+      userId,
+      natsTenantId,
+      servers,
+      entityConversationIds: entityConvIds
+    });
     let cancelled = false;
     void (async () => {
       try {
@@ -369,10 +466,21 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
         }
         connRef.current = conn;
         onConnectedChangeRef.current(true);
+        chatDebugLog(debug, "ChatNatsBridge: NATS connected", {
+          userId,
+          natsTenantId,
+          servers
+        });
         const handleMsg = (data, subject) => {
+          const payloadText = new TextDecoder().decode(data);
           if (process.env.NODE_ENV === "development") {
             console.debug("[NATS] raw message received on subject:", subject, "bytes:", data.length);
           }
+          chatDebugLog(debug, "ChatNatsBridge: NATS payload received", {
+            subject,
+            bytes: data.length,
+            payloadText
+          });
           let payload;
           try {
             payload = jc.decode(data);
@@ -385,7 +493,7 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
           if (process.env.NODE_ENV === "development") {
             console.debug("[NATS] decoded payload:", payload);
           }
-          invalidateQueriesFromNatsPayload(payload, queryClient);
+          invalidateQueriesFromNatsPayload(payload, queryClient, debug);
           if (process.env.NODE_ENV === "development") {
             if (payload && typeof payload === "object" && payload.type === "chat.message.new") {
               const p = payload;
@@ -423,6 +531,7 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
           }
         };
         const inbox = userInboxSubject(natsTenantId, userId);
+        chatDebugLog(debug, "ChatNatsBridge: subscribing inbox", { inbox });
         const subInbox = conn.subscribe(inbox);
         void (async () => {
           for await (const m of subInbox) {
@@ -430,8 +539,12 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
             handleMsg(m.data, m.subject);
           }
         })();
-        for (const convId of entityConversationIds) {
+        for (const convId of entityConvIds) {
           const subj = entityConversationSubject(natsTenantId, convId);
+          chatDebugLog(debug, "ChatNatsBridge: subscribing entity conversation", {
+            conversationId: convId,
+            subject: subj
+          });
           const sub = conn.subscribe(subj);
           void (async () => {
             for await (const m of sub) {
@@ -443,7 +556,7 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
         if (process.env.NODE_ENV === "development") {
           const subjectList = [
             inbox,
-            ...entityConversationIds.map((id) => entityConversationSubject(natsTenantId, id))
+            ...entityConvIds.map((id) => entityConversationSubject(natsTenantId, id))
           ];
           console.info("[NATS] WebSocket connected \u2014 servers:", servers, "subjects:", subjectList);
           void (async () => {
@@ -455,23 +568,26 @@ function ChatNatsBridge({ natsWsUrl, natsToken, onConnectedChange }) {
         }
         await conn.closed();
         connRef.current = null;
+        chatDebugWarn(debug, "ChatNatsBridge: NATS connection closed");
         if (!cancelled) onConnectedChangeRef.current(false);
       } catch (err) {
         connRef.current = null;
         if (process.env.NODE_ENV === "development") {
           console.error("[NATS] WebSocket connect failed \u2014 check ws:// URL, NATS websocket block, and CORS/mixed content:", err);
         }
+        chatDebugWarn(debug, "ChatNatsBridge: NATS connection failed", err);
         if (!cancelled) onConnectedChangeRef.current(false);
       }
     })();
     return () => {
       cancelled = true;
+      chatDebugLog(debug, "ChatNatsBridge: cleaning up subscriptions");
       onConnectedChangeRef.current(false);
       const c = connRef.current;
       connRef.current = null;
       void c?.drain();
     };
-  }, [servers, natsToken, natsTenantId, userId, entityKey, queryClient, entityConversationIds]);
+  }, [servers, natsToken, natsTenantId, userId, entityKey, queryClient, debug]);
   return null;
 }
 
@@ -847,16 +963,28 @@ function appendOlderMessages(current, older) {
 // src/chat/hooks/useMessages.ts
 var INITIAL_MESSAGE_PAGE_SIZE = 30;
 function useMessages(conversationId) {
-  const { api, wsConnected, config, queryClient } = useChat();
+  const { api, wsConnected, config, queryClient, debug } = useChat();
   const interval = config.pollIntervalMs ?? 3e4;
   const [isFetchingOlder, setIsFetchingOlder] = react.useState(false);
   const fetchingRef = react.useRef(false);
   const query = reactQuery.useQuery({
     queryKey: chatKeys.messages(conversationId),
     queryFn: async () => {
+      chatDebugLog(debug, "useMessages: queryFn start", {
+        conversationId,
+        wsConnected
+      });
       const res = await api.listMessages(conversationId, void 0, INITIAL_MESSAGE_PAGE_SIZE);
       const prev = queryClient.getQueryData(chatKeys.messages(conversationId));
-      return mergeMessagePages(res, prev);
+      const merged = mergeMessagePages(res, prev);
+      chatDebugLog(debug, "useMessages: queryFn success", {
+        conversationId,
+        serverCount: res.items.length,
+        previousCachedCount: prev?.items.length ?? 0,
+        mergedCount: merged.items.length,
+        firstMessageId: merged.items[0]?.id ?? null
+      });
+      return merged;
     },
     enabled: !!conversationId,
     refetchInterval: wsConnected ? false : interval
@@ -880,6 +1008,29 @@ function useMessages(conversationId) {
   }, [conversationId, queryClient, api]);
   const cached = queryClient.getQueryData(chatKeys.messages(conversationId));
   const hasMoreMessages = !!cached?.next_cursor;
+  react.useEffect(() => {
+    if (!conversationId) return;
+    chatDebugLog(debug, "useMessages: hook snapshot", {
+      conversationId,
+      wsConnected,
+      status: query.status,
+      fetchStatus: query.fetchStatus,
+      dataCount: query.data?.items.length ?? 0,
+      cachedCount: cached?.items.length ?? 0,
+      firstDataMessageId: query.data?.items[0]?.id ?? null,
+      firstCachedMessageId: cached?.items[0]?.id ?? null
+    });
+  }, [
+    cached?.items.length,
+    cached?.items[0]?.id,
+    conversationId,
+    debug,
+    query.data?.items.length,
+    query.data?.items[0]?.id,
+    query.fetchStatus,
+    query.status,
+    wsConnected
+  ]);
   return {
     ...query,
     fetchOlderMessages,
@@ -2280,6 +2431,7 @@ exports.convLabel = convLabel;
 exports.formatConvTime = formatConvTime;
 exports.initials = initials2;
 exports.mergeMessagePages = mergeMessagePages;
+exports.normalizeConversationCacheId = normalizeConversationCacheId;
 exports.useChat = useChat;
 exports.useChatActions = useChatActions;
 exports.useChatPanelController = useChatPanelController;