Skip to content

Improve AI chat scroll behavior and header

Andrei Zubov requested to merge azubov-improve-ai-chat-header-positioning into master

What does this MR do and why?

Describe in detail what your merge request does and why.

This MRs fixes a few UI issues in ai_genie_chat component, that were revealed while integrating it into pipeline editor page:

  • Prevent title going out of screen when there are many messages in the chat

  • Scroll to the last message of the conversation on render

  • Add aria label to submit button

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

Demonstration of the issue: https://www.loom.com/share/dbc662e3b6764081b8b26f0d35b19228

Demonstration of the fix: https://www.loom.com/share/2173fc66f39b4a5cac722f3dfc4088eb

How to set up and validate locally

  1. Apply the following patch: pipeline_editor_chat.patch
  2. Navigate to a Project -> Ci/CD -> Editor (for example https://gdk.test:3443/flightjs/Flight/-/ci/editor?branch_name=master)
  3. If there's no .gitlab-ci.yaml file press Configure pipeline button Screenshot_2023-04-28_at_00.50.46
  4. On the editor screen press Ai assistant button (see video above) and interact with the chat.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Andrei Zubov

Merge request reports