@envive-ai/react-toolkit-v3 0.3.17 → 0.3.19

package/src/components/FloatingChat/utils/functions.ts

@@ -118,3 +118,44 @@ export const getCleanOrders = (messages: Message[]) => {
 
   return orders.filter(o => o !== null) as OrderLookupCardProps[];
 };
+
+export const MOST_RELEVANT_DISPLAY_LIMIT = 8;
+
+/**
+ * Extracts the search query from a message block (or previous blocks) that led to product results.
+ * Looks for QueryTyped (metadata.content) or SuggestionClicked (metadata.suggestionContent).
+ */
+export const getSearchQueryFromMessageBlock = (
+  messages: Message[][],
+  productBlockIndex: number,
+): string => {
+  for (let i = productBlockIndex; i >= 0; i -= 1) {
+    const block = messages[i];
+    const queryTyped = block.find(msg => msg.type === MessageType.QueryTyped);
+    if (queryTyped && 'content' in queryTyped.metadata) {
+      return (queryTyped.metadata as { content?: string }).content ?? '';
+    }
+    const suggestionClicked = block.find(msg => msg.type === MessageType.SuggestionClicked);
+    if (suggestionClicked && 'suggestionContent' in suggestionClicked.metadata) {
+      return (suggestionClicked.metadata as { suggestionContent?: string }).suggestionContent ?? '';
+    }
+  }
+  return '';
+};
+
+export const getProductCarouselDisplayInfo = <T>(
+  products: T[],
+  numberOfProducts?: number,
+  displayLimit = MOST_RELEVANT_DISPLAY_LIMIT,
+): {
+  totalProducts: number;
+  areProductsMoreThanDisplayLimit: boolean;
+  displayedProducts: T[];
+} => {
+  const totalProducts = numberOfProducts ?? products.length;
+  const areProductsMoreThanDisplayLimit = totalProducts > displayLimit;
+  const displayedProducts = areProductsMoreThanDisplayLimit
+    ? products.slice(0, displayLimit)
+    : products;
+  return { totalProducts, areProductsMoreThanDisplayLimit, displayedProducts };
+};

package/src/components/FullPageSalesAgent/FullPageSalesAgent.tsx

@@ -22,6 +22,7 @@ import { SparkleIconColor, WelcomeMessage } from '../WelcomeMessage';
 import { FullPageSAComponents } from './components';
 import { useGetFooterStyles } from './hooks/useGetFooterStyles';
 import { useGetMessagesStyles } from './hooks/useGetMessagesStyles';
+import { useGetScrollContentStyles } from './hooks/useGetScrollContentStyles';
 import { useIsMobile } from './hooks/useIsMobile';
 
 interface FullPageSalesAgentProps {
@@ -47,6 +48,7 @@ export const FullPageSalesAgent = ({
   const chatMessagesRef = useRef<HTMLDivElement>(null);
   const { footerStyles, footerClasses } = useGetFooterStyles();
   const { messageClasses } = useGetMessagesStyles();
+  const { messageContainerClasses } = useGetScrollContentStyles();
   const { isMobile } = useIsMobile();
   const { trackWidgetInteraction } = useWidgetInteraction();
   const { onDrag, onHover, onMouseDown, onMouseUp, onTouchStart, onTouchEnd } =
@@ -127,12 +129,14 @@ export const FullPageSalesAgent = ({
   };
 
   const welcomeMessage = (
-    <WelcomeMessage
-      sparkleIconColor={welcomeMessageIconColor as SparkleIconColor}
-      title={welcomeMessageTitle as string}
-      text={welcomeMessageText as string}
-      theme={resolvedTheme}
-    />
+    <div className={messageContainerClasses}>
+      <WelcomeMessage
+        sparkleIconColor={welcomeMessageIconColor as SparkleIconColor}
+        title={welcomeMessageTitle as string}
+        text={welcomeMessageText as string}
+        theme={resolvedTheme}
+      />
+    </div>
   );
 
   const footer = (

package/src/components/FullPageSalesAgent/components/Layout.tsx

@@ -33,7 +33,7 @@ export const Layout = ({
   const hasWelcomeMessage = isValidElement(welcomeMessage);
   const hasAnswerSuggestions = isValidElement(answerSuggestions);
   const { isMobile } = useIsMobile();
-  const { contentClasses, messageContainerClasses } = useGetScrollContentStyles();
+  const { contentClasses } = useGetScrollContentStyles();
   const { footerContainerClasses } = useGetFooterStyles();
   const { containerClasses, containerStyles } = useGetContainerStyles({
     headerContainer,
@@ -47,7 +47,6 @@ export const Layout = ({
     >
       <div className={contentClasses}>
         <Stack
-          className={messageContainerClasses}
           direction="column"
           justify="between"
         >

package/src/components/FullPageSalesAgent/hooks/useContainerResizerObserver.ts

@@ -11,6 +11,7 @@ export const useContainerResizerObserver = ({
 
   useEffect(() => {
     if (!autoHeight) {
+      setContainerHeight('100%');
       return () => {};
     }
 

package/src/logging/logger.ts

@@ -1,20 +1,45 @@
 /* eslint-disable no-console */
 
 class Logger {
-  static logInfo(message: string, ...args: unknown[]): void {
-    console.info(`INFO: ${message}`, ...args);
+  private readonly caller: string;
+
+  /* Creates a new Logger instance.
+   * @param caller - The caller of the logger.
+   */
+  constructor(caller: string) {
+    this.caller = caller;
+  }
+
+  static getTimestamp(): string {
+    return new Date().toISOString();
+  }
+
+  logInfo(message: string, ...args: unknown[]): void {
+    console.info(
+      `INFO: [envive-ai] ${Logger.getTimestamp()} - ${this.caller} - ${message}`,
+      ...args,
+    );
   }
 
-  static logDebug(message: string, ...args: unknown[]): void {
-    console.debug(`DEBUG: ${message}`, ...args);
+  logDebug(message: string, ...args: unknown[]): void {
+    console.debug(
+      `DEBUG: [envive-ai] ${Logger.getTimestamp()} - ${this.caller} - ${message}`,
+      ...args,
+    );
   }
 
-  static logError(message: string, error: unknown | undefined, ...args: unknown[]): void {
-    console.error(`ERROR: ${message} error=${error}`, args);
+  logError(message: string, error: unknown | undefined, ...args: unknown[]): void {
+    console.error(
+      `ERROR: [envive-ai] ${Logger.getTimestamp()} - ${this.caller} - ${message} error=${error}`,
+      args,
+    );
   }
 
-  static logWarn(message: string, error: unknown | undefined, ...args: unknown[]): void {
-    console.warn(`WARN: ${message} error=${error}`, args);
+  logWarn(message: string, error: unknown | undefined, ...args: unknown[]): void {
+    console.warn(
+      `WARN: [envive-ai] ${Logger.getTimestamp()} - ${this.caller} - ${message} error=${error}`,
+      args,
+    );
   }
 }