hertzbeat icon indicating copy to clipboard operation
hertzbeat copied to clipboard

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

Open Yanshuming1 opened this issue 1 year ago • 13 comments

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 image 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 avatar Jul 18 '24 05:07 Yanshuming1

@tomsun28

Yanshuming1 avatar Jul 18 '24 05:07 Yanshuming1

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

ShineDevelopment avatar Jul 19 '24 06:07 ShineDevelopment

我觉得可以把首页加个小机器人然后在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?

Yanshuming1 avatar Jul 19 '24 06:07 Yanshuming1

good idea👍

tomsun28 avatar Jul 19 '24 13:07 tomsun28

I'd like to start contributing.

hritikchaudhary avatar Aug 25 '24 14:08 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!

hritikchaudhary avatar Aug 29 '24 14:08 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!

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

Yanshuming1 avatar Aug 29 '24 16:08 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

https://github.com/user-attachments/assets/3390ca6f-c172-4de8-8398-561e1742a344

hritikchaudhary avatar Sep 03 '24 18:09 hritikchaudhary

Hi @Yanshuming1 Any input?

hritikchaudhary avatar Sep 08 '24 10:09 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

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 avatar Sep 09 '24 01:09 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

Yanshuming1 avatar Sep 09 '24 01:09 Yanshuming1

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

hritikchaudhary avatar Sep 17 '24 21:09 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

hritikchaudhary avatar Sep 19 '24 20:09 hritikchaudhary