IntuidyAiSettings

Overview

The IntuidyAiSettings component is designed for the selection and configuration of AI providers within the Vantage analytics platform. It allows users to choose their preferred AI provider, manage API keys, and select specific models for AI-driven features such as insights and summaries. The component manages its state based on data passed from the parent component, hence it is categorized as a controlled component.

Purpose

The primary purpose of the IntuidyAiSettings component is to facilitate integration with various AI providers, enabling users to enhance their analytical capabilities. By configuring their AI preferences, users can unlock various functionalities and improve the overall user experience with intelligent assistance.

Settings

The following sections detail each setting that the IntuidyAiSettings component accepts, including its name, input type, functionality, and default values.

1. providers

• Type: Array of Objects
• Description: An array that contains AI provider objects, where each object includes details such as the service ID, connection status, name, and list of available models.
• Default Value: [] (an empty array)
• Functionality: This array is essential for rendering the provider options in the UI. It must include details like the key, name, connected, serviceId, description, models, and more. Changing this array can impact which providers are available to the user and their connection statuses.

2. loading

• Type: Boolean
• Description: A boolean flag indicating whether the providers' data is currently being loaded.
• Default Value: false
• Functionality: While set to true, this flag triggers a loading spinner in the UI, indicating to the user that data is in the process of being fetched. When switching between providers or retrieving models, this flag is crucial for UX.

3. error

• Type: String or null
• Description: An error message string that indicates if loading of providers has failed.
• Default Value: null
• Functionality: If there is an error during the loading of provider data, this message will be displayed to alert the user. Setting this value effectively communicates failure to the user and influences the display logic to show an error message.

4. selectedProvider

• Type: String
• Description: A string representing the key of the currently selected AI provider.
• Default Value: 'openai'
• Functionality: This setting dictates which provider is currently active in the interface. Changing this value updates the interface to display models and options relevant to the selected provider.

5. selectedModel

• Type: String or null
• Description: An identifier for the currently selected AI model from the chosen provider, if applicable.
• Default Value: null
• Functionality: This setting determines which AI model is currently engaged. It can be set to null if no model is selected, or it can point to a specific model ID. Changing this effectively impacts the output or analysis provided by the selected AI service.

6. onProviderChange

• Type: Function
• Description: A callback function invoked when the provider is changed. It passes the new provider key and default model ID.
• Default Value: None (must be provided)
• Functionality: This function must be defined in the parent component to handle changes in the selected provider. It allows for the parent component to respond to the user's selection and adjust any dependent data accordingly.

7. onModelChange

• Type: Function
• Description: A callback function that is called when the model is changed, passing the new model ID.
• Default Value: None (must be provided)
• Functionality: This function is also required from the parent component to handle situations where a user selects a different model. It establishes communication about model selection changes between the IntuidyAiSettings and its parent.

8. hideIntroText

• Type: Boolean
• Description: A flag that determines whether to show the introductory text explaining the component's purpose.
• Default Value: false
• Functionality: By setting this to true, users can suppress the display of introductory information, allowing a cleaner UI experience when the explanation is deemed unnecessary.

Use Cases & Examples

Use Cases

1. AI Provider Configuration for Enhanced Data Insights: A business wants to integrate an AI provider such as OpenAI to interpret and summarize their data analytics dashboards automatically.

2. Custom Model Deployment: A data science team is using a custom-trained model on the Claude platform and wants to connect it with the Vantage analytics platform to utilize specialized predictions.

3. Multiple Model Management: An analytics team is using various AI providers simultaneously to leverage different strengths across platforms for comprehensive insights.

Example Configuration

Use Case: AI Provider Configuration for Enhanced Data Insights

Assume a business wants to leverage the OpenAI provider for automating insights. Below is a sample configuration for how the IntuidyAiSettings could be initialized by the parent component.

const aiProviders = [
    {
        key: 'openai',
        name: 'OpenAI',
        description: 'Generative AI for text insights.',
        connected: true,
        serviceId: 'service-001',
        defaultModel: 'gpt-4',
        models: [
            { id: 'gpt-3.5' },
            { id: 'gpt-4' },
        ],
    },
    {
        key: 'claude',
        name: 'Claude',
        description: 'Powerful AI by Anthropic.',
        connected: false,
        serviceId: 'service-002',
        models: [],
    },
    // Additional providers...
];

// Example of how to use IntuidyAiSettings
<IntuidyAiSettings
    providers={aiProviders}
    loading={false}
    error={null}
    selectedProvider='openai'
    selectedModel='gpt-4'
    onProviderChange={(providerKey, defaultModelId) => console.log(`Provider changed to: ${providerKey}. Default model: ${defaultModelId}`)}
    onModelChange={(modelId) => console.log(`Model changed to: ${modelId}`)}
    hideIntroText={false}
/>

In the above configuration, the user has connected to the OpenAI provider and selected the gpt-4 model, ready to activate insights based on their data analytics.

Conclusion

The IntuidyAiSettings component plays a pivotal role within the Vantage analytics platform, giving users control over AI integrations and model selections to enhance their data-driven decision-making processes. By understanding the various settings and their implications, users can effectively tailor their AI experiences to fit their specific requirements.