xtrareports-405197-ai-powered-functionality-web-reporting-summarize-translate-in-blazor-viewer.md
Follow the instructions in this topic to integrate AI-powered Summarize, Translate, and Translate Inline commands into the native Report Viewer for Blazor. This tutorial uses Azure OpenAI.
View Example: Summarize and Translate Reports Using Azure OpenAI
Run Demo: Report Viewer AI Extensions
In Blazor Report Viewer, AI-powered capabilities are available in the Quick Actions menu and within the AI Operations tab. The following AI-powered features are available:
SummarizeUses generative AI to summarize report content and displays core insights associated with this report. The generated summary appears in the AI Operations tab.TranslateUses AI services to translate report content to another language. The generated translation appears in the AI Operations tab.Translate InlineUses AI services to translate report content to another language and displays the translation directly within the previewed document. You can export or print the translated document.
You can open an existing application that contains a DxReportViewer component. To create a new application, refer to the following help topic: Get Started with Blazor Reporting.
Install the following NuGet packages for Azure OpenAI service:
For the list of supported AI services and their prerequisites, refer to Supported AI Services in the following help topic: AI-powered Extensions for DevExpress Reporting.
Note
DevExpress AI-powered extensions follow the “bring your own key” principle. DevExpress does not offer a REST API and does not ship any built-in LLMs/SLMs. You need an active Azure/Open AI subscription to obtain the REST API endpoint, key, and model deployment name. These variables must be specified at application startup to register AI clients and enable DevExpress AI-powered Extensions in your application.
Call the following methods on application startup to enable AI-powered Summarize and Translate actions in Blazor Report Viewer:
AddDevExpressAIAdds DevExpress AI-related services to the application service collection.AddBlazorReportingAIIntegrationAdds AI-powered functionality to the native Report Viewer for Blazor.AddTranslation
Activates AI-powered content translation functionality in the native Report Viewer for Blazor.
Use the following methods to specify translation options:
Activates AI-powered summarization functionality in the native Report Viewer for Blazor.
Use the following methods to specify summarization options:
If you use only the summarization functionality in your application and need to specify the language list, use the AITranslationConfigurationBuilder.SetLanguages method.
The following snippet registers an Azure OpenAI service and activates AI-powered summarization and translation functionality for Blazor Report Viewer:
using Azure;
using Azure.AI.OpenAI;
using DevExpress.AIIntegration;
using DevExpress.AIIntegration.Reporting.Common.Models;
using DevExpress.Blazor.Reporting;
using Microsoft.Extensions.AI;
// ...
builder.Services.AddDevExpressServerSideBlazorReportViewer();
// ...
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
string azureOpenAIKey = Environment.GetEnvironmentVariable("AZURE_OPENAI_API_KEY");
string deploymentName = "MODEL_NAME"
IChatClient asChatClient = new AzureOpenAIClient(new Uri(azureOpenAIEndpoint),
new System.ClientModel.ApiKeyCredential(azureOpenAIKey))
.GetChatClient(deploymentName).AsIChatClient();
builder.Services.AddChatClient(asChatClient);
builder.Services.AddDevExpressAI((config) => {
config.AddBlazorReportingAIIntegration(cfg =>
cfg.AddSummarization(summarizeOptions =>
summarizeOptions.SetSummarizationMode(SummarizationMode.Abstractive)
.SetTemperature(0.1f))
.AddTranslation(translateOptions =>
translateOptions.SetLanguages(new List<LanguageInfo> {
new LanguageInfo { Text = "German", Id = "de-DE" },
new LanguageInfo { Text = "Spanish", Id = "es-ES" }
})
.EnableTranslation()
.EnableInlineTranslation())
);
});
Once you activate the AI-powered Translate and Summarize features, the AI Operations tab appears in the tab panel, and AI-powered Quick Actions menu items are available to users:
| AI Operations tab | AI-powered Quick Actions |
|---|---|
The Summarize and Translate commands are available in the Quick Actions menu and AI Operations tab.
The AI Operations tab allows you to do the following:
The Quick Actions menu allows you to summarize and translate selected report content. Operation output is displayed in the AI Operations tab.
The Translate Inline command is available in the Quick Actions menu. This command translates text directly in the document preview. Select the required content and use the Translate Inline command from the Quick Actions menu. To translate the current page or entire document, use the Quick Actions menu in the report’s upper right corner.
Each page that contains AI-generated translations is marked with the AI-generated Translation label:
To cancel translation for the entire document, use the Revert to Original command from the Quick Actions menu:
To cancel translation for a specific page, use the Revert To Original button below the AI-generated Translation label.
You can export or print the translated document. The following message appears before you export a document with an AI-generated translation:
“You are about to export a document that contains AI-generated translations. Do you want to proceed?”