Skip to content

Commit ba2cbaf

Browse files
AllakyyevAllakyyev
authored
Merge pull request #4 from DevExpress-Examples/fix-typos
24.2 small refactoring
2 parents 47bff57 + 6d3d4e2 commit ba2cbaf

File tree

3 files changed

+100
-97
lines changed

3 files changed

+100
-97
lines changed

‎CS/ReportingApp/wwwroot/css/site.css‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ for details on configuring this project to bundle and minify static web assets.
66
height: 100%;
77
border-radius: 0;
88
}
9-
9+
.dx-chat-messagebubble-content {
10+
user-select: text;
11+
}
1012
.dx-chat-messagelist-content .dx-chat-messagegroup-alignment-start,
1113
.dx-chat-messagelist-content .dx-chat-last-messagegroup-alignment-start {
1214
column-gap: 0;

‎CS/ReportingApp/wwwroot/js/aiIntegration.js‎

Lines changed: 97 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -1,112 +1,114 @@
1-

2-
let lastUserQuery;
1+
const createAssistantTab = (function() {
32

4-
const assistant = {
5-
id: 'assistant',
6-
name: 'Virtual Assistant',
7-
};
3+
let lastUserQuery;
84

9-
const user = {
10-
id: 'user',
11-
};
5+
const assistant = {
6+
id: 'assistant',
7+
name: 'Virtual Assistant',
8+
};
129

13-
function normilizeAIResponse(text) {
14-
text = text.replace(/【\d+:\d+†[^\】]+】/g, "");
15-
let html = marked.parse(text);
16-
if (/<p>\.\s*<\/p>\s*$/.test(html))
17-
html = html.replace(/<p>\.\s*<\/p>\s*$/, "")
18-
return html;
19-
}
10+
const user = {
11+
id: 'user',
12+
};
2013

21-
function copyText(text) {
22-
navigator.clipboard.writeText(text);
23-
}
14+
function normalizeAIResponse(text) {
15+
text = text.replace(/【\d+:\d+†[^\】]+】/g, "");
16+
let html = marked.parse(text);
17+
if(/<p>\.\s*<\/p>\s*$/.test(html))
18+
html = html.replace(/<p>\.\s*<\/p>\s*$/, "")
19+
return html;
20+
}
2421

25-
async function getAIResponse(text, id) {
26-
const formData = new FormData();
27-
formData.append('text', text);
28-
formData.append('chatId', id);
29-
lastUserQuery = text;
30-
const response = await fetch(`/AI/GetAnswer`, {
31-
method: 'POST',
32-
body: formData
33-
});
34-
return await response.text();
35-
}
22+
function copyText(text) {
23+
navigator.clipboard.writeText(text);
24+
}
3625

37-
function RenderAssistantMessage(instance, message) {
38-
instance.option({ typingUsers: [] });
39-
instance.renderMessage({ timestamp: new Date(), text: message, author: assistant.name, id: assistant.id });
40-
}
26+
async function getAIResponse(text, id) {
27+
const formData = new FormData();
28+
formData.append('text', text);
29+
formData.append('chatId', id);
30+
lastUserQuery = text;
31+
const response = await fetch(`/AI/GetAnswer`, {
32+
method: 'POST',
33+
body: formData
34+
});
35+
return await response.text();
36+
}
4137

42-
async function refreshAnswer(instance) {
43-
const items = instance.option('items');
44-
const newItems = items.slice(0, -1);
45-
instance.option({ items: newItems });
46-
instance.option({ typingUsers: [assistant] });
47-
const aiResponse = await getAIResponse(lastUserQuery, assistant.id);
48-
setTimeout(() => {
38+
function RenderAssistantMessage(instance, message) {
4939
instance.option({ typingUsers: [] });
50-
RenderAssistantMessage(instance, aiResponse);
51-
}, 200);
52-
}
40+
instance.renderMessage({ timestamp: new Date(), text: message, author: assistant.name, id: assistant.id });
41+
}
42+
43+
async function refreshAnswer(instance) {
44+
const items = instance.option('items');
45+
const newItems = items.slice(0, -1);
46+
instance.option({ items: newItems });
47+
instance.option({ typingUsers: [assistant] });
48+
const aiResponse = await getAIResponse(lastUserQuery, assistant.id);
49+
setTimeout(() => {
50+
instance.option({ typingUsers: [] });
51+
RenderAssistantMessage(instance, aiResponse);
52+
}, 200);
53+
}
5354

54-
function createAssistantTab(chatId) {
55-
assistant.id = chatId;
56-
const model = {
57-
title: 'AI Assistant',
58-
showAvatar: false,
59-
showUserName: false,
60-
showMessageTimestamp: false,
61-
user: user,
62-
messageTemplate: (data, container) => {
63-
const { message } = data;
55+
function createAssistantTab(chatId) {
56+
assistant.id = chatId;
57+
const model = {
58+
title: 'AI Assistant',
59+
showAvatar: false,
60+
showUserName: false,
61+
showMessageTimestamp: false,
62+
user: user,
63+
messageTemplate: (data, $container) => {
64+
const { message } = data;
65+
const container = $container.jquery ? $container.get(0) : $container;
66+
if(message.author.id && message.author.id !== assistant.id)
67+
return message.text;
6468

65-
if (message.author.id && message.author.id !== assistant.id)
66-
return message.text;
69+
const textElement = document.createElement('div');
70+
textElement.innerHTML = normalizeAIResponse(message.text);
71+
container.appendChild(textElement)
6772

68-
const $textElement = $('<div>')
69-
.html(normilizeAIResponse(message.text))
70-
.appendTo(container);
71-
const $buttonContainer = $('<div>')
72-
.addClass('dx-bubble-button-containder');
73-
$('<div>')
74-
.dxButton({
73+
const buttonContainer = document.createElement('div');
74+
buttonContainer.classList.add('dx-bubble-button-container');
75+
const copyBtnElement = document.createElement('div');
76+
new DevExpress.ui.dxButton(copyBtnElement, {
7577
icon: 'copy',
7678
stylingMode: 'text',
77-
onClick: () => {
78-
const text = $textElement.text();
79-
copyText(text);
80-
}
81-
})
82-
.appendTo($buttonContainer);
83-
$('<div>')
84-
.dxButton({
79+
onClick: () => copyText(textElement.textContent)
80+
});
81+
buttonContainer.appendChild(copyBtnElement);
82+
const refreshBtnElement = document.createElement('div');
83+
new DevExpress.ui.dxButton(refreshBtnElement, {
8584
icon: 'refresh',
8685
stylingMode: 'text',
87-
onClick: () => {
88-
refreshAnswer(data.component);
89-
},
90-
})
91-
.appendTo($buttonContainer);
92-
$buttonContainer.appendTo(container);
93-
},
94-
onMessageEntered: async (e) => {
95-
const instance = e.component;
96-
instance.renderMessage(e.message);
97-
instance.option({ typingUsers: [assistant] });
98-
const userInput = e.message.text;
86+
onClick: () => refreshAnswer(data.component)
87+
});
88+
buttonContainer.appendChild(refreshBtnElement);
89+
container.appendChild(buttonContainer);
90+
},
91+
onMessageEntered: async (e) => {
92+
const instance = e.component;
93+
instance.renderMessage(e.message);
94+
instance.option({ typingUsers: [assistant] });
95+
const userInput = e.message.text;
9996

100-
var response = await getAIResponse(userInput, assistant.id);
101-
RenderAssistantMessage(instance, response);
102-
}
103-
};
97+
var response = await getAIResponse(userInput, assistant.id);
98+
RenderAssistantMessage(instance, response);
99+
}
100+
};
101+
102+
return new DevExpress.Analytics.Utils.TabInfo({
103+
text: 'AI Assistant',
104+
template: 'dxrd-ai-panel',
105+
imageTemplateName: 'dxrd-ai-icon',
106+
imageClassName: 'aitab',
107+
model: model
108+
});
109+
}
110+
111+
return createAssistantTab;
112+
})();
104113

105-
return new DevExpress.Analytics.Utils.TabInfo({
106-
text: 'AI Assistant',
107-
template: 'dxrd-ai-panel',
108-
imageTemplateName: 'dxrd-ai-icon',
109-
imageClassName: 'aitab',
110-
model: model
111-
});
112-
}
114+
window.createAssistantTab = createAssistantTab;

‎README.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
<!-- default badges list -->
2-
![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/853003889/24.2.2%2B)
32
[![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/T1252182)
43
[![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183)
54
[![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives)

0 commit comments

Comments
 (0)