UnbxdShoppingAssistantWrapper

Overview

The UnbxdShoppingAssistantWrapper is a foundational wrapper component that provides context and state management for all Shopping Assistant functionality. It acts as the core provider that enables AI-powered conversational shopping experiences by managing chat state, conversation history, API communication, and user interactions. All Shopping Assistant components and hooks must be wrapped within this component to function properly.

⚠️

Important:

The UnbxdShoppingAssistantWrapper component is essential for Shopping Assistant functionality, managing conversation state, API communication, and chat history; all Shopping Assistant components must be nested within this wrapper to access the shopping assistant context and features.

Usage

// This is a sample example. 
// Please go through the entire documentation for understanding different use cases and update as per your needs.
import { UnbxdShoppingAssistantWrapper } from "@unbxd-ui/react-shopping-assistant-hooks";
 
<UnbxdShoppingAssistantWrapper
	siteKey="YOUR_SITE_KEY"
	apiKey="YOUR_API_KEY"
	storeConversationId="LOCALSTORAGE"
	headers={{
		uId: "user123",
		deviceType: "desktop"
	}}
	extraParams={{
		customParam: "value"
	}}
>
	<ChatComponent />
</UnbxdShoppingAssistantWrapper>

Props

siteKey

string

This is the unique Site Key assigned by Unbxd to every site created in the console dashboard.
Required for authenticating API requests to the Shopping Assistant service.
Refer to this section for steps on how to get the Site Key for your account.

apiKey

string

This is the unique API Key assigned to every site created in the console dashboard.
Used for authenticating Shopping Assistant API calls.
Refer to this section for steps on how to get the API Key for your account.

storeConversationId

'LOCALSTORAGE' | 'SESSIONSTORAGE'

Determines where the conversation ID should be stored for persistence across browser sessions.
LOCALSTORAGE: The conversation id will be stored in Local Storage and the conversation persists across browser sessions until manually cleared .
SESSIONSTORAGE: The conversation id will be stored in Session Storage and the conversation only persists for the current browser session .
Default value:: LOCALSTORAGE

headers

object

Custom headers to be sent with Shopping Assistant API requests.
Can include both static values and dynamic functions that return values.
Default value:: {}

//Example implementation
headers={{
	uId: "user123",
	deviceType: "desktop",
	sessionId: () => getSessionId(), // Dynamic function
	customHeader: "value"
}}

extraParams

object

Additional parameters to be included in Shopping Assistant API requests.
Supports both static values and dynamic functions.
Useful for passing custom filters, metadata, or configuration.
Default value:: {}

//Example implementation
extraParams={{
	category: "electronics",
	brand: "apple",
	priceRange: () => getCurrentPriceFilter(),
	customParam: "value"
}}

Changelog Chat