Back to Devexpress

DxAIChat.Initialized Event

blazor-devexpress-dot-aiintegration-dot-blazor-dot-chat-dot-dxaichat-381d65b4.md

latest4.7 KB
Original Source

DxAIChat.Initialized Event

Fires after the component is initialized.

Namespace : DevExpress.AIIntegration.Blazor.Chat

Assembly : DevExpress.AIIntegration.Blazor.Chat.v25.2.dll

NuGet Package : DevExpress.AIIntegration.Blazor.Chat

Declaration

csharp
[Parameter]
public EventCallback<IAIChat> Initialized { get; set; }

Parameters

TypeDescription
IAIChat

An object that allows you to set up a chat assistant and manage chat history.

|

Remarks

Handle the Initialized event to perform custom actions after initializing the component. For instance, you can call the SetupAssistantAsync(String, String) method to connect the chat to an existing OpenAI Assistant or call the LoadMessages(IEnumerable<BlazorChatMessage>) method to load messages to chat history.

razor
<div class="chat-demo-container">
    <DxAIChat CssClass="demo-chat" 
              Initialized="ChatInitialized" />
</div>

@code {
    void ChatInitialized(IAIChat chat) {
        chat.LoadMessages(new[] {
            new BlazorChatMessage(Microsoft.Extensions.AI.ChatRole.User, "Hello, AI!"),
            new BlazorChatMessage(Microsoft.Extensions.AI.ChatRole.Assistant,
                "Hey there, human! What's on your mind? 😊")
        });
    }
}

Run Demo: AI Chat - Rich Formatted Response

View Example: AI Chat for Blazor - How to add DxAIChat component in Blazor, MAUI, WPF, and WinForms applications

Add a System Prompt

DevExpress Blazor AI Chat allows you to create a system prompt that provides the AI model with initial role context and specific instructions. The following code snippet adds a system prompt to the chat using the LoadMessages method in the Initialized event handler:

razor
<DxAIChat Initialized="ChatInitialized" />

@code {
    async Task ChatInitialized(IAIChat chat) {
        var prompt = @"
            You are a friendly hiking enthusiast who helps people discover fun hikes in their area.
            You introduce yourself when first saying hello.
            When helping people out, you always ask them for this information
            to inform the hiking recommendation you provide:

            1. The location where they would like to hike
            2. What hiking intensity they are looking for

            You will then provide three suggestions for nearby hikes that vary in length
            after you get that information. You will also share an interesting fact about
            local nature on the hikes when making a recommendation. At the end of your
            response, ask if there is anything else you can help with.
        ";
        chat.LoadMessages(new[] {
            new BlazorChatMessage(Microsoft.Extensions.AI.ChatRole.System, prompt),
        });
    }
}

The following code snippet (auto-collected from DevExpress Examples) contains a reference to the Initialized event.

Note

The algorithm used to collect these code examples remains a work in progress. Accordingly, the links and snippets below may produce inaccurate results. If you encounter an issue with code examples below, please use the feedback form on this page to report the issue.

devexpress-ai-chat-samples/CS/DevExpress.AI.Samples.WPFBlazor/Controls/AIChatControl.cs#L226

csharp
Parameters = new Dictionary<string, object>() {
    { nameof(DxAIChat.Initialized), new EventCallback<IAIChat>(null, OnChatInitialized)}
}

See Also

DxAIChat Class

DxAIChat Members

DevExpress.AIIntegration.Blazor.Chat Namespace