logoAnt Design X

DesignDevelopmentComponentsX MarkdownX SDKPlayground
  • Introduction
  • Data Flow
    • useXChatConversation Data
    • useXConversationsConversation Management
    • Chat ProviderData Provider
  • Utilities
    • XRequestRequest
    • XStreamStream

useXConversations
Conversation Management

When To Use

  • Use when you need to manage conversation lists, including operations like creating, deleting, and updating conversations.

Code Demo

API

useXConversations

tsx
type useXConversations = (config: XConversationConfig) => {
conversations: ConversationData[];
activeConversationKey: string;
setActiveConversationKey: (key: string) => boolean;
addConversation: (conversation: ConversationData, placement?: 'prepend' | 'append') => boolean;
removeConversation: (key: string) => boolean;
setConversation: (key: string, conversation: ConversationData) => boolean;
getConversation: (key: string) => ConversationData;
setConversations: (conversations: ConversationData[]) => boolean;
getMessages: (conversationKey: string) => any[];
};

XConversationConfig

tsx
interface XConversationConfig {
defaultConversations?: ConversationData[];
defaultActiveConversationKey?: string;
}

ConversationData

tsx
interface ConversationData extends AnyObject {
key: string;
label?: string;
}
Basic Usage
CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Conversation Operations
CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Multiple Instances
CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Integration with useXChat for message management
CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
Current Conversation Data:
{
  "key": "item1",
  "label": "Conversation Item 1",
  "disabled": false
}

List 1

  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4

List 2

  • Conversation Item 1
  • Conversation Item 2
  • Conversation Item 1
  • Conversation Item 2
  • This's Conversation Item 3, you can click me!
  • Conversation Item 4
Hello! How can I assist you today?
hello!