GlobalAiAssistant Documentation

Overview

The GlobalAiAssistant component serves as a full-height sidebar panel for AI chat within the Vantage analytics and data platform. It enables users to interact with AI functionalities, manage conversations, and manage audio transcription in a user-friendly manner. This component aids in streamlining the process of chat interactions, providing a robust interface for users to engage with AI models in various contexts.

Purpose

The primary purpose of the GlobalAiAssistant is to create an accessible, intuitive interface for managing conversations with an AI. Users can start new conversations, select existing chats, rename or delete conversations, and interact with the assistant's capabilities in real time. The component is designed to be highly interactive, accommodating a range of functionalities that enhance user experience and productivity when working with AI.

Settings

The GlobalAiAssistant component is equipped with several settings controlling its functionality. Below are the exhaustive details regarding each setting:

1. panelWidth

   • Input Type: Numeric
   • Description: Defines the current width of the AI assistant sidebar panel. Modifying this value changes the panel's width on the display, allowing users to customize how much screen real estate the assistant takes up.
   • Default Value: 420

2. isTemporaryChat

   • Input Type: Boolean
   • Description: Indicates whether the chat is temporary and will not be saved once the user navigates away. Setting this to true allows users to experiment with conversations without affecting saved data.
   • Default Value: false

3. isRecording

   • Input Type: Boolean
   • Description: Indicates whether the audio recording feature is currently active. If true, the assistant is actively recording audio for transcription. This setting impacts the availability of transcription functionalities within the component.
   • Default Value: false

4. isTranscribing

   • Input Type: Boolean
   • Description: Represents whether the component is actively transcribing recorded audio to text. When this is true, the system is processing audio input to generate textual output.
   • Default Value: false

5. isResizing

   • Input Type: Boolean
   • Description: Used to track if the user is currently resizing the sidebar panel. This influences the rendering and provides feedback during resizing operations.
   • Default Value: false

6. loading

   • Input Type: Boolean
   • Description: Indicates whether the assistant is currently loading messages or data. User feedback can be provided based on this state (e.g., showing a loading spinner).
   • Default Value: false

7. messages

   • Input Type: Array
   • Description: Holds the list of messages in the current conversation. Altering this array updates what the user sees within the chat interface. Each message contains content, timestamps, and potentially other metadata.
   • Default Value: [] (empty array on initialization)

8. error

   • Input Type: String | null
   • Description: Used to store error messages generated during operations (loading, transcribing, etc.). If an error occurs, presenting this message improves user understanding and aids troubleshooting.
   • Default Value: null

9. inputValue

   • Input Type: String
   • Description: Represents the current text input in the chat input field. This is updated as the user types, directly affecting what the assistant will send as the next message.
   • Default Value: '' (empty string on initialization)

10. isLoadingMessages

    • Input Type: Boolean
    • Description: Indicates if chat messages are currently being loaded. Reflecting this state allows real-time feedback in the UI, such as displaying spinners.
    • Default Value: false

11. addedToContext

    • Input Type: Set
    • Description: Keeps track of which messages have already been added to the context for AI processing. It helps in managing data flow and ensuring repetitions are accounted for.
    • Default Value: new Set()

12. addingToContext

    • Input Type: String | null
    • Description: Represents any message that is currently in the process of being added to context. This is important for keeping UI state synchronized with internal processing.
    • Default Value: null

How It Works

The GlobalAiAssistant operates through internal state management.

• State Management: The component uses hooks like state management for local state management, tracking messages, loading states, and more.
• Context Providers: It integrates with context providers such as usePageContext, useAi, and useAiPanel to facilitate seamless interaction with the app's overall data and functionality.
• Event Handling: Listeners for user interactions (e.g., clicks, keyboard events) are set up to handle actions like starting new conversations or managing messages.
• Audio Functionality: It incorporates features for audio recording and transcription, allowing users to interact with the assistant through voice input.

Data Expectations

The GlobalAiAssistant expects the following data structures for proper operation:

• Messages: An array of message objects wherein each object typically includes properties like id, content, timestamp, and possibly sender information.
• Conversations: An array of conversation objects that include properties such as id, title, and messageCount.

This data must be formatted according to the structures expected by the component to ensure accurate rendering and interaction.

AI Integrations

The GlobalAiAssistant integrates with AI providers via context hooks, which allows it to communicate with backend AI models. These integrations enable functionalities such as:

• Prompt Handling: Sending user prompts to AI models and receiving responses.
• Message Contextualization: Adding messages to the context that the AI uses to maintain coherent dialogue over sessions.

Billing Impacts

Depending on how the AI integrations are utilized, billing may be impacted based on:

• API Usage: Usage of AI services may incur costs based on the number of requests sent, types of models accessed, and the duration of audio transcriptions.
• Concurrent Users: If the application scales and many users utilize the AI assistant simultaneously, costs may rise related to processing power or server needs.

Use Cases & Examples

Use Case 1: Interactive Customer Support

Businesses can utilize the GlobalAiAssistant to provide real-time customer support through AI chat capabilities. Customers can initiate inquiries and receive responses while the assistant logs conversations for future reference.

Use Case 2: Education & Training Sessions

Educational institutions can employ the assistant as a tutor-like AI that engages students in dialogue regarding course material. The assistant can help answer questions or guide users through complex concepts interactively.

Example Implementation

In a customer support scenario, the GlobalAiAssistant might be configured with the following initial settings:

• panelWidth: 420
• isTemporaryChat: false
• conversations: [{ id: '1', title: 'General Inquiries', messageCount: 3 }]
• messages: [{ id: 'msg1', content: 'How can I reset my password?', timestamp: '2023-10-10T12:00:00Z' }]

With this configuration, the assistant can be deployed to assist customers visiting the website, utilizing pre-set conversations to guide dialog while ensuring the interface is easily accessible for assistance.

This ensures a seamless interaction while minimizing user friction, driving better user satisfaction and resolution rates.