Add Ai assistant toggle button
What does this MR do and why?
Describe in detail what your merge request does and why.
This issue implements a frontend part for. https://gitlab.com/gitlab-org/gitlab/-/issues/407739+
I had to fork ai_genie_chat.vue
component, as the current implementation doesn't have all the features necessary for our use-case (for example proper rendering of code snippets with a copy button), and integration of features needed for us is currently under the review: !119030 (closed). Once it is merged, we'll switch to a common solution, which should be straightforward.
You can find additional information and a video presentation in the showcase issue: Ops Showcase Presentation: Conversational Inter... (gitlab-org/ci-cd/section-showcases#17 - closed)
Screenshots or screen recordings
https://www.loom.com/share/0a2736061a04465cad137d37adae109b
How to set up and validate locally
In order to test it locally you need a backend implementation. This feature relies on changes from this MR: !117924 (closed)
For your convenience I've prepared a patch that you can just apply and have all the neccessary backend changes integrated: ai_editor_backend.patch
After this patch is applied (or the MR is merged into your branch) you'll need to follow these steps:
-
Enable the feature flag for this feature
ai_ci_config_creator
Feature.enable(:ai_ci_config_generator)
-
Enable the
:openai_experimentation
feature flag that thellm_client
is behindFeature.enable(:openai_experimentation)
-
Run
rails c
then setup the api key locally. You have to request one: https://gitlab.slack.com/archives/C0517A9PZ8S/p1681445186381439Gitlab::CurrentSettings.update(openai_api_key: "<your-key>")
-
Then navigate to your gitlab-ci editor page, for example https://gdk.test:3443/flightjs/Flight/-/ci/editor?branch_name=master
-
Check that
AI Assistant
button is visible (the button should not be visible if the feature toggle is off). Click the button to show Ai Assistant drawer. -
Engage in a conversation with the chat bot. You should be able to see rendered
Note
To clear up the conversation you can use the following method:
rails c
- Destroy all messages
Ci::Editor::AiConversation::Message.destroy_all
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.