@envive-ai/react-hooks 0.2.10 → 0.3.0

package/src/contexts/chatContext/chatContext.tsx

@@ -1,27 +1,20 @@
-import { UserEventCategory } from "@spiffy-ai/commerce-api-client";
-import { useAtom, useAtomValue, useSetAtom } from "jotai";
-import {
-  createContext,
-  useEffect,
-  useState,
-  ReactNode,
-  useCallback,
-  useMemo,
-} from "react";
-import CommerceApiClient from "src/application/commerce-api";
-import { v4 as uuid } from "uuid";
-import { SessionRestartRequired } from "src/types/exceptions/sessionExceptions";
-import Logger from "src/application/logging/logger";
+import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
+import { useAtom, useAtomValue, useSetAtom } from 'jotai';
+import { createContext, useEffect, useState, ReactNode, useCallback, useMemo } from 'react';
+import CommerceApiClient from 'src/application/commerce-api';
+import { v4 as uuid } from 'uuid';
+import { SessionRestartRequired } from 'src/types/exceptions/sessionExceptions';
+import Logger from 'src/application/logging/logger';
 import {
   Message,
   MessageRole,
   MessageType,
   NextMessageRequest,
   Response,
-} from "src/application/models";
-import { SpiffyMetricsEventName } from "src/contexts/amplitudeContext/amplitudeContext";
-import { messageFromResponse } from "src/application/utils";
-import { chatIdAtom, userIdAtom, variantInfoAtom } from "src/atoms/app";
+} from 'src/application/models';
+import { SpiffyMetricsEventName } from 'src/contexts/amplitudeContext/amplitudeContext';
+import { messageFromResponse } from 'src/application/utils';
+import { chatIdAtom, userIdAtom, variantInfoAtom } from 'src/atoms/app';
 import {
   messagesAtom,
   requestFailureAtom,
@@ -32,28 +25,28 @@ import {
   userEventsAtom,
   suggestionsLoadingAtom,
   suggestionsAtom,
-} from "src/atoms/chat";
+} from 'src/atoms/chat';
 import {
   chatSearchProductSortingAtom,
   chatSearchProducts,
   chatSearchStateAtom,
   handleSearchResultsAtom,
   chatSearchIsLoadingAtom,
-} from "src/atoms/search/chatSearch";
-import { createAppLoadedEvent, createVisitUserEvent } from "src/hooks/utils";
-import { useMessageInterceptor } from "src/interceptors/useMessageInterceptor";
-import { supportedEventAtom } from "src/atoms/app/variant";
-import { chatAtom } from "src/atoms/chat";
-import { getAtomStore } from "src/atoms/atomStore";
+} from 'src/atoms/search/chatSearch';
+import { createAppLoadedEvent, createVisitUserEvent } from 'src/hooks/utils';
+import { useMessageInterceptor } from 'src/interceptors/useMessageInterceptor';
+import { supportedEventAtom } from 'src/atoms/app/variant';
+import { chatAtom } from 'src/atoms/chat';
+import { getAtomStore } from 'src/atoms/atomStore';
 import {
   clearUserEventAtom,
   createResponsePayload,
   processUserEventAtom,
   userEventQueueAtom,
   userQueueEventCountAtom,
-} from "src/atoms/chat/messageQueue";
-import { useAmplitudeTracking } from "src/hooks/AmplitudeOperations/useAmplitudeOperations";
-import { useSystemSettingsContext } from "src/hooks/SystemSettingsContext";
+} from 'src/atoms/chat/messageQueue';
+import { useAmplitudeTracking } from 'src/hooks/AmplitudeOperations/useAmplitudeOperations';
+import { useSystemSettingsContext } from 'src/hooks/SystemSettingsContext';
 
 /**
  * Record the chat assistant response in Amplitude
@@ -64,10 +57,7 @@ import { useSystemSettingsContext } from "src/hooks/SystemSettingsContext";
 const recordAssistantResponse = (
   startTimeMs: number,
   payload: NextMessageRequest,
-  track: (
-    eventName: SpiffyMetricsEventName,
-    eventProps?: Record<string, unknown>
-  ) => void
+  track: (eventName: SpiffyMetricsEventName, eventProps?: Record<string, unknown>) => void,
 ) => {
   const atomStore = getAtomStore();
   const chatState = atomStore.get(chatAtom);
@@ -87,31 +77,26 @@ const recordAssistantResponse = (
   }
 
   const eventProps: Record<string, unknown> = {
-    response_time_ms:
-      assistantResponseTimeMs.end - assistantResponseTimeMs.start,
+    response_time_ms: assistantResponseTimeMs.end - assistantResponseTimeMs.start,
     user_event_type: chatState.replyEventCategory,
     user_query: userQueryProperty,
   };
 
   if (chatState.replyEventCategory === UserEventCategory.FormSubmitted) {
     const lastAssistantTurn = chatState.messages
-      .filter(
-        (turn) => turn.length > 0 && turn[0].role === MessageRole.Assistant
-      )
+      .filter(turn => turn.length > 0 && turn[0].role === MessageRole.Assistant)
       .pop();
     const formType = payload.userEvents?.find(
-      (event) => event.category === UserEventCategory.FormSubmitted
+      event => event.category === UserEventCategory.FormSubmitted,
     )?.attributes.formType;
-    const formStatus = lastAssistantTurn?.some(
-      (response) => response.type === MessageType.Order
-    );
+    const formStatus = lastAssistantTurn?.some(response => response.type === MessageType.Order);
     eventProps.form_submitted_attributes = {
       form_type: formType,
-      status: formStatus ? "success" : "failed",
+      status: formStatus ? 'success' : 'failed',
     };
   }
 
-  if (chatSearchState === "product-page") {
+  if (chatSearchState === 'product-page') {
     eventProps.search_products_returned = searchProducts.length;
     eventProps.search_products_sort_type = searchProductsSort;
   }
@@ -128,16 +113,13 @@ const ChatContext = createContext<ChatContextParams | undefined>(undefined);
 const updateMessageState = (
   message: Message,
   lastMessage: Message,
-  setMessages: (updater: (prev: Message[][]) => Message[][]) => void
+  setMessages: (updater: (prev: Message[][]) => Message[][]) => void,
 ): Message => {
   if (lastMessage == null) {
-    setMessages((prev) => [...prev, [message]]);
+    setMessages(prev => [...prev, [message]]);
     return message;
   }
-  if (
-    lastMessage.type === MessageType.Text &&
-    message.type === MessageType.Text
-  ) {
+  if (lastMessage.type === MessageType.Text && message.type === MessageType.Text) {
     const newMessage = {
       ...lastMessage,
       metadata: {
@@ -145,7 +127,7 @@ const updateMessageState = (
         content: lastMessage.metadata.content + message.metadata.content,
       },
     };
-    setMessages((prev) => {
+    setMessages(prev => {
       const lastTurn = prev[prev.length - 1];
       return [
         ...prev.slice(0, prev.length - 1),
@@ -154,20 +136,17 @@ const updateMessageState = (
     });
     return newMessage;
   }
-  setMessages((prev) => [
-    ...prev.slice(0, prev.length - 1),
-    [...prev[prev.length - 1], message],
-  ]);
+  setMessages(prev => [...prev.slice(0, prev.length - 1), [...prev[prev.length - 1], message]]);
   return message;
 };
 
 const handleStreamingError = (
   _error: unknown,
   setRequestFailure: (failed: boolean) => void,
-  setMessages: (updater: (prev: Message[][]) => Message[][]) => void
+  setMessages: (updater: (prev: Message[][]) => Message[][]) => void,
 ) => {
   setRequestFailure(true);
-  setMessages((prev) => [
+  setMessages(prev => [
     ...prev,
     [
       {
@@ -192,7 +171,7 @@ const processStreamingResponse = async (
   handleSearchResults: (message: Message) => void,
   setMessages: (updater: (prev: Message[][]) => Message[][]) => void,
   setSearchIsLoading: (loading: boolean) => void,
-  chatId: string
+  chatId: string,
 ): Promise<{ hasSearchResults: boolean }> => {
   let lastMessage: Message | undefined;
   let hasSearchResults = false;
@@ -205,7 +184,7 @@ const processStreamingResponse = async (
 
       const message = messageFromResponse(response);
       if (!message) {
-        throw new Error("Failed to transform API response to client message");
+        throw new Error('Failed to transform API response to client message');
       }
 
       if (message.type === MessageType.ProductSearch) {
@@ -222,7 +201,7 @@ const processStreamingResponse = async (
         {
           lastResponse: lastMessage,
           response,
-        }
+        },
       );
     }
   }
@@ -238,12 +217,8 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
   const [messages, setMessages] = useAtom<Message[][]>(messagesAtom);
   const setUserEvents = useSetAtom(userEventsAtom);
   const setSuggestions = useSetAtom(suggestionsAtom);
-  const [suggestionsLoading, setSuggestionsLoading] = useAtom<boolean>(
-    suggestionsLoadingAtom
-  );
-  const [responseStreaming, setResponseStreaming] = useAtom<boolean>(
-    responseStreamingAtom
-  );
+  const [suggestionsLoading, setSuggestionsLoading] = useAtom<boolean>(suggestionsLoadingAtom);
+  const [responseStreaming, setResponseStreaming] = useAtom<boolean>(responseStreamingAtom);
   const setRequestFailure = useSetAtom(requestFailureAtom);
   const userEvents = useAtomValue(userEventQueueAtom);
   const userQueueEventCount = useAtomValue(userQueueEventCountAtom);
@@ -253,7 +228,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
   const chatId = useAtomValue(chatIdAtom);
   const supportedEvent = useAtomValue(supportedEventAtom);
   // TODO: Replace with actual orgId from useEnviveConfig or NewOrgConfigContext when available
-  const orgId = "mock-org-id";
+  const orgId = 'mock-org-id';
 
   const variantInfo = useAtomValue(variantInfoAtom);
   const settingsContext = useSystemSettingsContext();
@@ -263,9 +238,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
   const { track } = useAmplitudeTracking();
 
   const getStreamingResponses = useCallback(
-    async (
-      payload: NextMessageRequest
-    ): Promise<{ hasSearchResults: boolean }> => {
+    async (payload: NextMessageRequest): Promise<{ hasSearchResults: boolean }> => {
       logPerfMetric(PerfMetricsEvents.FirstResponseStarted);
       const stream = CommerceApiClient.getNextResponseStreaming(payload);
 
@@ -278,7 +251,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
           handleSearchResults,
           setMessages,
           setSearchIsLoading,
-          chatId
+          chatId,
         );
 
         return { hasSearchResults };
@@ -297,7 +270,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
       setMessages,
       setSearchIsLoading,
       chatId,
-    ]
+    ],
   );
 
   const getSuggestions = useCallback(async () => {
@@ -309,22 +282,13 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
       userEvents: [],
       generationParams: settingsContext.generationParams,
     });
-    const response = await CommerceApiClient.getNextSuggestions(
-      payloadWithoutAppLoaded
-    );
+    const response = await CommerceApiClient.getNextSuggestions(payloadWithoutAppLoaded);
 
     // sort the suggestions by shortest length so the pills can be stacked horizontally
-    setSuggestions(
-      response.sort((a, b) => a.content.length - b.content.length)
-    );
+    setSuggestions(response.sort((a, b) => a.content.length - b.content.length));
     setSuggestionsLoading(false);
     logPerfMetric(PerfMetricsEvents.FirstSuggestionsCompleted);
-  }, [
-    logPerfMetric,
-    setSuggestionsLoading,
-    setSuggestions,
-    settingsContext.generationParams,
-  ]);
+  }, [logPerfMetric, setSuggestionsLoading, setSuggestions, settingsContext.generationParams]);
 
   const getResponses = useCallback(
     async (payload?: NextMessageRequest) => {
@@ -345,7 +309,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
         recordAssistantResponse(startTimeMs, requestPayload, track);
         await getSuggestions();
       } catch (error) {
-        Logger.logError("[spiffy-ai] getResponses error", error);
+        Logger.logError('[spiffy-ai] getResponses error', error);
       } finally {
         // Remove search loading management from here - it's now handled independently
         // in the processStreamingResponse function when search results are detected
@@ -364,7 +328,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
       getSuggestions,
       setUserHasReplied,
       track,
-    ]
+    ],
   );
 
   useEffect(() => {
@@ -374,28 +338,25 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
       }
 
       if (
-        (variantInfo.variant === "pdp" && !variantInfo.productId) ||
-        (variantInfo.variant === "plp" && !variantInfo.plpId) ||
-        (variantInfo.variant === "page_visit" && !variantInfo.url)
+        (variantInfo.variant === 'pdp' && !variantInfo.productId) ||
+        (variantInfo.variant === 'plp' && !variantInfo.plpId) ||
+        (variantInfo.variant === 'page_visit' && !variantInfo.url)
       ) {
-        Logger.logDebug(
-          "[spiffy-ai] variantInfo has invalid values, skipping...",
-          {
-            variantInfo,
-            supportedEvent,
-          }
-        );
+        Logger.logDebug('[spiffy-ai] variantInfo has invalid values, skipping...', {
+          variantInfo,
+          supportedEvent,
+        });
         return;
       }
 
       Logger.logDebug(
-        `Assistants Turn is_currently_streaming=${responseStreaming} initialized=${widgetInitialized}`
+        `Assistants Turn is_currently_streaming=${responseStreaming} initialized=${widgetInitialized}`,
       );
       try {
         await getResponses();
         Logger.logInfo(`Assistants Turn [finished]`);
       } catch (error: unknown) {
-        Logger.logError("[spiffy-ai] Assistants Turn error", error);
+        Logger.logError('[spiffy-ai] Assistants Turn error', error);
       }
     };
     if (userQueueEventCount > 0) {
@@ -413,7 +374,7 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
   useEffect(() => {
     if (widgetInitialized || responseStreaming) {
       Logger.logDebug(
-        `[spiffy-ai] initializeWidget [skipped] is_currently_streaming=${responseStreaming} is_initialized=${widgetInitialized}`
+        `[spiffy-ai] initializeWidget [skipped] is_currently_streaming=${responseStreaming} is_initialized=${widgetInitialized}`,
       );
       return;
     }
@@ -421,23 +382,23 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
     const hydrateChat = async () => {
       try {
         Logger.logDebug(
-          `[spiffy-ai] initializeWidget is_currently_streaming=${responseStreaming} is_initialized=${widgetInitialized}`
+          `[spiffy-ai] initializeWidget is_currently_streaming=${responseStreaming} is_initialized=${widgetInitialized}`,
         );
         // on mount, try to get the responses from an active session if one exists
         if (!orgId) {
-          throw new Error("orgId is not available");
+          throw new Error('orgId is not available');
         }
-        const { messages: existingMessages, userEvents } =
-          await CommerceApiClient.getResponses(orgId, chatId, userId);
+        const { messages: existingMessages, userEvents } = await CommerceApiClient.getResponses(
+          orgId,
+          chatId,
+          userId,
+        );
         setMessages([...existingMessages]);
         setUserEvents([...userEvents]);
         getResponses();
       } catch (error) {
         // no active chat session was found, start a new one
-        Logger.logInfo(
-          `Init chat [exception] chat_id=${chatId} error=${error}`,
-          error
-        );
+        Logger.logInfo(`Init chat [exception] chat_id=${chatId} error=${error}`, error);
         if (error instanceof SessionRestartRequired) {
           const appLoadedEvent = createAppLoadedEvent();
           const visitEvent = createVisitUserEvent({ variantInfo });
@@ -462,8 +423,11 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
   const onFocus = useCallback(async () => {
     try {
       if (!responseStreaming && !suggestionsLoading && orgId) {
-        const { messages: existingMessages } =
-          await CommerceApiClient.getResponses(orgId, chatId, userId);
+        const { messages: existingMessages } = await CommerceApiClient.getResponses(
+          orgId,
+          chatId,
+          userId,
+        );
 
         if (existingMessages.length > messages.length) {
           setMessages([...existingMessages]);
@@ -477,32 +441,22 @@ const ChatContextProvider = ({ children }: { children: ReactNode }) => {
         }
       }
     } catch (error: unknown) {
-      Logger.logError("[spiffy-ai] onFocus error", error);
+      Logger.logError('[spiffy-ai] onFocus error', error);
     }
-  }, [
-    responseStreaming,
-    suggestionsLoading,
-    orgId,
-    chatId,
-    userId,
-    messages.length,
-    setMessages,
-  ]);
+  }, [responseStreaming, suggestionsLoading, orgId, chatId, userId, messages.length, setMessages]);
 
   // listen for page focus to get latest messages from the server
   useEffect(() => {
-    window.addEventListener("focus", onFocus);
+    window.addEventListener('focus', onFocus);
 
     return () => {
-      window.removeEventListener("focus", onFocus);
+      window.removeEventListener('focus', onFocus);
     };
   }, [onFocus]);
 
   const chatContext = useMemo(() => ({}), []);
 
-  return (
-    <ChatContext.Provider value={chatContext}>{children}</ChatContext.Provider>
-  );
+  return <ChatContext.Provider value={chatContext}>{children}</ChatContext.Provider>;
 };
 
 export { ChatContext, ChatContextProvider };

package/src/contexts/chatContext/index.ts

@@ -1 +1 @@
-export * from "./chatContext";
+export * from './chatContext';