vdb-ai-chat 1.0.0 → 1.0.2

package/src/index.native.tsx

@@ -1,6 +1,6 @@
 // React Native entry point - re-export everything from main index
-export { ChatWidget } from './components/ChatWidget';
-export * from './types';
-export * from './theme';
-export { normaliseMessages } from './api';
-export { initStorage, isStorageInitialized, Storage } from './storage';
+export { ChatWidget } from "./components/ChatWidget";
+export * from "./types";
+export * from "./theme";
+export { normaliseMessages } from "./api";
+export { initStorage, isStorageInitialized, Storage } from "./storage";

package/src/index.web.tsx

@@ -1,27 +1,115 @@
-import * as React from "react";
+import React from "react";
+import { Platform, StyleSheet, View } from "react-native";
 import { createRoot } from "react-dom/client";
-import { View, StyleSheet } from "react-native";
+import { AnalyticsBrowser } from "@segment/analytics-next";
+import { AnalyticsClientProvider } from "./contexts/AnalyticsClientContext";
 import { ChatWidget } from "./components/ChatWidget";
 import type { ChatTheme } from "./types";
+import { getUserDetails } from "./components/utils";
 
 export function renderChatApp(
   domElement: HTMLElement,
   apiUrl: string,
   theme?: Partial<ChatTheme>,
   onClose?: () => void,
-  onClearChat?: () => void
+  onClearChat?: () => void,
+  segmentWriteKey?: string,
+  onViewAllPress?: (url: string, payload: any) => void,
+  onItemPress?: (url: string, item: any) => void,
+  isBetaMode?: boolean,
 ) {
   const root = createRoot(domElement);
-  root.render(
+
+  // Bridge to parent RN WebView / browser
+  const sendToParent = (type: string, payload: any) => {
+    const msg = { source: "vdb-ai-chat", type, payload };
+    const json = JSON.stringify(msg);
+
+    // RN WebView bridge
+    const rnwv = (window as any).ReactNativeWebView;
+    if (rnwv?.postMessage) {
+      rnwv.postMessage(json);
+    } else {
+      // Browser/iframe
+      try {
+        window.parent?.postMessage(msg, "*");
+      } catch {}
+      try {
+        window.dispatchEvent(new CustomEvent("vdb-ai-event", { detail: msg }));
+      } catch {}
+    }
+  };
+
+  const handleViewAll = (url: string, payload: any) => {
+    onViewAllPress?.(url, payload);
+    sendToParent("ai_view_all", { url, payload });
+    onClose?.();
+  };
+
+  const handleItemPress = (url: string, item: any) => {
+    onItemPress?.(url, item);
+    sendToParent("ai_item_click", { url, item });
+    onClose?.();
+  };
+
+  // Build base content and render immediately
+  const content = (
     <View style={styles.root}>
       <ChatWidget
         apiUrl={apiUrl}
         theme={theme}
         onClose={onClose}
         onClearChat={onClearChat}
+        onViewAllPress={handleViewAll}
+        onItemPress={handleItemPress}
+        isBetaMode={isBetaMode}
       />
     </View>
   );
+  root.render(content);
+
+  if (Platform.OS === "web" && segmentWriteKey) {
+    try {
+      const isEdge =
+        typeof navigator !== "undefined" &&
+        (navigator.userAgent.includes("Edg") || navigator.userAgent.includes("Edge"));
+
+      const clientPromise = AnalyticsBrowser.load({
+        writeKey: segmentWriteKey,
+        trackAppLifecycleEvents: false as any,
+        flushAt: (isEdge ? 1 : 10) as any,
+        flushInterval: (10000 as any),
+        maxBatchSize: (isEdge ? 1 : 10) as any,
+      } as any);
+
+      clientPromise
+        .then( async ([client]: any) => {
+          (client as any)?.debug?.(true);
+          (window as any).analytics = client;
+
+          client.page?.();
+          try {
+            const user = await getUserDetails();
+            const userId = user?.id;
+            if (userId) client.identify(userId);
+          } catch {}
+
+          const contentWithAnalytics = (
+            <AnalyticsClientProvider client={client}>
+              {content}
+            </AnalyticsClientProvider>
+          );
+          root.render(contentWithAnalytics);
+        })
+        .catch((e: any) => {
+          // eslint-disable-next-line no-console
+          console.error("[Segment] init failed", e);
+        });
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.error("[Segment] init failed", e);
+    }
+  }
 }
 
 const styles = StyleSheet.create({

package/src/storage.ts

@@ -1,4 +1,4 @@
-import { Platform } from 'react-native';
+import { Platform } from "react-native";
 
 // Storage interface that works across platforms
 interface StorageInterface {
@@ -9,7 +9,7 @@ interface StorageInterface {
 
 // Helper to safely get localStorage (only available on web)
 function getLocalStorage(): Storage | null {
-  if (typeof window !== 'undefined' && window.localStorage) {
+  if (typeof window !== "undefined" && window.localStorage) {
     return window.localStorage;
   }
   return null;
@@ -54,7 +54,7 @@ let hasWarnedAboutStorage = false;
 /**
  * Initialize storage with AsyncStorage for React Native.
  * Call this once at app startup before using ChatWidget.
- * 
+ *
  * @example
  * import AsyncStorage from '@react-native-async-storage/async-storage';
  * import { initStorage } from 'vdb-ai-chat';
@@ -69,7 +69,7 @@ export function initStorage(asyncStorage: StorageInterface): void {
  * Check if storage is properly initialized for the current platform
  */
 export function isStorageInitialized(): boolean {
-  if (Platform.OS === 'web') {
+  if (Platform.OS === "web") {
     return getLocalStorage() !== null;
   }
   return nativeStorage !== null;
@@ -84,21 +84,21 @@ const noopStorage: StorageInterface = {
 
 // Get the appropriate storage based on platform
 function getStorage(): StorageInterface {
-  if (Platform.OS === 'web') {
+  if (Platform.OS === "web") {
     return webStorage;
   }
-  
+
   if (!nativeStorage) {
     // Only warn once to avoid console spam
     if (!hasWarnedAboutStorage) {
       console.warn(
-        '[vdb-ai-chat] AsyncStorage not initialized. Call initStorage(AsyncStorage) at app startup.'
+        "[vdb-ai-chat] AsyncStorage not initialized. Call initStorage(AsyncStorage) at app startup."
       );
       hasWarnedAboutStorage = true;
     }
     return noopStorage;
   }
-  
+
   return nativeStorage;
 }
 
@@ -107,17 +107,20 @@ export const Storage = {
   getItem: async (key: string): Promise<string | null> => {
     return getStorage().getItem(key);
   },
-  
+
   setItem: async (key: string, value: string): Promise<void> => {
     return getStorage().setItem(key, value);
   },
-  
+
   removeItem: async (key: string): Promise<void> => {
     return getStorage().removeItem(key);
   },
-  
+
   // Convenience method to get and parse JSON
-  getJSON: async <T = any>(key: string, defaultValue: T | null = null): Promise<T | null> => {
+  getJSON: async <T = any>(
+    key: string,
+    defaultValue: T | null = null
+  ): Promise<T | null> => {
     try {
       const value = await getStorage().getItem(key);
       if (value) {
@@ -128,7 +131,7 @@ export const Storage = {
       return defaultValue;
     }
   },
-  
+
   // Convenience method to stringify and set JSON
   setJSON: async (key: string, value: any): Promise<void> => {
     try {

package/src/theme.ts

@@ -4,14 +4,14 @@ export const defaultTheme: ChatTheme = {
   primaryColor: "#0b93f6",
   backgroundColor: "#ffffff",
   inputColor: "#FFF",
-  inputBackgroundColor: "#f5f5f5",
+  inputBackgroundColor: "#FFFFFF",
   inputBorderRadius: 8,
   inputTextColor: "#000000",
-  userBubbleColor: "#804195",
+  userBubbleColor: "#4F4E57",
   userTextColor: "#ffffff",
-  botBubbleColor: "#e5e5ea",
+  botBubbleColor: "#EDEDF2",
   botTextColor: "#000000",
-  borderRadius: 18,
+  borderRadius: 8,
   fontFamily: undefined,
   fontSize: 16,
 };

package/src/types.ts

@@ -1,15 +1,14 @@
 export type Role = "user" | "assistant";
 
 export interface ChatMessage {
-  agent_response?: any;
   id: string;
   role: Role;
   text: string;
   createdAt: number;
   isLoading?: boolean;
   suggestions?: string[];
-  // "0" unset, "1" like, "2" dislike
-  reaction?: "0" | "1" | "2";
+  reaction?: string;
+  search_payload?: Record<string, any>;
 }
 
 export interface ChatTheme {
@@ -44,6 +43,8 @@ export interface ChatWidgetProps {
   onViewAllPress?: (deepLinkUrl: string, payload: any) => void;
   /** Called when a product item is pressed. Receives the deep link URL and item data. */
   onItemPress?: (deepLinkUrl: string, item: any) => void;
+  /** When true, shows beta labels and disclaimer. */
+  isBetaMode?: boolean;
 }
 
 export interface ChatWidgetRef {