Skip to content

Commit df345ba

Browse files
committed
update readme
1 parent 902d258 commit df345ba

File tree

2 files changed

+38
-22
lines changed

2 files changed

+38
-22
lines changed

CS/Program.cs

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,17 @@
11
using Azure;
22
using Azure.AI.OpenAI;
3+
using DashboardAIAssistant.Services;
34
using DevExpress.AIIntegration;
45
using DevExpress.AspNetCore;
56
using DevExpress.DashboardAspNetCore;
67
using DevExpress.DashboardCommon;
78
using DevExpress.DashboardWeb;
89
using DevExpress.DataAccess.Excel;
9-
using DevExpress.DataAccess.Sql;
1010
using Microsoft.AspNetCore.Builder;
1111
using Microsoft.AspNetCore.Hosting;
1212
using Microsoft.Extensions.AI;
1313
using Microsoft.Extensions.DependencyInjection;
1414
using Microsoft.Extensions.Hosting;
15-
using Microsoft.Extensions.Hosting.Internal;
16-
using DashboardAIAssistant;
17-
using DashboardAIAssistant.Services;
18-
using System;
19-
using System.IO;
2015

2116
var builder = WebApplication.CreateBuilder(args);
2217
builder.Services

README.md

Lines changed: 37 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@
33
[![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183)
44
[![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives)
55
<!-- default badges end -->
6-
# Dashboard for ASP.NET Core -- Integrate AI Assistant based on Azure OpenAI
6+
# Dashboard for ASP.NET Core Integrate AI Assistant based on Azure OpenAI
77

8-
This example is an ASP.NET Core application with integrated DevExpress Reports and an AI assistant. User requests and assistant responses are displayed on-screen using the DevExtreme [`dxChat`](https://js.devexpress.com/jQuery/Documentation/24_2/ApiReference/UI_Components/dxChat/) component.
8+
This example is an ASP.NET Core application with integrated DevExpress Reports and an AI assistant. User requests and assistant responses are displayed on-screen using the DevExtreme [`dxChat`](https://js.devexpress.com/jQuery/Documentation/24_2/ApiReference/UI_Components/dxChat/) component. An AI Assistant [custom dashboard item](https://docs.devexpress.com/Dashboard/117546/web-dashboard/advanced-customization/create-a-custom-item) is based on the `dxChat` widget.
99

10-
![DevExpress BI Dashboard - Integrate AI Assistant](images/dashboard-ai-assistant.png)
10+
![DevExpress BI Dashboard - Integrate an AI Assistant](images/dashboard-ai-assistant.png)
1111

12-
The AI Assistant reviews and analyzes all the data displayed in the dashboard to answer your questions. For a more focused analysis, you can select a specific dashboard item. Simply click the **Values** button in the AI Assistant custom item's caption and choose the desired widget. Any changes to dashboard data—such as updates to parameters or master filters—will automatically trigger a recreation of the AI Assistant.
12+
The AI Assistant reviews and analyzes all the data displayed in the dashboard to answer your questions. For a more focused analysis, you can select a specific dashboard item. Click the **Values** button in the AI Assistant custom item's caption and choose the desired widget. Any changes to dashboard data—such as updates to parameters or master filters—will automatically trigger a recreation of the AI Assistant. The dashboard data is exported in Excel format and passed to the AI Assistant.
1313

1414
**Please note that AI Assistant initialization takes time. The assistant is ready for interaction once Microsoft Azure scans the source document on the server side.**
1515

@@ -20,9 +20,9 @@ The AI Assistant reviews and analyzes all the data displayed in the dashboard to
2020
> [!NOTE]
2121
> 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.
2222
23-
You need to create an Azure OpenAI resource in the Azure portal to use AI Assistants for DevExpress BI Dashboard. Refer to the following help topic for details: [Microsoft - Create and deploy an Azure OpenAI Service resource](https://learn.microsoft.com/en-us/azure/ai-services/openai/how-to/create-resource?pivots=web-portal).
23+
Create an Azure OpenAI resource in the Azure portal to use AI Assistants for DevExpress BI Dashboard. Refer to the following help topic for details: [Microsoft - Create and deploy an Azure OpenAI Service resource](https://learn.microsoft.com/en-us/azure/ai-services/openai/how-to/create-resource?pivots=web-portal).
2424

25-
Once you obtain a private endpoint and an API key, register them as `AZURE_OPENAI_ENDPOINT` and `AZURE_OPENAI_APIKEY` environment variables. The [EnvSettings.cs](./CS/ReportingApp/EnvSettings.cs) reads these settings. `DeploymentName` in this file is a name of your Azure model, for example, `GPT4o`:
25+
Once you obtain a private endpoint and an API key, register them as `AZURE_OPENAI_ENDPOINT` and `AZURE_OPENAI_APIKEY` environment variables. The [EnvSettings.cs](./CS/EnvSettings.cs) reads these settings. `DeploymentName` in this file is a name of your Azure model, for example, `GPT4o`:
2626

2727
```cs
2828
public static class EnvSettings {
@@ -32,9 +32,6 @@ public static class EnvSettings {
3232
}
3333
```
3434

35-
>[!NOTE]
36-
> Availability of Azure Open AI Assistants depends on the region. Refer to the following article for more details: [Assistants (Preview)](https://learn.microsoft.com/en-us/azure/ai-services/openai/concepts/models?tabs=global-standard%2Cstandard-chat-completions#assistants-preview).
37-
3835
Files to Review:
3936
- [EnvSettings.cs](./CS/EnvSettings.cs)
4037

@@ -62,6 +59,9 @@ builder.Services.AddDevExpressAI(config =>
6259
// ...
6360
```
6461

62+
>[!NOTE]
63+
> Availability of Azure Open AI Assistants depends on the region. Refer to the following article for more details: [Assistants (Preview)](https://learn.microsoft.com/en-us/azure/ai-services/openai/concepts/models?tabs=global-standard%2Cstandard-chat-completions#assistants-preview).
64+
6565
Files to Review:
6666
- [Program.cs](./CS/Program.cs)
6767

@@ -82,11 +82,19 @@ Files to Review:
8282
- [AIAssistantProvider.cs](./CS/Services/AIAssistantProvider.cs)
8383
- [IAIAssistantProvider.cs](./CS/IAIAssistantProvider.cs)
8484

85-
### Create a Custom Item with AI Assistant
85+
### Create a AI Assistant Custom Item
86+
87+
This example implements a [custom item](https://docs.devexpress.com/Dashboard/117546/web-dashboard/advanced-customization/create-a-custom-item) based on the [`dxChat`](https://js.devexpress.com/jQuery/Documentation/Guide/UI_Components/Chat/Overview/) component. The
88+
89+
For instructions on how to implement a custom dashboard items, refer to tutorials in the following section: [Create a Custom Item for the Web Dashboard](https://docs.devexpress.com/Dashboard/117546/web-dashboard/advanced-customization/create-a-custom-item).
8690

87-
This example implements a [custom item](https://docs.devexpress.com/Dashboard/117546/web-dashboard/advanced-customization/create-a-custom-item) based on the [`dxChat`](https://js.devexpress.com/jQuery/Documentation/Guide/UI_Components/Chat/Overview/) component.
91+
For the **AI Assistant** custom item implementation, review to the following file: [aiChatCustomItem.js](./CS/wwwroot/js/aiChatCustomItem.js)
8892

89-
For the **AI Assistant** custom item implementation, refer to the following file: [aiChatCustomItem.js](./CS/wwwroot/js/aiChatCustomItem.js)
93+
The additional logic for the custom item is implemented in `handleDashboardInitialized` and `customizeChatCustomItemCaptionToolbar` in the [Index.cshtml](./CS/Pages/Index.cshtml) file. The `itemCaptionToolbarUpdated` event is used to add a **Select Widget** button to the item's caption. This button allows users to select a dashboard item for the AI Assistant. The `DashboardInitialized` event is handled to implement the one AI Assistant per dashboard logic.
94+
95+
Files to Review:
96+
- [Index.cshtml](./CS/Pages/Index.cshtml)
97+
- [aiChatCustomItem.js](./CS/wwwroot/js/aiChatCustomItem.js)
9098

9199
### Register the Custom Item
92100

@@ -112,15 +120,25 @@ Register the created custom item extension in the Wen Dashboard:
112120
</div>
113121
```
114122

115-
After you registered the extension the Assistant icon appears in the Dashboard Toolbox:
123+
After you registered the extension the AI Assistant icon appears in the Dashboard Toolbox:
116124

117125
![DevExpress BI Dashboard - AI Assistant Custom Item Icon](images/dashboard-toolbar-ai-assistant-item.png)
118126

119-
Click the item to add an AI Assistant to the dashboard. Only one AI Assistant item is available per dashboard. You can ask the assistant questions in the Viewer mode.
127+
Click the item to add an AI Assistant item to the dashboard. Only one AI Assistant item is available per dashboard. You can ask the assistant questions in the Viewer mode.
120128

121129
File to Review:
122130
- [Index.cshtml](./CS/Pages/Index.cshtml)
123131

132+
### Access the Assistant
133+
134+
Each time a dashboard is initialized or its [dashboard state](https://docs.devexpress.com/Dashboard/DevExpress.DashboardCommon.DashboardState) changes, a new assistant is created and the dashboard data is exported in Excel format. This way the AI assistant is always provided with up-to-date data.
135+
136+
Files to Review:
137+
138+
- [aiChatCustomItem.js](./CS/wwwroot/js/aiChatCustomItem.js)
139+
- [AIAssistantProvider.cs](./CS/Services/AIAssistantProvider.cs)
140+
- [AIChatController](./CS/Controllers/AIChatController.cs)
141+
124142
### Communicate with Assistant
125143

126144
Each time a user sends a message, the [`onMessageEntered`](https://js.devexpress.com/jQuery/Documentation/24_2/ApiReference/UI_Components/dxChat/Configuration/#onMessageEntered) event handler passes the request to the assistant:
@@ -161,13 +179,16 @@ async onMessageEntered(e) {
161179
}
162180
```
163181

164-
[`AIChatController.GetAnswer`]() receives answers from the assistant.
182+
[`AIChatController.GetAnswer`](./CS/Controllers/AIChatController.cs#L38) receives answers from the assistant.
165183

166184
## Files to Review
167185

186+
- [Program.cs](./CS/Program.cs)
187+
- [Index.cshtml](./CS/Pages/Index.cshtml)
188+
- [aiChatCustomItem.js](./CS/wwwroot/js/aiChatCustomItem.js)
168189
- [AIAssistantProvider.cs](./CS/Services/AIAssistantProvider.cs)
169190
- [IAIAssistantProvider.cs](./CS/IAIAssistantProvider.cs)
170-
- [Program.cs](./CS/Program.cs)
191+
- [AIChatController](./CS/Controllers/AIChatController.cs)
171192

172193
## Documentation
173194

0 commit comments

Comments
 (0)