[Task] Make a page to support sse stream return at the back end

[Yanshuming1]

We can make a small robot floating window on the front page, and after clicking on it, we can make an ai call, as shown in the figure below

After opening, there is a pop-up window, similar to wechat chat

supporting function：
1、Support back-end sse flow return。
2、Similar to wechat chat, you can communicate with ai
3、Can support pop-up full screen, easy to copy ai answer content

request path：/api/ai/get
request param name： text
request param type ： string

Task List

No response

[Yanshuming1]

@tomsun28

[ShineDevelopment]

I feel that I can add a small robot on the homepage and then do it in the robot, and I feel that it is not reasonable to do the search box on it

[Yanshuming1]

我觉得可以把首页加个小机器人然后在robot里做，感觉把搜索框做在上面不太合理

I feel that I can add a small robot on the homepage and then do it in the robot, and I feel that it is not reasonable to do the search box on it

This is really a good idea， @tomsun28 What do you think?

[tomsun28]

good idea👍

[hritikchaudhary]

I'd like to start contributing.

[hritikchaudhary]

Hi @Yanshuming1, I have a few questions regarding the requirements:

1. Please correct me if I'm wrong, but by "front page," I assume you mean the dashboard, i.e., the landing page that appears after logging into Hertzbeat.
2. If that's correct, I understand that I need to make changes to the DashboardComponent by adding a robot icon. When clicked, this icon will open a small window where users can enter a text query and click a "Send" button to submit the request to the specified endpoint.
3. Do you have any preferences for the icon, or can I choose one?
4. We don't use WeChat in my country, so could you please attach some screenshots to help clarify the requirements related to the window?

Thanks!

[Yanshuming1]

Hi @Yanshuming1, I have a few questions regarding the requirements:

1. Please correct me if I'm wrong, but by "front page," I assume you mean the dashboard, i.e., the landing page that appears after logging into Hertzbeat.
2. If that's correct, I understand that I need to make changes to the DashboardComponent by adding a robot icon. When clicked, this icon will open a small window where users can enter a text query and click a "Send" button to submit the request to the specified endpoint.
3. Do you have any preferences for the icon, or can I choose one?
4. We don't use WeChat in my country, so could you please attach some screenshots to help clarify the requirements related to the window?

Thanks!

1 If you can support this small robot pop-up window on all pages is the best, if not, then you can show it on the home page, that is, the first page to jump into the landing
2 Yes, click Send request backend sse stream back
3 You can choose the icon according to your own preferences, try to simplify the style, but you can know that this is for ai communication
4 You can refer to the chatgpt interface to send data and return, but we are pop-ups rather than a page

Add one thing：To support sse streaming returns, similar to chatgpt

[hritikchaudhary]

Hi @Yanshuming1
Update

1. The api endpoint is returning 404, can you elaborate how to correctly use that api
2. Full screen functionality is pending, although I added copy button to copy the ai response will that be enough or should I add full screen capability as well?
3. Attached herewith please find current status

Screen.Recording.2024-09-03.at.11.32.31.PM.mov

[hritikchaudhary]

Hi @Yanshuming1
Any input?

[Yanshuming1]

Hi @Yanshuming1 Update

1. The api endpoint is returning 404, can you elaborate how to correctly use that api
2. Full screen functionality is pending, although I added copy button to copy the ai response will that be enough or should I add full screen capability as well?
3. Attached herewith please find current status

Screen.Recording.2024-09-03.at.11.32.31.PM.mov

1 ：api configuration you can see in this article：https://hertzbeat.apache.org/docs/help/aiConfig/
2: We would like to do a full screen so that we can easily watch the answers

[Yanshuming1]

Hi @Yanshuming1 Update

1. The api endpoint is returning 404, can you elaborate how to correctly use that api
2. Full screen functionality is pending, although I added copy button to copy the ai response will that be enough or should I add full screen capability as well?
3. Attached herewith please find current status

Screen.Recording.2024-09-03.at.11.32.31.PM.mov

Or after you complete the requirements, I can help you verify

[hritikchaudhary]

Apologies, had to take sometime off... I'll try implement the rest and raise PR by this weekend.
Thanks!

[hritikchaudhary]

Hi @Yanshuming1 please check #2727 - I'm unable to config the ai endpoints as I wasn't able to translate the ai config docs
Maybe for configuring ai endpoints separate issue can be created I tested with large text as well and it is working please check the attached video