react-native-srschat 0.1.81 → 0.1.85

package/src/hooks/Stream.js

@@ -1,23 +1,38 @@
 import React, { useState, useEffect, useRef, useContext } from 'react';
-import { AppContext } from "../contexts/AppContext";
+import { AppContext } from '../contexts/AppContext';
 
 export function useWebSocketMessage() {
-    const { setIsComplete, startStreaming, setMessages, messages, setGhostMessage,data,
-        setTypingIndicator, setStartStreaming, lastUserMessage, stopActivated,sessionId,
-        setGhostCard, BASE_URL, setStopActivated, setLastMessageId, conversationStartTime } = useContext(AppContext);
-    
-    const wsProtocol = 'wss://'
-    const wsUrl = BASE_URL.replace(/^http(s)?:\/\//, '');
-    const ENDPOINT = '/send/event';
+  const {
+    setIsComplete,
+    startStreaming,
+    setMessages,
+    messages,
+    setGhostMessage,
+    data,
+    setTypingIndicator,
+    setStartStreaming,
+    lastUserMessage,
+    stopActivated,
+    sessionId,
+    setGhostCard,
+    BASE_URL,
+    setStopActivated,
+    setLastMessageId,
+    conversationStartTime,
+  } = useContext(AppContext);
 
-    const payload = {
-        "customer_code": data.customer_code,
-        "branch_code": data.branch_code, // "NBPISLA" 
-        "branch_full_name": data.branch_full_name,
-        "customer_token": data.customer_token, 
-        active_ship_to_information: { 
-            shipToId: data.active_ship_to,
-            /* "customerId": 0,
+  const wsProtocol = 'wss://';
+  const wsUrl = BASE_URL.replace(/^http(s)?:\/\//, '');
+  const ENDPOINT = '/send/event';
+
+  const payload = {
+    customer_code: data.customer_code,
+    branch_code: data.branch_code, // "NBPISLA"
+    branch_full_name: data.branch_full_name,
+    customer_token: data.customer_token,
+    active_ship_to_information: {
+      shipToId: data.active_ship_to,
+      /* "customerId": 0,
             "customerCode": "HPTA",
             "shipToSequenceId": 1,
             "customerShipToName": "HERITAGE PLUS TEST ACCOUNT",
@@ -40,9 +55,9 @@ export function useWebSocketMessage() {
             "insideSalesPerson": "",
             "secondarySalesPersonName": "",
             "secondarySalesPersonEmail": null */
-        },
-        branch_details: data.branch_details,
-        /* branch_details: {
+    },
+    branch_details: data.branch_details,
+    /* branch_details: {
             "active_branch_business_hours": "8:00 AM - 4:30 PM",
             "active_branch_email": "OrdersHarrisburg@bel-aqua.com",
             "active_branch_location": "Elizabethtown,PA",
@@ -50,235 +65,590 @@ export function useWebSocketMessage() {
             "active_branch_phone": "(717)-689-3314",
             "active_brand_name": "BEL-AQUA"
         }, */
-        user_query: lastUserMessage, 
-        session_id : data.session_id || data.session || sessionId,
-        conversation_start_time: conversationStartTime,
-        // /* customer_name: "Cristin Connerney",
-        user_UUID: data.user_id || "mobile_user_unspecified",
-        device: "mobile",
-        window_location: "mobile"
-    };
-    
-    const wsRef = useRef(null);
+    user_query: lastUserMessage,
+    session_id: data.session_id || data.session || sessionId,
+    conversation_start_time: conversationStartTime,
+    // /* customer_name: "Cristin Connerney",
+    user_UUID: data.user_id || 'mobile_user_unspecified',
+    device: 'mobile',
+    window_location: 'mobile',
+  };
+
+  const wsRef = useRef(null);
+
+  useEffect(() => {
+    if (startStreaming) {
+      console.log(payload, BASE_URL);
+      const socketUrl = `${wsProtocol}${wsUrl}${ENDPOINT}`;
+      console.log(socketUrl);
+
+      const ws = new WebSocket(socketUrl);
+      wsRef.current = ws;
 
-    useEffect(() => {
-        if (startStreaming) {
-            console.log(payload, BASE_URL)
-            const socketUrl = `${wsProtocol}${wsUrl}${ENDPOINT}`;
-            console.log(socketUrl)
+      ws.onopen = () => {
+        console.log('WebSocket connection established.');
+        ws.send(JSON.stringify(payload));
+      };
 
-            const ws = new WebSocket(socketUrl);
-            wsRef.current = ws;
+      ws.onmessage = event => {
+        const response = JSON.parse(event.data);
 
-            ws.onopen = () => {
-                console.log("WebSocket connection established.");
-                ws.send(JSON.stringify(payload));
+        if (response.type !== 'chunk') {
+          console.log(JSON.stringify(response, null, 2));
+        }
+        switch (response.type) {
+          case 'middle_message':
+            const middleMessage = {
+              type: 'middle',
+              text: response.message,
+              products: [],
+              product_cards: 'False',
+            };
+            setMessages([...messages, middleMessage]);
+            break;
+          case 'message':
+            if (
+              response.product_cards == 'False' ||
+              response.product_cards == false
+            ) {
+              setGhostMessage(false);
+              setTypingIndicator(false);
+            } else {
+              setGhostMessage(false);
+              setGhostCard(true);
+            }
+            const newMessage = {
+              type: 'ai',
+              message_id: response.message_id || '',
+              text: response.message,
+              feedback: 'True',
+              products: [],
+              product_cards: response.product_cards || 'False',
+              resource: response?.resource_details?.[0]?.link ?? '',
+              resource_type: response?.resource_details?.[0]?.type ?? '',
             };
+            setMessages(prevMessages => [...prevMessages, newMessage]);
+            setLastMessageId(response.message_id);
+            break;
+          case 'chunk':
+            const newContent = response.chunk;
+            const newMessageId = response.message_id;
 
-            ws.onmessage = (event) => {
-                const response = JSON.parse(event.data);
-                
-                if (response.type !== "chunk") {
-                    console.log(JSON.stringify(response, null, 2));
-                }
-                switch (response.type) {
-                    case 'middle_message':
-                        const middleMessage = {
-                            type: "middle",
-                            text: response.message,
-                            products: [],
-                            product_cards: "False",
-                          }
-                        setMessages([...messages, middleMessage])
-                        break;
-                    case 'message':
-                        if (response.product_cards == "False" || response.product_cards == false ) {
-                            setGhostMessage(false);
-                            setTypingIndicator(false)
-                        } else {
-                            setGhostMessage(false)
-                            setGhostCard(true)
-                        }
-                        const newMessage = {
-                            type: "ai",
-                            message_id: response.message_id || '',
-                            text: response.message,
-                            feedback: "True",
-                            products: [],
-                            product_cards: response.product_cards || "False",
-                            resource: response?.resource_details?.[0]?.link ?? "",
-                            resource_type: response?.resource_details?.[0]?.type ?? ""                          
-                        };
-                        setMessages((prevMessages) => [...prevMessages, newMessage]);
-                        setLastMessageId(response.message_id)
-                        break;
-                    case 'chunk':
-                        const newContent = response.chunk; 
-                        const newMessageId = response.message_id;
-                    
-                        setMessages(prevMessages => {
-                            if (prevMessages.length > 0 && prevMessages[prevMessages.length - 1].type === "ai") {
-                                return prevMessages.map((message, index) => 
-                                    index === prevMessages.length - 1
-                                    ? { 
-                                        ...message,
-                                        text: message.text + newContent,
-                                        message_id: newMessageId || message.message_id,
-                                        feedback: "True"
-                                    }
-                                    : message
-                                );
-                            } else {
-                                return [
-                                    ...prevMessages, 
-                                    { 
-                                        type: "ai", 
-                                        text: newContent,
-                                        message_id: newMessageId,
-                                        feedback: "True"
-                                    }
-                                ];
-                            }
-                        });
-                        setGhostMessage(false);
-                        if (newMessageId) {
-                            setLastMessageId(newMessageId);
-                        }
-                        break;                        
-                    case 'product_cards':
-                        setMessages(prevMessages => {
-                            const lastMessageIndex = prevMessages.length - 1;
-                    
-                            if (prevMessages[lastMessageIndex] && prevMessages[lastMessageIndex].type === "ai") {
-                                const expandedProducts = response.products.map(prod => ({
-                                    part_number: prod.part_number || "",
-                                    inventory_info: prod.inventory_info ? {
-                                        default_uom: prod.inventory_info.default_uom || "",
-                                        is_valid: prod.inventory_info.is_valid || false,
-                                        info_by_uom: prod.inventory_info.info_by_uom
-                                            ? Object.keys(prod.inventory_info.info_by_uom).reduce((acc, key) => {
-                                                const value = prod.inventory_info.info_by_uom[key] || {};
-                                                acc[key] = {
-                                                    gross_price: value.gross_price ?? 0,
-                                                    net_price: value.net_price ?? 0,
-                                                    is_on_sale: value.is_on_sale ?? false,
-                                                    quantity_available: value.quantity_available ?? 0,
-                                                    discounts: value.discounts ?? null,
-                                                    min_pack_qty: value.min_pack_qty ?? 0,
-                                                };
-                                                return acc;
-                                            }, {})
-                                            : {}
-                                    } : {},
-                                    product_details: prod.product_details ? {
-                                        brand: prod.product_details.brand || "",
-                                        flow: prod.product_details.flow || "",
-                                        heritage_link: prod.product_details.heritage_link || "",
-                                        image_url: prod.product_details.image_url || "",
-                                        is_pump: prod.product_details.is_pump || "",
-                                        manufacturer_id: prod.product_details.manufacturer_id || "",
-                                        mfg_number: prod.product_details.mfg_number || "",
-                                        part_number: prod.product_details.part_number || "",
-                                        product_description: prod.product_details.product_description || "",
-                                        product_name: prod.product_details.product_name || "",
-                                        type: prod.product_details.type || "",
-                                        vertical: prod.product_details.vertical || "",
-                                        sku: prod.product_details.sku || ""
-                                    } : {}
-                                }));
+            setMessages(prevMessages => {
+              if (
+                prevMessages.length > 0 &&
+                prevMessages[prevMessages.length - 1].type === 'ai'
+              ) {
+                return prevMessages.map((message, index) =>
+                  index === prevMessages.length - 1
+                    ? {
+                        ...message,
+                        text: message.text + newContent,
+                        message_id: newMessageId || message.message_id,
+                        feedback: 'True',
+                      }
+                    : message,
+                );
+              } else {
+                return [
+                  ...prevMessages,
+                  {
+                    type: 'ai',
+                    text: newContent,
+                    message_id: newMessageId,
+                    feedback: 'True',
+                  },
+                ];
+              }
+            });
+            setGhostMessage(false);
+            if (newMessageId) {
+              setLastMessageId(newMessageId);
+            }
+            break;
+          case 'product_cards':
+            console.log(
+              '\n\n\n\nthis is for my own sanity: ',
+              response.products[0],
+              '\n\n\n\n',
+            );
+            setMessages(prevMessages => {
+              const lastMessageIndex = prevMessages.length - 1;
 
-                                const updatedLastMessage = {
-                                    ...prevMessages[lastMessageIndex],
-                                    products: expandedProducts,
-                                    product_cards: "True"
-                                };
-                    
-                                return [
-                                    ...prevMessages.slice(0, lastMessageIndex),
-                                    updatedLastMessage
-                                ];
-                            }
-                    
-                            return prevMessages;
-                        });
-                    
-                        setGhostMessage(false);
-                        setTypingIndicator(false);
-                        setGhostCard(false);
-                        break;
-                    case 'product_document':
-                        setMessages(prevMessages => {
-                            const lastMessageIndex = prevMessages.length - 1;
-                            if (prevMessages[lastMessageIndex] && prevMessages[lastMessageIndex].type === "ai") {
-                                const updatedLastMessage = {
-                                    ...prevMessages[lastMessageIndex],
-                                    resource: response?.resource_details?.[0]?.link ?? "",
-                                    resource_type: response?.resource_details?.[0]?.type ?? ""
-                                };
-                                return [
-                                    ...prevMessages.slice(0, lastMessageIndex),
-                                    updatedLastMessage
-                                ];
-                            }
-                        });
-                        setGhostMessage(false);
-                        setTypingIndicator(false)
-                        setGhostCard(false)
-                        break;
-                    case 'suggested_questions':
-                        setMessages(prevMessages => {
-                            const lastMessageIndex = prevMessages.length - 1;
-                            if (prevMessages[lastMessageIndex] && prevMessages[lastMessageIndex].type === "ai") {
-                                const updatedLastMessage = {
-                                    ...prevMessages[lastMessageIndex],
-                                    suggested_questions: true,
-                                    questions: response.suggested_questions 
+              if (
+                prevMessages[lastMessageIndex] &&
+                prevMessages[lastMessageIndex].type === 'ai'
+              ) {
+                const expandedProducts = response.products.map(prod => ({
+                  part_number: prod.part_number || '',
+                  inventory_info: prod.inventory_info
+                    ? {
+                        default_uom: prod.inventory_info.default_uom || '',
+                        is_valid: prod.inventory_info.is_valid || false,
+                        info_by_uom: prod.inventory_info.info_by_uom
+                          ? Object.keys(prod.inventory_info.info_by_uom).reduce(
+                              (acc, key) => {
+                                const value =
+                                  prod.inventory_info.info_by_uom[key] || {};
+                                acc[key] = {
+                                  gross_price: value.gross_price ?? 0,
+                                  net_price: value.net_price ?? 0,
+                                  is_on_sale: value.is_on_sale ?? false,
+                                  quantity_available:
+                                    value.quantity_available ?? 0,
+                                  discounts: value.discounts ?? null,
+                                  min_pack_qty: value.min_pack_qty ?? 0,
                                 };
-                                return [
-                                    ...prevMessages.slice(0, lastMessageIndex),
-                                    updatedLastMessage
-                                ];
-                            } 
-                        });
-                        break;
-                    case 'setComplete':
-                        setTypingIndicator(false);
-                        setStartStreaming(false)
-                        setGhostCard(false)
-                        break;
-                }
-            };
+                                return acc;
+                              },
+                              {},
+                            )
+                          : {},
+                      }
+                    : {},
+                  product_details: prod.product_details
+                    ? {
+                        brand: prod.product_details.brand || '',
+                        flow: prod.product_details.flow || '',
+                        heritage_link: prod.product_details.heritage_link || '',
+                        image_url: prod.product_details.image_url || '',
+                        is_pump: prod.product_details.is_pump || '',
+                        manufacturer_id:
+                          prod.product_details.manufacturer_id || '',
+                        mfg_number: prod.product_details.mfg_number || '',
+                        part_number: prod.product_details.part_number || '',
+                        product_description:
+                          prod.product_details.product_description || '',
+                        product_name: prod.product_details.product_name || '',
+                        type: prod.product_details.type || '',
+                        vertical: prod.product_details.vertical || '',
+                        sku: prod.product_details.sku || '',
+                      }
+                    : {},
+                }));
 
-            ws.onerror = (error) => {
-                setStartStreaming(false)
-                setGhostMessage(false);
-                setTypingIndicator(false)
-                setGhostCard(false)
-            };
+                const updatedLastMessage = {
+                  ...prevMessages[lastMessageIndex],
+                  products: expandedProducts,
+                  product_cards: 'True',
+                };
 
-            ws.onclose = (event) => {
-                console.log("WebSocket connection closed:", event.reason);
-                setStartStreaming(false)
-                setGhostMessage(false);
-                setTypingIndicator(false)
-                setGhostCard(false)
-            };
+                return [
+                  ...prevMessages.slice(0, lastMessageIndex),
+                  updatedLastMessage,
+                ];
+              }
 
-            return () => {
-                ws.close();
-            };
-        };
-    }, [startStreaming]); 
+              return prevMessages;
+            });
 
-    useEffect(() => {
-        if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
-            wsRef.current.close();
-            setStartStreaming(false); 
-            setGhostMessage(false)
-            setGhostCard(false)
-            setTypingIndicator(false)
-            setStopActivated(false)
+            setGhostMessage(false);
+            setTypingIndicator(false);
+            setGhostCard(false);
+            break;
+          case 'product_document':
+            setMessages(prevMessages => {
+              const lastMessageIndex = prevMessages.length - 1;
+              if (
+                prevMessages[lastMessageIndex] &&
+                prevMessages[lastMessageIndex].type === 'ai'
+              ) {
+                const updatedLastMessage = {
+                  ...prevMessages[lastMessageIndex],
+                  resource: response?.resource_details?.[0]?.link ?? '',
+                  resource_type: response?.resource_details?.[0]?.type ?? '',
+                };
+                return [
+                  ...prevMessages.slice(0, lastMessageIndex),
+                  updatedLastMessage,
+                ];
+              }
+            });
+            setGhostMessage(false);
+            setTypingIndicator(false);
+            setGhostCard(false);
+            break;
+          case 'suggested_questions':
+            setMessages(prevMessages => {
+              const lastMessageIndex = prevMessages.length - 1;
+              if (
+                prevMessages[lastMessageIndex] &&
+                prevMessages[lastMessageIndex].type === 'ai'
+              ) {
+                const updatedLastMessage = {
+                  ...prevMessages[lastMessageIndex],
+                  suggested_questions: true,
+                  questions: response.suggested_questions,
+                };
+                return [
+                  ...prevMessages.slice(0, lastMessageIndex),
+                  updatedLastMessage,
+                ];
+              }
+            });
+            break;
+          case 'setComplete':
+            setTypingIndicator(false);
+            setStartStreaming(false);
+            setGhostCard(false);
+            break;
         }
-    }, [stopActivated, setStartStreaming]);
+      };
 
+      ws.onerror = error => {
+        setStartStreaming(false);
+        setGhostMessage(false);
+        setTypingIndicator(false);
+        setGhostCard(false);
+      };
+
+      ws.onclose = event => {
+        console.log('WebSocket connection closed:', event.reason);
+        setStartStreaming(false);
+        setGhostMessage(false);
+        setTypingIndicator(false);
+        setGhostCard(false);
+      };
+
+      return () => {
+        ws.close();
+      };
+    }
+  }, [startStreaming]);
+
+  useEffect(() => {
+    if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
+      wsRef.current.close();
+      setStartStreaming(false);
+      setGhostMessage(false);
+      setGhostCard(false);
+      setTypingIndicator(false);
+      setStopActivated(false);
+    }
+  }, [stopActivated, setStartStreaming]);
 }
+
+// import React, { useState, useEffect, useRef, useContext } from 'react';
+// import { AppContext } from '../contexts/AppContext';
+//
+// export function useWebSocketMessage() {
+//   const {
+//     setIsComplete,
+//     startStreaming,
+//     setMessages,
+//     messages,
+//     setGhostMessage,
+//     data,
+//     setTypingIndicator,
+//     setStartStreaming,
+//     lastUserMessage,
+//     stopActivated,
+//     sessionId,
+//     setGhostCard,
+//     BASE_URL,
+//     setStopActivated,
+//     setLastMessageId,
+//     conversationStartTime,
+//   } = useContext(AppContext);
+//
+//   const wsProtocol = 'wss://';
+//   const wsUrl = BASE_URL.replace(/^http(s)?:\/\//, '');
+//   const ENDPOINT = '/send/event';
+//
+//   const payload = {
+//     customer_code: data.customer_code,
+//     branch_code: data.branch_code,
+//     branch_full_name: data.branch_full_name,
+//     customer_token: data.customer_token,
+//     active_ship_to_information: {
+//       shipToId: data.active_ship_to,
+//     },
+//     branch_details: data.branch_details,
+//     user_query: lastUserMessage,
+//     session_id: data.session_id || data.session || sessionId,
+//     conversation_start_time: conversationStartTime,
+//     user_UUID: data.user_id || 'mobile_user_unspecified',
+//     device: 'mobile',
+//     window_location: 'mobile',
+//   };
+//
+//   const wsRef = useRef(null);
+//
+//   useEffect(() => {
+//     if (startStreaming) {
+//       console.log(payload, BASE_URL);
+//       const socketUrl = `${wsProtocol}${wsUrl}${ENDPOINT}`;
+//       console.log(socketUrl);
+//
+//       const ws = new WebSocket(socketUrl);
+//       wsRef.current = ws;
+//
+//       ws.onopen = () => {
+//         console.log('WebSocket connection established.');
+//         ws.send(JSON.stringify(payload));
+//       };
+//
+//       ws.onmessage = event => {
+//         const response = JSON.parse(event.data);
+//
+//         if (response.type !== 'chunk') {
+//           console.log(JSON.stringify(response, null, 2));
+//         }
+//         switch (response.type) {
+//           case 'middle_message':
+//             const middleMessage = {
+//               type: 'middle',
+//               text: response.message,
+//               products: [],
+//               product_cards: 'False',
+//             };
+//             setMessages(prevMessages => [...prevMessages, middleMessage]);
+//             break;
+//           case 'message':
+//             if (
+//               response.product_cards == 'False' ||
+//               response.product_cards == false
+//             ) {
+//               setGhostMessage(false);
+//               setTypingIndicator(false);
+//             } else {
+//               setGhostMessage(false);
+//               setGhostCard(true);
+//             }
+//             const newMessage = {
+//               type: 'ai',
+//               message_id: response.message_id || '',
+//               text: response.message,
+//               feedback: 'True',
+//               products: [],
+//               product_cards: response.product_cards || 'False',
+//               resource: response?.resource_details?.[0]?.link ?? '',
+//               resource_type: response?.resource_details?.[0]?.type ?? '',
+//             };
+//             setMessages(prevMessages => [...prevMessages, newMessage]);
+//             setLastMessageId(response.message_id);
+//             break;
+//           case 'chunk':
+//             const newContent = response.chunk;
+//             const newMessageId = response.message_id;
+//
+//             setMessages(prevMessages => {
+//               if (
+//                 prevMessages.length > 0 &&
+//                 prevMessages[prevMessages.length - 1].type === 'ai'
+//               ) {
+//                 return prevMessages.map((message, index) =>
+//                   index === prevMessages.length - 1
+//                     ? {
+//                         ...message,
+//                         text: message.text + newContent,
+//                         message_id: newMessageId || message.message_id,
+//                         feedback: 'True',
+//                       }
+//                     : message,
+//                 );
+//               } else {
+//                 return [
+//                   ...prevMessages,
+//                   {
+//                     type: 'ai',
+//                     text: newContent,
+//                     message_id: newMessageId,
+//                     feedback: 'True',
+//                   },
+//                 ];
+//               }
+//             });
+//             setGhostMessage(false);
+//             if (newMessageId) {
+//               setLastMessageId(newMessageId);
+//             }
+//             break;
+//           case 'product_cards':
+//             console.log('🛒 PRODUCT_CARDS RECEIVED:', response);
+//             setMessages(prevMessages => {
+//               console.log(
+//                 '📦 Current messages array length:',
+//                 prevMessages.length,
+//               );
+//               const lastMessageIndex = prevMessages.length - 1;
+//
+//               if (lastMessageIndex < 0) {
+//                 console.warn('⚠️ No messages exist yet!');
+//                 return prevMessages;
+//               }
+//
+//               const lastMessage = prevMessages[lastMessageIndex];
+//               console.log('📝 Last message:', {
+//                 type: lastMessage?.type,
+//                 message_id: lastMessage?.message_id,
+//                 has_products: !!lastMessage?.products,
+//                 text_preview: lastMessage?.text?.substring(0, 50),
+//               });
+//
+//               if (lastMessage && lastMessage.type === 'ai') {
+//                 const expandedProducts = response.products.map(prod => ({
+//                   part_number: prod.part_number || '',
+//                   inventory_info: prod.inventory_info
+//                     ? {
+//                         default_uom: prod.inventory_info.default_uom || '',
+//                         is_valid: prod.inventory_info.is_valid || false,
+//                         info_by_uom: prod.inventory_info.info_by_uom
+//                           ? Object.keys(prod.inventory_info.info_by_uom).reduce(
+//                               (acc, key) => {
+//                                 const value =
+//                                   prod.inventory_info.info_by_uom[key] || {};
+//                                 acc[key] = {
+//                                   gross_price: value.gross_price ?? 0,
+//                                   net_price: value.net_price ?? 0,
+//                                   is_on_sale: value.is_on_sale ?? false,
+//                                   quantity_available:
+//                                     value.quantity_available ?? 0,
+//                                   discounts: value.discounts ?? null,
+//                                   min_pack_qty: value.min_pack_qty ?? 0,
+//                                 };
+//                                 return acc;
+//                               },
+//                               {},
+//                             )
+//                           : {},
+//                       }
+//                     : {},
+//                   product_details: prod.product_details
+//                     ? {
+//                         brand: prod.product_details.brand || '',
+//                         flow: prod.product_details.flow || '',
+//                         heritage_link: prod.product_details.heritage_link || '',
+//                         image_url: prod.product_details.image_url || '',
+//                         is_pump: prod.product_details.is_pump || '',
+//                         manufacturer_id:
+//                           prod.product_details.manufacturer_id || '',
+//                         mfg_number: prod.product_details.mfg_number || '',
+//                         part_number: prod.product_details.part_number || '',
+//                         product_description:
+//                           prod.product_details.product_description || '',
+//                         product_name: prod.product_details.product_name || '',
+//                         type: prod.product_details.type || '',
+//                         vertical: prod.product_details.vertical || '',
+//                         sku: prod.product_details.sku || '',
+//                       }
+//                     : {},
+//                 }));
+//
+//                 console.log(
+//                   '✅ Merging',
+//                   expandedProducts.length,
+//                   'products into last message',
+//                 );
+//
+//                 const updatedLastMessage = {
+//                   ...lastMessage,
+//                   products: expandedProducts,
+//                   product_cards: 'True',
+//                 };
+//
+//                 const newMessages = [
+//                   ...prevMessages.slice(0, lastMessageIndex),
+//                   updatedLastMessage,
+//                 ];
+//
+//                 console.log(
+//                   '🎯 Updated message now has products:',
+//                   updatedLastMessage.products.length,
+//                 );
+//                 return newMessages;
+//               }
+//
+//               console.warn("⚠️ Last message is not AI type or doesn't exist");
+//               return prevMessages;
+//             });
+//
+//             setGhostMessage(false);
+//             setTypingIndicator(false);
+//             setGhostCard(false);
+//             break;
+//           case 'product_document':
+//             setMessages(prevMessages => {
+//               const lastMessageIndex = prevMessages.length - 1;
+//               if (
+//                 prevMessages[lastMessageIndex] &&
+//                 prevMessages[lastMessageIndex].type === 'ai'
+//               ) {
+//                 const updatedLastMessage = {
+//                   ...prevMessages[lastMessageIndex],
+//                   resource: response?.resource_details?.[0]?.link ?? '',
+//                   resource_type: response?.resource_details?.[0]?.type ?? '',
+//                 };
+//                 return [
+//                   ...prevMessages.slice(0, lastMessageIndex),
+//                   updatedLastMessage,
+//                 ];
+//               }
+//               // FIX: Always return prevMessages if condition not met
+//               return prevMessages;
+//             });
+//             setGhostMessage(false);
+//             setTypingIndicator(false);
+//             setGhostCard(false);
+//             break;
+//           case 'suggested_questions':
+//             setMessages(prevMessages => {
+//               const lastMessageIndex = prevMessages.length - 1;
+//               if (
+//                 prevMessages[lastMessageIndex] &&
+//                 prevMessages[lastMessageIndex].type === 'ai'
+//               ) {
+//                 const updatedLastMessage = {
+//                   ...prevMessages[lastMessageIndex],
+//                   suggested_questions: true,
+//                   questions: response.suggested_questions,
+//                 };
+//                 return [
+//                   ...prevMessages.slice(0, lastMessageIndex),
+//                   updatedLastMessage,
+//                 ];
+//               }
+//               // FIX: Always return prevMessages if condition not met
+//               return prevMessages;
+//             });
+//             break;
+//           case 'setComplete':
+//             setTypingIndicator(false);
+//             setStartStreaming(false);
+//             setGhostCard(false);
+//             break;
+//         }
+//       };
+//
+//       ws.onerror = error => {
+//         setStartStreaming(false);
+//         setGhostMessage(false);
+//         setTypingIndicator(false);
+//         setGhostCard(false);
+//       };
+//
+//       ws.onclose = event => {
+//         console.log('WebSocket connection closed:', event.reason);
+//         setStartStreaming(false);
+//         setGhostMessage(false);
+//         setTypingIndicator(false);
+//         setGhostCard(false);
+//       };
+//
+//       return () => {
+//         ws.close();
+//       };
+//     }
+//   }, [startStreaming]);
+//
+//   useEffect(() => {
+//     if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
+//       wsRef.current.close();
+//       setStartStreaming(false);
+//       setGhostMessage(false);
+//       setGhostCard(false);
+//       setTypingIndicator(false);
+//       setStopActivated(false);
+//     }
+//   }, [stopActivated, setStartStreaming]);
+// }