Skip to content

AI Assistant: DataGrid - write JS frameworks demos (React)#33660

Open
Raushen wants to merge 16 commits into
DevExpress:26_1from
Raushen:AIAssistant-Demo-React
Open

AI Assistant: DataGrid - write JS frameworks demos (React)#33660
Raushen wants to merge 16 commits into
DevExpress:26_1from
Raushen:AIAssistant-Demo-React

Conversation

@Raushen
Copy link
Copy Markdown
Contributor

@Raushen Raushen commented May 21, 2026

No description provided.

@Raushen Raushen self-assigned this May 21, 2026
@Raushen Raushen requested a review from a team as a code owner May 21, 2026 12:09
Copilot AI review requested due to automatic review settings May 21, 2026 12:09
@Raushen Raushen added the 26_1 label May 21, 2026
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a new DataGrid “AI Assistant” demo for React in both JavaScript and TypeScript variants, wired to an Azure OpenAI-backed AIIntegration, and aligns the jQuery version’s DataGrid configuration with the React demos.

Changes:

  • Introduced React (TS) and ReactJs (JS) demo implementations for DataGrid AI Assistant, including SystemJS bootstrapping pages.
  • Added an Azure OpenAI-based AIIntegration service layer (with retry-on-connection-error behavior) for both React variants.
  • Enabled filterSyncEnabled in the existing jQuery DataGrid demo to match the React behavior.

Reviewed changes

Copilot reviewed 10 out of 12 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
apps/demos/Demos/DataGrid/AIAssistant/ReactJs/service.js Implements Azure OpenAI-backed AIIntegration for the React JS demo.
apps/demos/Demos/DataGrid/AIAssistant/ReactJs/index.js React JS entry point mounting App.
apps/demos/Demos/DataGrid/AIAssistant/ReactJs/index.html SystemJS-based host page for the React JS demo.
apps/demos/Demos/DataGrid/AIAssistant/ReactJs/App.js React JS DataGrid demo with AIAssistant and suggestion handling.
apps/demos/Demos/DataGrid/AIAssistant/React/types.ts Adds TS types for OpenAI chat messages and demo data shape.
apps/demos/Demos/DataGrid/AIAssistant/React/service.ts Implements Azure OpenAI-backed AIIntegration for the React TS demo.
apps/demos/Demos/DataGrid/AIAssistant/React/index.tsx React TS entry point mounting App.
apps/demos/Demos/DataGrid/AIAssistant/React/index.html SystemJS-based host page for the React TS demo.
apps/demos/Demos/DataGrid/AIAssistant/React/App.tsx React TS DataGrid demo with AIAssistant and suggestion handling.
apps/demos/Demos/DataGrid/AIAssistant/jQuery/index.js Enables filterSyncEnabled in the jQuery DataGrid configuration.

Comment thread apps/demos/Demos/DataGrid/AIAssistant/ReactJs/service.js
Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/service.ts
Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/App.tsx Outdated
Copilot AI review requested due to automatic review settings May 21, 2026 12:41
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 11 out of 13 changed files in this pull request and generated 1 comment.

Comment thread apps/demos/configs/React/config.js Outdated
Copilot AI review requested due to automatic review settings May 21, 2026 16:25
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 14 out of 16 changed files in this pull request and generated 6 comments.

Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/service.ts
Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/service.ts Outdated
Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/styles.css
Comment thread apps/demos/Demos/DataGrid/AIAssistant/ReactJs/service.js
Comment thread apps/demos/Demos/DataGrid/AIAssistant/ReactJs/service.js
Comment thread apps/demos/configs/React/config.js
Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/service.ts
},
};

const response = await aiService.chat.completions.create(params as any, { signal });
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we avoid using any? As I can see in other demos, there is no need to use as any for params. Otherwise, we can redefine the type in ./types.ts

<DataGrid
id="gridContainer"
dataSource={sales}
showBorders={true}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lets use short syntax for boolean value for true here and in other places, it is more react-style

Suggested change
showBorders={true}
showBorders

Copilot AI review requested due to automatic review settings May 22, 2026 13:13
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 15 out of 17 changed files in this pull request and generated 2 comments.

Comment thread apps/demos/Demos/DataGrid/AIAssistant/React/service.ts
Comment thread apps/demos/Demos/DataGrid/AIAssistant/ReactJs/service.js
import { AIIntegration } from 'devextreme-react/common/ai-integration';
import type { RequestParams, Response } from 'devextreme-react/common/ai-integration';
import { AzureOpenAI } from 'openai';
import type { ChatCompletionCreateParamsNonStreaming } from 'openai/resources/chat/completions';
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Use OpenAI.ChatCompletionCreateParamsNonStreaming instead + need to import OpenAI from openai

Copilot AI review requested due to automatic review settings May 22, 2026 14:39
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 15 out of 17 changed files in this pull request and generated 2 comments.

Comment on lines +60 to +62
sendRequest({ prompt, data }: RequestParams): Response {
const isValidRequest = JSON.stringify(prompt.user).length < 5000;
if (!isValidRequest) {
}
export const aiIntegration = new AIIntegration({
sendRequest({ prompt, data }) {
const isValidRequest = JSON.stringify(prompt.user).length < 5000;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants