refactor: debug Ai chat Message

HousewareHQ · Jul 16, 2024 · 885b599 · 885b599
1 parent 7b7a920
commit 885b599
Show file tree

Hide file tree

Showing 6 changed files with 121 additions and 147 deletions.
diff --git a/package-dist/chatScreen/ChatScreenPA.d.ts b/package-dist/chatScreen/ChatScreenPA.d.ts
@@ -10,7 +10,7 @@ export interface CustomMessageComponentProp<T> {
         messages: T[];
         index: number;
         handleSendFollowupMessage?: (userQuery: string, regenerateResponse?: boolean) => void;
-    }) => ReactNode;
+    }) => ReactNode | undefined;
 }
 export interface ChatScreenPAProps<T> {
     messages: T[];

diff --git a/package-dist/ui-gallery.es.js b/package-dist/ui-gallery.es.js
@@ -92319,38 +92319,33 @@ function A6e({
   customMessageComponent: o,
   customMessageActionCardItem: a
 }) {
-  var p;
-  const s = (p = t[e]) == null ? void 0 : p.content, u = (t == null ? void 0 : t.length) - 1 === e && r, c = o == null ? void 0 : o.component, d = c && (o == null ? void 0 : o.type), h = ({
-    messages: v,
-    index: g,
-    handleRegenerateResponse: m
-  }) => c ? /* @__PURE__ */ le.jsx(
-    c,
-    {
-      messages: v,
-      index: g,
-      handleSendFollowupMessage: m
-    }
-  ) : null, f = () => {
-    var y, C;
-    const v = s.type || ((y = s == null ? void 0 : s.query_response) == null ? void 0 : y.type), g = (s == null ? void 0 : s.data) || ((C = s == null ? void 0 : s.query_response) == null ? void 0 : C.data), m = s == null ? void 0 : s.query_configuration;
-    switch (v) {
+  var f;
+  const s = (f = t[e]) == null ? void 0 : f.content, u = (t == null ? void 0 : t.length) - 1 === e && r, c = o == null ? void 0 : o.component({
+    messages: t,
+    index: e,
+    handleSendFollowupMessage: i
+  }), d = !!c;
+  console.log("customMessageComponent: ", o), console.log("isCustomComponentValid: ", d), console.log("messages: ", t), console.log("index: ", e);
+  const h = () => {
+    var m, y;
+    const p = (s == null ? void 0 : s.type) || ((m = s == null ? void 0 : s.query_response) == null ? void 0 : m.type), v = (s == null ? void 0 : s.data) || ((y = s == null ? void 0 : s.query_response) == null ? void 0 : y.data), g = s == null ? void 0 : s.query_configuration;
+    switch (console.log("content: ", s), console.log("responseType: ", p), p) {
       case "text":
-        return /* @__PURE__ */ le.jsx(cr, { children: /* @__PURE__ */ le.jsx(Zb, { children: g }) });
+        return /* @__PURE__ */ le.jsx(cr, { children: /* @__PURE__ */ le.jsx(Zb, { children: v }) });
       case "trend":
         return /* @__PURE__ */ le.jsx(
           D6e,
           {
             chartResponse: s.query_response,
-            queryConfiguration: m
+            queryConfiguration: g
           }
         );
       case "funnel":
         return /* @__PURE__ */ le.jsx(
           P6e,
           {
             chartResponse: s.query_response,
-            queryConfiguration: m
+            queryConfiguration: g
           }
         );
       default:
@@ -92388,11 +92383,7 @@ function A6e({
             },
             gap: 14,
             children: [
-              d ? h({
-                messages: t,
-                index: e,
-                handleRegenerateResponse: i
-              }) : f(),
+              d ? c : h(),
               u && /* @__PURE__ */ le.jsx(
                 I6e,
                 {

diff --git a/package-dist/ui-gallery.umd.js b/package-dist/ui-gallery.umd.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ui-gallery",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "type": "module",
   "files": [
     "package-dist"

diff --git a/src/components/AIMessageComponents.tsx b/src/components/AIMessageComponents.tsx
@@ -34,34 +34,23 @@ export function AIMessageComponents<T extends BaseMessage>({
   const content = messages[index]?.content;
   const isLastMessage = messages?.length - 1 === index;
   const shouldShowActionCardItems = isLastMessage && showMessageActionCard;
-  const CustomComponent = customMessageComponent?.component;
-  const isCustomComponentValid =
-    CustomComponent && customMessageComponent?.type;
-
-  const renderCustomMessageComponent = ({
+  const customComponent = customMessageComponent?.component({
     messages,
     index,
-    handleRegenerateResponse,
-  }: {
-    messages: T[];
-    index: number;
-    handleRegenerateResponse: (
-      userQuery: string,
-      regenerateResponse?: boolean,
-    ) => void;
-  }) =>
-    CustomComponent ? (
-      <CustomComponent
-        messages={messages}
-        index={index}
-        handleSendFollowupMessage={handleRegenerateResponse}
-      />
-    ) : null;
+    handleSendFollowupMessage: handleRegenerateResponse,
+  });
+  const isCustomComponentValid = !!customComponent;
+  console.log('customMessageComponent: ', customMessageComponent);
+  console.log('isCustomComponentValid: ', isCustomComponentValid);
+  console.log('messages: ', messages);
+  console.log('index: ', index);
 
   const aiChatMessage = () => {
-    const responseType = content.type || content?.query_response?.type;
+    const responseType = content?.type || content?.query_response?.type;
     const data = content?.data || content?.query_response?.data;
     const queryConfiguration = content?.query_configuration;
+    console.log('content: ', content);
+    console.log('responseType: ', responseType);
 
     switch (responseType) {
       case 'text':
@@ -119,13 +108,7 @@ export function AIMessageComponents<T extends BaseMessage>({
         }}
         gap={14}
       >
-        {isCustomComponentValid
-          ? renderCustomMessageComponent({
-              messages,
-              index,
-              handleRegenerateResponse,
-            })
-          : aiChatMessage()}
+        {isCustomComponentValid ? customComponent : aiChatMessage()}
 
         {shouldShowActionCardItems && (
           <MessageActionCard<T>

diff --git a/src/components/chatScreen/ChatScreenPA.tsx b/src/components/chatScreen/ChatScreenPA.tsx
@@ -23,7 +23,7 @@ export interface CustomMessageComponentProp<T> {
       userQuery: string,
       regenerateResponse?: boolean,
     ) => void;
-  }) => ReactNode;
+  }) => ReactNode | undefined;
 }
 
 export interface ChatScreenPAProps<T> {