@envive-ai/react-hooks 0.3.15-beta.0 → 0.3.15

package/src/application/utils/productRetrievalResponseToProductRetrievalResult.ts

@@ -0,0 +1,21 @@
+import type { ProductRetrievalResponse } from '@spiffy-ai/commerce-api-client';
+import { transformSnakeToCamel } from 'src/application/models/utils/snakeToCamelTransformer';
+import type { SearchResponseProductAttributes } from 'src/application/models/api/response';
+import type { ProductRetrievalResult } from 'src/atoms/search/types';
+
+/**
+ * Maps the API response from /v1/products/retrieve to the core ProductRetrievalResult.
+ * Converts product attributes from snake_case to camelCase to match SearchResponseProductAttributes.
+ */
+export function productRetrievalResponseToProductRetrievalResult(
+  apiResponse: ProductRetrievalResponse,
+): ProductRetrievalResult {
+  const products = (apiResponse.products ?? []).map(product =>
+    transformSnakeToCamel(product),
+  ) as SearchResponseProductAttributes['attributes'][];
+
+  return {
+    products,
+    totalProductCount: products.length,
+  };
+}

package/src/contexts/salesAgentContext/chatAPI.ts

@@ -48,7 +48,7 @@ export interface SalesAgentChatAPI {
   onFormResponseSubmitted: (form: FormSubmittedAttributes) => void;
 }
 
-export const useSalesAgentChatAPI = () => {
+export const useSalesAgentChatAPI = (widget?: WidgetInteractionComponent) => {
   // TODO: Each of these functions will trigger both the necessary amplitude events and initiate the
   // necessary actions to trigger the backend API
   const context = useAtomValue(analyticsContextAtom);
@@ -58,6 +58,7 @@ export const useSalesAgentChatAPI = () => {
   const setFormSubmit = useSetAtom(formSubmitAtom);
   const { trackEvent } = useAmplitude();
   const { trackWidgetInteraction } = useWidgetInteraction();
+  const contextWidget = widget || WidgetInteractionComponent.FLOATING_CHAT;
 
   const logPageVisit = useCallback(
     ({ pageVisitCategory }: { pageVisitCategory: PageVisitCategory }) => {
@@ -113,7 +114,7 @@ export const useSalesAgentChatAPI = () => {
       trackWidgetInteraction({
         eventName: EnviveMetricsEventName.WidgetInteraction,
         trigger: {
-          widget: WidgetInteractionComponent.FLOATING_CHAT,
+          widget: contextWidget,
           widget_interaction: WidgetInteractionType.SUGGESTION_CLICKED,
           widget_interaction_data: {
             suggestion_clicked: {
@@ -182,7 +183,7 @@ export const useSalesAgentChatAPI = () => {
       trackWidgetInteraction({
         eventName: EnviveMetricsEventName.WidgetInteraction,
         trigger: {
-          widget: WidgetInteractionComponent.FLOATING_CHAT,
+          widget: contextWidget,
           widget_interaction: WidgetInteractionType.MESSAGE_SUBMITTED,
           widget_interaction_data: {
             message_submitted: {

package/src/contexts/salesAgentContext/salesAgentContext.tsx

@@ -1,9 +1,9 @@
+import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
 import { useAtom, useAtomValue, useSetAtom } from 'jotai';
 import { ReactNode, createContext, useCallback, useEffect, useMemo, useRef } from 'react';
-import { UserEventCategory } from '@spiffy-ai/commerce-api-client';
 import Logger from 'src/application/logging/logger';
-import { Message, MessageRole, MessageType } from 'src/application/models/message';
 import { NextMessageRequest, Suggestion, UserEvent } from 'src/application/models';
+import { Message, MessageRole, MessageType } from 'src/application/models/message';
 import {
   initializedAtom,
   messagesAtom,
@@ -16,12 +16,13 @@ import {
   userEventQueueAtom,
   userQueueEventCountAtom,
 } from 'src/atoms/chat/messageQueue';
-import { useSystemSettingsContext } from 'src/hooks/SystemSettingsContext';
+import { useSystemSettingsContext } from '../../hooks/SystemSettingsContext';
+import { WidgetInteractionComponent } from '../../hooks/WidgetInteraction/types';
+import { SalesAgentChatAPI, useSalesAgentChatAPI } from './chatAPI';
 import {
   buildFormSubmittedDisplayContent,
   createFormSubmittedUserMessage,
 } from './formSubmittedUtils';
-import { SalesAgentChatAPI, useSalesAgentChatAPI } from './chatAPI';
 import { useSalesAgentService } from './salesAgentService';
 
 export interface SalesAgent extends SalesAgentChatAPI {
@@ -203,7 +204,7 @@ export const SalesAgentProvider: React.FC<SalesAgentProviderProps> = ({
   return <SalesAgentContext.Provider value={undefined}>{children}</SalesAgentContext.Provider>;
 };
 
-export const useSalesAgent = (): SalesAgent => {
+export const useSalesAgent = (contextWidget?: WidgetInteractionComponent): SalesAgent => {
   const messages = useAtomValue(messagesAtom);
   const suggestions = useAtomValue(suggestionsAtom);
   const pendingMessages = useAtomValue(userEventQueueAtom);
@@ -216,7 +217,7 @@ export const useSalesAgent = (): SalesAgent => {
     onSuggestionClicked,
     onTypedMessageSubmitted,
     onFormResponseSubmitted,
-  } = useSalesAgentChatAPI();
+  } = useSalesAgentChatAPI(contextWidget);
 
   const salesAgent: SalesAgent = useMemo(() => {
     return {

package/src/hooks/ProductImageUrl/index.ts

@@ -0,0 +1 @@
+export * from './useProductImageUrl';

package/src/hooks/ProductImageUrl/useProductImageUrl.ts

@@ -0,0 +1,35 @@
+import { useEffect, useState } from 'react';
+import CommerceApiClient from 'src/application/commerce-api';
+
+/**
+ * Fetches the product image URL for the given product ID via CommerceApiClient.retrieveProducts.
+ * Returns undefined while loading, on error, or when productId is not provided.
+ */
+export const useProductImageUrl = (productId: string | undefined): string | undefined => {
+  const [imageUrl, setImageUrl] = useState<string | undefined>(undefined);
+
+  useEffect(() => {
+    if (!productId) {
+      setImageUrl(undefined);
+      return undefined;
+    }
+    let cancelled = false;
+    CommerceApiClient.retrieveProducts([productId]).then(
+      result => {
+        if (!cancelled && result.products?.length > 0) {
+          setImageUrl(result.products[0].imageUrl);
+        } else if (!cancelled) {
+          setImageUrl(undefined);
+        }
+      },
+      () => {
+        if (!cancelled) setImageUrl(undefined);
+      },
+    );
+    return () => {
+      cancelled = true;
+    };
+  }, [productId]);
+
+  return imageUrl;
+};

package/src/hooks/WidgetInteraction/types.ts

@@ -36,6 +36,7 @@ export enum WidgetInteractionComponent {
   EMBEDDED_WIDGET = 'embedded_widget',
   SUGGESTION_BAR = 'suggestion_bar',
   FLOATING_BUTTON = 'floating_button',
+  FULL_PAGE_SALES_AGENT = 'full_page_sales_agent',
   SOCIAL_PROOF = 'social_proof',
   CHAT_PREVIEW = 'chat_preview',
   FLOATING_CHAT = 'floating_chat',