@anakin824/prdg-chat-ui 0.2.0 → 0.2.1

package/dist/index.d.mts

@@ -169,9 +169,14 @@ type ChatProviderProps = {
     natsWsUrl?: string;
     /** Optional NATS auth token (when the server uses token authentication). */
     natsToken?: string;
+    /**
+     * When true, logs `[prdg-chat]` diagnostics (identity resolution, message `sender_id` vs context `userId`).
+     * If omitted, set env `NEXT_PUBLIC_PRDG_CHAT_DEBUG=true` in the host app instead.
+     */
+    debug?: boolean;
     children: ReactNode;
 };
-declare function ChatProvider({ apiUrl, token, userId: userIdProp, tenantId: tenantIdProp, conduitlyTenantId: conduitlyTenantIdProp, theme, pollIntervalMs, onUnreadChange: _onUnreadChange, onTokenRefresh, callEnabled, natsWsUrl, natsToken, children, }: ChatProviderProps): react.JSX.Element | null;
+declare function ChatProvider({ apiUrl, token, userId: userIdProp, tenantId: tenantIdProp, conduitlyTenantId: conduitlyTenantIdProp, theme, pollIntervalMs, onUnreadChange: _onUnreadChange, onTokenRefresh, callEnabled, natsWsUrl, natsToken, debug: debugProp, children, }: ChatProviderProps): react.JSX.Element | null;
 
 type ListConversationsRes = {
     items: Conversation[];
@@ -274,6 +279,8 @@ type ChatContextValue = {
      * Key: conversationId. Value: array of user IDs (never includes the current user).
      */
     typingByConversation: Record<string, string[]>;
+    /** When true, logs identity + message ownership diagnostics to the console. */
+    debug: boolean;
 };
 declare function useChat(): ChatContextValue;
 

package/dist/index.d.ts

@@ -169,9 +169,14 @@ type ChatProviderProps = {
     natsWsUrl?: string;
     /** Optional NATS auth token (when the server uses token authentication). */
     natsToken?: string;
+    /**
+     * When true, logs `[prdg-chat]` diagnostics (identity resolution, message `sender_id` vs context `userId`).
+     * If omitted, set env `NEXT_PUBLIC_PRDG_CHAT_DEBUG=true` in the host app instead.
+     */
+    debug?: boolean;
     children: ReactNode;
 };
-declare function ChatProvider({ apiUrl, token, userId: userIdProp, tenantId: tenantIdProp, conduitlyTenantId: conduitlyTenantIdProp, theme, pollIntervalMs, onUnreadChange: _onUnreadChange, onTokenRefresh, callEnabled, natsWsUrl, natsToken, children, }: ChatProviderProps): react.JSX.Element | null;
+declare function ChatProvider({ apiUrl, token, userId: userIdProp, tenantId: tenantIdProp, conduitlyTenantId: conduitlyTenantIdProp, theme, pollIntervalMs, onUnreadChange: _onUnreadChange, onTokenRefresh, callEnabled, natsWsUrl, natsToken, debug: debugProp, children, }: ChatProviderProps): react.JSX.Element | null;
 
 type ListConversationsRes = {
     items: Conversation[];
@@ -274,6 +279,8 @@ type ChatContextValue = {
      * Key: conversationId. Value: array of user IDs (never includes the current user).
      */
     typingByConversation: Record<string, string[]>;
+    /** When true, logs identity + message ownership diagnostics to the console. */
+    debug: boolean;
 };
 declare function useChat(): ChatContextValue;
 

package/dist/index.js

@@ -118,6 +118,25 @@ var ChatAPI = class {
   }
 };
 
+// src/chat/lib/chatDebugLog.ts
+function resolveChatDebug(debugProp) {
+  if (debugProp === true) return true;
+  if (debugProp === false) return false;
+  try {
+    return typeof process !== "undefined" && process.env?.NEXT_PUBLIC_PRDG_CHAT_DEBUG === "true";
+  } catch {
+    return false;
+  }
+}
+function chatDebugLog(debug, ...args) {
+  if (!debug) return;
+  console.log("[prdg-chat]", ...args);
+}
+function chatDebugWarn(debug, ...args) {
+  if (!debug) return;
+  console.warn("[prdg-chat]", ...args);
+}
+
 // src/chat/lib/queryKeys.ts
 var chatKeys = {
   all: ["chat"],
@@ -337,8 +356,10 @@ function ChatProvider({
   callEnabled = false,
   natsWsUrl,
   natsToken,
+  debug: debugProp,
   children
 }) {
+  const debug = resolveChatDebug(debugProp);
   const queryClient = react.useMemo(
     () => new reactQuery.QueryClient({
       defaultOptions: {
@@ -367,15 +388,41 @@ function ChatProvider({
     conduitlyTenantIdProp
   );
   const [meError, setMeError] = react.useState(null);
+  react.useEffect(() => {
+    chatDebugLog(debug, "ChatProvider: session inputs", {
+      apiUrl: apiUrl.replace(/\/$/, ""),
+      hasToken: Boolean(token?.trim?.()),
+      userIdProp: userIdProp ?? null,
+      tenantIdProp: tenantIdProp ?? null,
+      conduitlyTenantIdProp: conduitlyTenantIdProp ?? null
+    });
+  }, [debug, apiUrl, token, userIdProp, tenantIdProp, conduitlyTenantIdProp]);
   react.useEffect(() => {
     setMeError(null);
     if (userIdProp) setResolvedUserId(userIdProp);
     if (tenantIdProp) setResolvedTenantId(tenantIdProp);
     if (conduitlyTenantIdProp) setResolvedConduitlyTenantId(conduitlyTenantIdProp);
-    if (userIdProp && tenantIdProp) return;
+    if (userIdProp && tenantIdProp) {
+      chatDebugLog(debug, "identity: using userId + tenantId props (skipping GET /me)", {
+        userId: userIdProp,
+        tenantId: tenantIdProp
+      });
+      return;
+    }
+    chatDebugLog(debug, "identity: fetching GET /me \u2026", {
+      missingUserId: !userIdProp,
+      missingTenantId: !tenantIdProp
+    });
     let cancelled = false;
     api.getMe().then((me) => {
       if (cancelled) return;
+      chatDebugLog(debug, "identity: GET /me ok", {
+        id: me.id,
+        tenant_id: me.tenant_id,
+        display_name: me.display_name,
+        ext_user_id: me.ext_user_id ?? null,
+        conduitly_tenant_id: me.conduitly_tenant_id ?? null
+      });
       if (!userIdProp) setResolvedUserId(me.id);
       if (!tenantIdProp) setResolvedTenantId(me.tenant_id);
       if (!conduitlyTenantIdProp && me.conduitly_tenant_id) {
@@ -383,11 +430,12 @@ function ChatProvider({
       }
     }).catch((err) => {
       if (!cancelled) setMeError(err instanceof Error ? err.message : String(err));
+      chatDebugWarn(debug, "identity: GET /me failed", err);
     });
     return () => {
       cancelled = true;
     };
-  }, [api, token, userIdProp, tenantIdProp, conduitlyTenantIdProp]);
+  }, [api, token, userIdProp, tenantIdProp, conduitlyTenantIdProp, debug]);
   const userId = resolvedUserId ?? "";
   const tenantId = resolvedTenantId ?? "";
   const mergedTheme = react.useMemo(() => ({ ...defaultTheme, ...theme }), [theme]);
@@ -451,7 +499,8 @@ function ChatProvider({
       sendTyping,
       sendTypingStop,
       sendRead,
-      typingByConversation
+      typingByConversation,
+      debug
     }),
     [
       api,
@@ -465,9 +514,18 @@ function ChatProvider({
       sendTyping,
       sendTypingStop,
       sendRead,
-      typingByConversation
+      typingByConversation,
+      debug
     ]
   );
+  react.useEffect(() => {
+    if (!resolvedUserId || !resolvedTenantId) return;
+    chatDebugLog(debug, "ChatProvider: context ready", {
+      userId: resolvedUserId,
+      tenantId: resolvedTenantId,
+      natsTenantId
+    });
+  }, [debug, resolvedUserId, resolvedTenantId, natsTenantId]);
   const layoutStyle = {
     flex: 1,
     minHeight: 0,
@@ -815,7 +873,7 @@ function escapeReg(s) {
   return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
 function MessageInput({ conversationId }) {
-  const { api, sendTyping, sendTypingStop, userId } = useChat();
+  const { api, sendTyping, sendTypingStop, userId, debug } = useChat();
   const qc = reactQuery.useQueryClient();
   const { uploadFile } = useUpload();
   const { recording, start, stop } = useVoiceRecorder();
@@ -955,6 +1013,17 @@ function MessageInput({ conversationId }) {
       });
     },
     onSuccess: (confirmedMessage, _payload, context) => {
+      if (debug && confirmedMessage.sender_id !== userId) {
+        chatDebugWarn(
+          debug,
+          "MessageInput: confirmed sender_id !== context userId (own-bubble alignment will be wrong)",
+          {
+            contextUserId: userId,
+            serverSenderId: confirmedMessage.sender_id,
+            messageId: confirmedMessage.id
+          }
+        );
+      }
       qc.setQueryData(chatKeys.messages(conversationId), (old) => {
         if (!old) return old;
         const optimisticIdx = old.items.findIndex((m) => m.id === context?.optimisticId);
@@ -1297,10 +1366,30 @@ function MessageThread({
   isFetchingOlder,
   hasMoreMessages
 }) {
+  const { userId, debug } = useChat();
   const scrollRef = react.useRef(null);
   const bottomRef = react.useRef(null);
   const sentinelRef = react.useRef(null);
   const ordered = [...messages].reverse();
+  react.useEffect(() => {
+    if (!debug || messages.length === 0) return;
+    const senders = new Set(messages.map((m) => m.sender_id));
+    const ownCount = messages.filter((m) => m.sender_id === userId).length;
+    const mismatchSample = messages.find((m) => m.sender_id !== userId);
+    chatDebugLog(debug, "MessageThread: sender snapshot", {
+      messageCount: messages.length,
+      contextUserId: userId,
+      uniqueSenderIds: [...senders],
+      ownMessageCount: ownCount,
+      contextMatchesAnySender: userId ? senders.has(userId) : false
+    });
+    if (userId && ownCount === 0 && messages.length > 0) {
+      chatDebugWarn(debug, "MessageThread: no messages match context userId (all bubbles show as \u201Cother\u201D)", {
+        contextUserId: userId,
+        sampleSenderId: mismatchSample?.sender_id ?? null
+      });
+    }
+  }, [debug, messages, userId]);
   const seenIdsRef = react.useRef(/* @__PURE__ */ new Set());
   const initializedRef = react.useRef(false);
   const prevCountRef = react.useRef(0);